Web Designing 2017年10月号

※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字だけを拡大することや、文字列のハイライト、検索、辞書の参照、引用などの機能が使用できません。

AI実践ガイド／生成AI時代の「文章力」

⚫︎第1特集
デザイン業務を変える“視点”と“仕組み”
事例で学ぶ「AI実践ガイド」

2024年8月号の特集「AIとクリエイティビティ」では、AIとデザインの関係性を探りました。当時は、デザイン業務におけるAI活用が「そう遠くはないが、まだ未来の話」のように感じられたものです。

あれから1年4カ月。AIはすでに制作に欠かせない存在となり、特にコーディングとの相性は言うまでもありません。一方で、デザイナーの業務では、いまだ活用が進んでいないのが現状ではないでしょうか。

今号では、デザイナーの仕事におけるAI活用に焦点を当て、周辺業務も含めた実践的な事例を紹介します。今すぐ取り入れられる具体的な活用法を通じて、AIとの協働がもたらす新たな可能性を探ります。これからの制作現場に必要な視点と技術を、ぜひこの「AI実践ガイド」で手にしてください。

【対談】
AIはデザイナーのパートナーとなり得るか
川村将太 （エクスペリエンスデザイナー）& 小木曽槙一 （プロダクトデザイナー）

【活用事例①】
活用と推進体制構築の先端事例から
「AI時代の『デザイン組織』のつくり方」
植田香梨 （株式会社ログラス）

【活用事例②】
社内で、現場で、AI をどう活用する？
「組織を強くする、AIとの向き合い方」
伊藤セルジオ大輔（株式会社マネーフォワード）


【解説・実践編①】
企画・デザインから開発まで担う
「横断型デザイナーのAI仕事術」
林貴洋 （株式会社LayerX ）

【解説・実践編②】
使って納得、業務フローが変化する
「AI活用ワークブック」
鈴木慎吾 （株式会社つみき）

【解説・実践編③】
Figma AIのできること
「実務でどこまで通用するのか？」
綿貫佳祐 （株式会社エイチームホールディングス）

【解説・実践編④】
必要な場面でどう上手に使いこなすか？
「日常業務でのAIの使い方」
國光俊樹 （株式会社 Algomatic）

【コラム①】
「問いを立てる力」がカギ！
「AI活用の見極め方とプロンプトのコツ」
椎橋寅次郎 （株式会社Gaudiy）

【コラム②】
効率化と独自性を両立！
AI時代の制作ワークフロー構築
綿貫佳祐 （株式会社エイチームホールディングス）

⚫︎第2特集
“書く”の先にある“伝える力”を身につける
生成AI時代の「文章力」

いまやAIは、いい感じの文章を凄まじいスピードで、大量に生成してくれるようになりました。しかし、こんな時代だからこそ「人が書く文章の価値が高まっている」と話すのが、長年にわたって文章編集・校正現場の最前線に立ち、雑誌、Web、広告コピーライティングと、多岐にわたる制作に携わってきたテキストコンテンツのプロ、松井謙介さん。ここでは松井さんと一緒に「文章力」の必要性を徹底的に考えてみようと思います。

・いま、なぜ「文章力」を推すのか？
・Q＆A形式で身につける「文章力」
・対談：AI 時代の「文章力」のポイントは「編集力」の向上にあり!?
　酒井新悟（株式会社RIDE）
・文章力を高めるのに役立つ本

⚫︎連載
・What's On PLUS
・What's On
・GOTO-CHI CREATIVE! with iDID
・Books Web Designing
・Perspective 新著者：一ノ瀬雄太（CEKAI）／ DJサモハンキンポー（CHA CHA CHA BOOKS）
・佐藤村田のAI広告実験室
・文章力を上げる鉄板ルール
・データのミカタ
・知的財産権にまつわるエトセトラ
・デザインの手前
・gestures（特別編集版）
・今、気になる一冊
・日本語の組み方
・洗練されたデザインのつくり方



※この商品は固定レイアウト型の電子書籍です。
※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字列のハイライトや検索、辞書の参照、引用などの機能が使用できません。
※お使いの端末で無料サンプルをお試しいただいた上でのご購入をお願いいたします。

※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字だけを拡大することや、文字列のハイライト、検索、辞書の参照、引用などの機能が使用できません。

UX理論とUI設計の実務ガイド「UI/UX 理解と実践」／ 「CMSの選び方2025」

⚫︎第1特集：UX理論とUI設計の実務ガイド
「UI/UX 理解と実践」

Web Designingではこれまでに何度も、UI/UXをテーマとして取り上げてきました。振り返ってみると、それぞれの特集には、変わらず重要とされる視点と、その時代ならではの課題や潮流が織り込まれていたことに気づかされます。

しかし、まだ果たせていないことがありました。それは、「UI」と「UX」の定義についてです。ひとつの言葉として「UI/UX」と括られるこの領域ですが、両者がそれぞれ何を指し、どう関係し合っているのかを、いまこそ丁寧に見つめ直す必要があると感じています。

本特集では、そうした思いを出発点にUI/UXの現在地を見渡しながら、実践に活かせる視点を探っていきます。


【対論】
UXデザインはWeb制作に活かせるのか
金成奎 （プロダクトデザイナー / UIデザイナー / Webデザイナー）／ 佐々木祐真 （株式会社アイスリーデザイン）

よりよいユーザー体験のためのデザインへ
なぜ、UXの視点が必要なのか？

【講座】
UX視点のWebデザイン制作「実践講座」
金成奎 （プロダクトデザイナー / UIデザイナー / Webデザイナー）

【ケーススタディ01-スマホアプリ編】
どの年齢層も“使いやすく” “使いたくなる”
生活導線に寄り添うUX
栃尾行美 （株式会社グッドパッチ）

【解説01】
「モデルベースUI デザイン」を道標にする
UI Design for UX
丸怜里 （ソフトウェアデザイナー ／ デベロッパー）

【ケーススタディ02-Webサイト編】
ブランディングとUX
ハラヒロシ （有限会社デザインスタジオ・エル）

【解説02】
さまざまな「声」を引き出し、デザインを探る
Web Design for UX
細尾正行 （株式会社スピッカート）

【コラム】
UX視点で変わる日本の医療現場 ／ 北村竜也 （メディカルデザインラボ株式会社）
UXが“当たり前”の社会とは ／ 藤井賢二、小林秀彰、内山堅 （株式会社たきコーポレーション / IDEAL）
Liquid Glassは制作をどう変えるのか ／ 広野萌 （一般社団法人デザインシップ）

UXについてもっと学びたい！
次に読むべき深掘りの10冊


⚫︎第2特集：目的別ケーススタディ「CMSの選び方2025」
監修：山﨑貴史 （株式会社コンセント）

CMSを選ぶとき、つい機能やコスト、トレンドに目が向きがちですが、本当に重要なのは「自社の課題をきちんと解決できるか」という視点です。

どんな目的を達成したいのか、どんな運用が求められるのかといった前提条件を丁寧に整理することが、CMS選定の成否を左右します。

本特集では、サービスデザインの視点から数多くのCMS導入を支援してきたデザイン会社、コンセントの山﨑貴史さんにお話をうかがい、いま改めて見直したいCMS選びの本質と、課題別の判断軸を整理していきます。

【イントロダクション】
CMS選びの一番の基準は「課題に対して有効なCMSかどうか」

【目的別ケーススタディ】
Case 1静的ファイルを出力する構成でセキュリティを強化
Case 2ドメイン取得からCMSの設置までワンストップで
Case 3クラウドCMSで管理コストを低減
Case 4多段階の承認フローや、適時開示を実現
Case 5ワンソース・マルチユースのヘッドレスCMS
Case 6CMSの代わりに既存のメディアサービスを利用

【付録】
編集部オススメ！「商用CMS紹介」


⚫︎連載
・What's On PLUS
・What's On
・GOTO-CHI CREATIVE! with iDID
・Books Web Designing
・Perspective 新著者：一ノ瀬雄太（CEKAI）／ DJサモハンキンポー（CHA CHA CHA BOOKS）
・佐藤村田のAI広告実験室（新連載！）
・文章力を上げる鉄板ルール
・データのミカタ
・知的財産権にまつわるエトセトラ
・デザインの手前
・gestures
・今、気になる一冊
・日本語の組み方
・洗練されたデザインのつくり方



※この商品は固定レイアウト型の電子書籍です。
※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字列のハイライトや検索、辞書の参照、引用などの機能が使用できません。
※お使いの端末で無料サンプルをお試しいただいた上でのご購入をお願いいたします。

※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字だけを拡大することや、文字列のハイライト、検索、辞書の参照、引用などの機能が使用できません。

事例で学ぶ！ 運用・管理とコミュニケーション 「Figmaとデザイン」／ デザインリサーチの基礎と実践

⚫︎第1特集：事例で学ぶ！ 運用・管理とコミュニケーション
「Figmaとデザイン」

「Figma」はもはや単なる「デザインを制作するためのツール」ではありません。アイデアを視覚化し、議論し、形にしていく―そのすべてのプロセスを支えるコラボレーションとコミュニケーションのプラットフォームへと進化しています。

ツールが優れているからといって、デザインの質が上がるとは限りません。しかしひとたびキャンバスに向かうと、“ひとりの想像”がいつしか“みんなの創造”に変わっていく。デザインは個人の作業から、チームによる共創へと姿を変えていきます。そしてFigmaは、そんな体験をこれからのクリエイティブの「新しい常識」として、静かに、でも確かに広げていきます。

今号はFigmaの特集ですが、たくさんの事例を通して、“クリエイティブの新常識”を形取る試みでもあります。皆さんの業務に役立てば幸いです。


【レポート】
現地サンフランシスコの熱狂を密着取材！
Figma Config 2025

【座談会】
Figmaは制作現場の何を変えたのか？
綿貫佳祐 （株式会社エイチームホールディングス）／ 石井克尚 （株式会社グッドパッチ） / 坪内陽佑 （フェンリル株式会社）

【イントロダクション】
Figmaが“ゲームチェンジャー”である理由

【解説】
・共同制作を支える運用ノウハウ
山口暁亭 / 西村愛美 （株式会社レアゾン・ホールディングス）

・「Spindle」に学ぶ 新機能の取り入れ方
本田雅人 / 原一成 （株式会社サイバーエージェント）

・“自動実装”に向けたMCP活用
渡辺智保子 / 江崎広太 （Ubie株式会社）

・「Sparkle Design」に見る Figma × デザインシステム構築術
甲斐田愛華 / 乗田拳斗 / 矢吹ナスカ （株式会社グッドパッチ）

【CaseStudy】
01_弁護士ドットコム
ライブラリ分散と自動化でトークン管理
林とも子 / 井上大嗣 / 細貝未紀 （弁護士ドットコム株式会社）

02_SmartHR
共同作業の“ブレ”を低減させるためには？
植田将基 （株式会社SmartHR）

【コラム】
デザインとワークフローの視点から考える
Figma×AIの「現在地」
鈴木慎吾 （株式会社つみき）

学びの場で、誰もがデザインと出合える時代へ
先生たちのFigma / FigJam事情2025
ローレン・マッキャン （Figma） / 柴田直樹 （鎌倉学園中学校・高等学校）／ 茂田可愛 （Canadian Academy）

現場の制作者がおすすめする
Figmaプラグイン集＆学び方


⚫︎第2特集：仮説を通じて課題に向き合う「デザインリサーチの基礎と実践」

「デザインリサーチ」とは、Webサイトやプロダクト、サービスを設計・開発する際に、ユーザーの行動やニーズ、価値観、課題などを深く調査し、分析するプロセスのこと。近年は、オンラインインタビューを実施できる環境が整い、企業内で制作担当者が自らデザインリサーチを行う動きが広がっています。

一方で、多くの事業会社では専門的にリサーチを行う部門や担当者が少なく、制作に携わる人たちの間でもデザインリサーチの理解が浸透していないのが実情です。

本特集では、「仮説」を切り口にデザインリサーチの現場で直面しやすい課題と対応策に着目。『ユーザーリサーチのすべて』（マイナビ出版刊）の著者・菅原大介さん監修のもと、BtoBとBtoCの領域で実務に取り組む皆さんとともに、現場で活用できるノウハウを解説します。

考え方を広げまとめながら、課題の本質に迫っていこう！
なぜデザインリサーチで「仮説」が必要なのか？

仮説探索
「よくある課題と解決策」
01_顧客の声（Voice of Customer）の存在を知ろう！
02_調査データに基づく「現状理解」から始めよう！
03_調査目的や初期仮説に則り、現場で話題の「選択と集中」を実行する

仮説検証
「よくある課題と解決策」
01_ルールや根拠に基づくデザインの評価を行おう！
02_関係者の発話や討議を引き出す「場」を設定しよう
03_判断基準となるクリエイティブの軸をつくっておこう

使いやすく試しやすい。環境づくりに知っておきたい
デザインリサーチのためのツール3選


⚫︎特別企画
KDDIコーポレートサイト リニューアルの舞台裏
平藤篤 （株式会社マルチプル） / 小玉千陽 （株式会社ium）
難波貴則 / 茨木誠也 （KDDI株式会社）
瀧野哲史 / 杉山諒 （株式会社アマナ）


⚫︎連載
・What's On PLUS
・What's On
・GOTO-CHI CREATIVE! with iDID
・Books Web Designing
・Perspective 新著者：一ノ瀬雄太（CEKAI）／ DJサモハンキンポー（CHA CHA CHA BOOKS）
・モヤモヤバスターズ（ゲスト：近藤春菜 ハリセンボン）
・文章力を上げる鉄板ルール
・データのミカタ
・知的財産権にまつわるエトセトラ
・デザインの手前
・gestures
・今、気になる一冊
・日本語の組み方
・洗練されたデザインのつくり方




※この商品は固定レイアウト型の電子書籍です。
※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字列のハイライトや検索、辞書の参照、引用などの機能が使用できません。
※お使いの端末で無料サンプルをお試しいただいた上でのご購入をお願いいたします。

※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字だけを拡大することや、文字列のハイライト、検索、辞書の参照、引用などの機能が使用できません。

3DCGアニメーションで魅せる！「Blender & Lottie完全ガイド」／ 伝わるサイトの黄金ルール

⚫︎第1特集：3DCGアニメーションで魅せる！「Blender & Lottie完全ガイド」

Webサイトで目に留まった動きやグラフィックに、心を奪われた瞬間を覚えていますか？
それがどんなに些細なものであっても、一瞬で見る人の感情を動かすことができる。これこそがWebデザインの力です。

今号の特集では、そんな力を生み出すためのツール「Blender」と「Lottie」に焦点を当てました。3DCGのモデリングやアニメーション制作から実装まで、これらのツールを使いこなすための解説を、Web制作の実務を想定しながら行いました。

新しい表現方法を学べるだけでなく、皆さんが手がけるWebデザインの可能性が広がることにつながると信じて、本特集をお届けします。ぜひ、日々の制作に役立ててみてください。


【イントロダクション】
業界のトレンドを「現場目線」で語る
“Web制作+3DCG” 現状と可能性
阿部文人（necco Inc.） / 長野真理（necco Inc.） / 豊田メル（スタジオディテイルズ）

【Blender入門ガイド】
人気3DCG作成ツールの基礎知識と使い方をマスターしよう！
necco Inc. 監修・執筆

・Blenderで3DCGアニメーションをマスターする
Blenderの基礎知識 ／ Blenderで3DCGをつくって動かしてみよう ／ 制作事例で見るBlender活用テクニック
CaseStudy_3DCGの表現力で世界観を伝える - 「Junni is...」（株式会社ジュニ）

【Lottie入門ガイド】
Lottieで高品質・軽量なアニメーションを書き出す
necco Inc. 監修・執筆

・Lottieでアニメーションを書き出し・実装してみよう
Lottieの基礎知識 ／ アニメーションを書き出す ／ 制作事例に見るLottie活用テクニック
CaseStudy_さりげない「動き」で洗練された世界観を演出 - 「unium - 描く想いを価値にする」（株式会社アールイーデザイン）

【プロに学ぶ映像制作のロジック】
「構成」と「演出」の設計術
shuntaro（bird and insect） ／ 浦翔也（bird and insect）

【コラム】
プロンプト記述力ではなくコミュニケーション力が鍵！
ChatGPTとつくるWebアニメーション
向田祐平（MASKMAN Inc.）

「目的達成」の意識を忘れずに！
アニメーション・3DCGの導入基準
藤原明広（株式会社MEFILAS） ／ 川上直毅（株式会社MEFILAS） ／ 大藤晃司（株式会社MEFILAS）

【3DCG制作ツール最前線】
現場が選んだ注目の3DCG制作ツール


⚫︎第2特集：ギャラリーサイト運営者と考える「伝わるサイトの黄金ルール」

「制作会社のコーポレートサイト」と「個人のポートフォリオ」という、“自己表現”をテーマに、「情報を伝わるものにする」ためにどうすればいいのかについて、ギャラリーサイト運営者の方々とともに考えてみることにします。自社サイトをリニューアルしたいと考える制作会社、ポートフォリオを作成・充実させたいと考える制作者・クリエイターにとって参考になる情報を提供するだけにとどまらず、日常の制作へのヒントも数多く含まれる内容です。

伝わる「自己表現」について考えてみる_01
“あのWeb制作会社”のコーポレートサイトはどこがスゴいのか？
加藤亮平（TRACE）× ムラマツヒデキ（QUOITWORKS）

伝わる「自己表現」について考えてみる_02
“あのクリエイター”のポートフォリオサイトはなぜ人を惹きつけるのか？
加藤亮平（TRACE）× トム・イシカワ(ウェブスタッフ株式会社・GOOD PORTFOLIO)

ポートフォリオ制作支援サービス「MATCHBOX」に学ぶ
個人ポートフォリオ作成 その急所とは
萱沼守（株式会社マイナビワークス） ／ 吉見幸浩（株式会社マイナビワークス）


⚫︎特別企画
「ルーキーズキャンプ」で学ぶWebディレクターの“実践力”
江辺和彰（株式会社コンセント）


⚫︎連載
・What's On PLUS
・What's On
・GOTO-CHI CREATIVE! with iDID
・Books Web Designing
・Perspective 新著者：一ノ瀬雄太（CEKAI）／ DJサモハンキンポー（CHA CHA CHA BOOKS）
・モヤモヤバスターズ（ゲスト：近藤春菜 ハリセンボン）
・文章力を上げる鉄板ルール
・データのミカタ
・知的財産権にまつわるエトセトラ
・デザインの手前
・gestures


※この商品は固定レイアウト型の電子書籍です。
※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字列のハイライトや検索、辞書の参照、引用などの機能が使用できません。
※お使いの端末で無料サンプルをお試しいただいた上でのご購入をお願いいたします。

※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字だけを拡大することや、文字列のハイライト、検索、辞書の参照、引用などの機能が使用できません。

共感を生み、価値を伝える「デザインとストーリー」／プロジェクトマネジメントの本質

⚫︎第1特集：共感を生み、価値を伝える「デザインとストーリー」

この特集は、デザインを「ストーリー」という視点から捉えてみる一つの試みです。どこかにあるかもしれない正解を求めるわけではなく、結論めいたものを導く特集でもありません。デザインとストーリーにはどんな関係があるのか、共感をキーワードに手探りで見つけていくような内容です。
UI/UXやデザイン思考、デジタルマーケティング等でストーリーという言葉が使われることがありますが、ここでは物語それ自体、あるいはコミュニケーションを軸に据えたものなど、あえて範囲を絞りませんでした。ただし、すべての記事に共通するのは、デザインについて考えるためのきっかけづくりです。この特集が、デザインについて再認識するきっかけとなり、その可能性を広げるための一助となれば幸いです。


【イントロダクション】
ポッドキャスト連動企画「デザインの手前」特別編集版
「アイデアの先、ストーリーの手前」
川村真司 （Whatever）／ 原田優輝 （カンバセーションズ）／ 山田泰巨

【鼎談】
なぜデザイナーがストーリーを語るべきなのか？
「ストーリーとデザイナー」
小山和之 （designing）／ 國光俊樹 （Algomatic）／ 花城泰夢 （BCG X）

【デザインとストーリーにまつわる“誌上講義”】
Figma流 “人を動かす”ストーリー構築術
コーリー・リー （Figma））／ 谷拓樹 （Figma）

【ブランディングとストーリー】
Studioのリブランディングが紡ぐストーリー
石井穣（Studio）／ アルバロ・アレギ （Nuevo.Studio）

【“共感”が生まれるところ】
「共感を生む脳のメカニズムとは？」
奥山輝大（東京大学 定量生命科学研究所）

【共感を理解するためのリファランス集】
共感の力を知るための「15のヒント」

【対談】
tofubeats × GraphersRock
「アートワークは音楽の世界観をどう伝えるのか？」

【ストーリーの型と構造】
起承転結、序破急……「型」を身につけて構成力をアップさせよう
「“温故知新”で学ぶ 物語の構造」

【寄稿】
ニッチな物語（ストーリー）とマクロな物語性（ナラティブ）/ 橋本麦（映像作家）
愛とシニカルを携えて ／ 塩谷舞（文筆家）
物語があふれていく時代に ／ 入江悠（映画監督 / 脚本家）

【コラム】
ホラーコンテンツならではのストーリー構築術とは？
「恐怖=楽しい」へ導く“闇の手法” ／ 頓花聖太郎 （闇）

「料理の楽しさ」の伝え方
“愛されるレシピ”のストーリー ／ 小堀紀代美（LIKE LIKE KITCHEN）

【リサーチとストーリー】
物語を紡げば、アイデアが動き出す！
「ユーザーリサーチはストーリーで共有しよう」
菅原大介



⚫︎第2特集：“計画”と“会議”がその後を決める「プロジェクトマネジメントの本質」

多様で複雑化する社会状況を背景に、制作手法は多岐に渡り、人や組織によって働き方も異なります。だからこそプロジェクトの推進には、全体の動きを把握するプロジェクトマネジメント（以下PM）が欠かせません。実務で活かせるPMのあり方を、事前の「計画」とプロジェクトの進行に欠かせない「会議」という2つの切り口を中心に、解説します。

取材協力＆監修：株式会社コパイロツト


多様で複雑……時代の変化の波をどう捉えるか？
「プロジェクトマネジメントを巡る世の中の状況を知ろう」

迷わずプロジェクトを進めるための2大要素
「プロジェクトマネジメントで必ず押さえるべきことは？」

〈PART 1〉
●プロジェクト計画を立てよう！
●プロジェクトマネージャーは“兼任”でもOK？
etc……

〈PART 2〉
●適切に会議を進めよう
●会議体を見直す判断はどうすればいい？
etc……


⚫︎特別企画
「ルーキーズキャンプ」で学べる“ロジカルなデザイン”の秘訣
金成奎（UI/UXデザイナー ／ Webデザイナー）


⚫︎連載
・What's On PLUS
・What's On
・GOTO-CHI CREATIVE! with iDID
・Books Web Designing
・Perspective 新著者：一ノ瀬雄太（CEKAI）／ DJサモハンキンポー（CHA CHA CHA BOOKS）
・モヤモヤバスターズ（ゲスト：近藤春菜 ハリセンボン）
・文章力を上げる鉄板ルール
・データのミカタ
・知的財産権にまつわるエトセトラ
・gestures


※この商品は固定レイアウト型の電子書籍です。
※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字列のハイライトや検索、辞書の参照、引用などの機能が使用できません。
※お使いの端末で無料サンプルをお試しいただいた上でのご購入をお願いいたします。