はじめに
会社の後輩から、「案件の共有を受けて、メインビジュアルのデザインを制作するまでにどんな風に言語化しているか」と質問をもらいました。せっかくなので、普段の制作で「デザインする前」に自分なりに取り組んでいることを記事としてまとめることにしました。
ここで書く内容は毎回全てやっているというわけではなく、案件や納期によって少しアプローチを変えたりすることもありますが、大体の流れを記載します。
うまくいかず試行錯誤しながら進めることもあるので、他に良いやり方や参考にすると良い書籍などがありましたらアドバイスいただけると嬉しいです！
前提
この記事は、Webデザイナー3年目の私が、日々の業務の中で「デザインに入る前に何を考えているか」を整理した記録です。
普段は、小規模なLPやサイトのデザイン〜実装までを一人で担当することが多く、大規模案件やチーム制作とは考え方が異なる部分もあるかもしれません。
あくまで一つの視点として、参考にしていただければ嬉しいです。
思考のプロセス
1.リサーチ
案件の共有を受けた後は、なるべく多くの情報をリサーチします。
情報を把握しておくことで、最終的なサイトの確度や具体性を上げたいという狙いがあります。（あと単純にどんなクライアント・担当者なのか知りたい）
クライアントの業界クライアントの業界内でのポジションクライアントの会社HP、商材のHP、プレスリリース、会社のSNS、口コミ、評判、過去のメディア露出競合はどこか、競合のサイトはどんなコンテンツがありどんなトンマナなのか初回MTGの議事録・メモ。リピーターの場合、過去の案件がどんな感じだったか
集めた情報は、適宜メモツールやFigJamにまとめておきます。
2.コンセプト策定
情報がある程度集まったら、コンセプトを考えます。
私がよく使う考え方は「ステップ式」と「具体と抽象の往復」の2つです。
2-1.ステップ式でコンセプトを考える
一番参考にしているのがこちらのいぐちようすけさんのnote
『デザインするその前に。コンセプトをつくる6つのステップ！』
目的や課題などのステップを踏んでコンセプトを導き出すやり方です。
集めた情報を元に各ステップの内容を考えたり、ChatGPTと壁打ちして思考の整理をしながらコンセプトを考えます。
最初のステップである「目的」は、デザイン制作に入ったあとも要所要所で立ち返る根幹となります。迷いが生じた時や手が止まった時に「このサイトの目的はなんだっけ？」と振り返っています。
また、ここで考える内容は、なるべく論理的・客観的に納得できるものであることを目指します。なぜなら、クライアントやデザイナーの主観で目的やターゲットを考えると、方向性がずれていて問題解決に繋がらないことがあるためです。事実ベースでコンセプトを導き出すことで確度の高いサイトになると考えています。
2-2.具体と抽象の往復
クライアントとのヒアリングで出てきた情報やキーワードから適切なビジュアル表現を導き出す考え方です。このフレームワークは特に「らしさ」を表現したいときに有効だと思っています。
- 集めた情報を並べる
- 曖昧な言葉を分解する（具体化）
例：職人気質→どんなところが？細部へのこだわり？姿勢？
- 情報のグループ分けを行い、グループごとにキーワードを洗い出す（抽象化）
- 出てきたキーワードをさらに抽象化
- 抽象化が終わったらそれにあったイメージを探す
例：キーワードが「しなやかさ」だとしたら、それを表す色、かたち、表現はなにか
- 最終的に集まったイメージの要素をデザインに取り入れる
2-3.その他、考えること
利用シーンや訪れる人の感情・状況
どんな場所？時間帯は？急いで見る？ゆっくり見る？1回だけ見る？何度も見る？
利用媒体
PCで見る？スマホで見る？
入口と出口
サイトに訪れる人はどこから来てどこに出ていくのか？
リスティング広告、チラシのQRコード、検索、SNS…
クライアントの要望度合い
これは仕事の進め方にも影響が出る部分だと思います。
- クライアントの要望がまだ抽象的で固まっていない
提出するデザインはなるべく違う方向性を複数案提出して選びやすくする。方向性を探って、後からの修正を少なくするのと、デザイナー主導で進めやすくするため。提案と説明をとにかく丁寧に行う。 - クライアントがやりたいことやイメージが具体的に固まっている
基本的に要望に寄り添った提案をする。ただ、+αで提案できることはないか探す。デザイナー目線でより良い案を提案し、オペレーターではなく「一緒に作っていく」姿勢を示す。要望がズレているなと感じたらプロとしての自分なりの別案も提案するが、最終的にはクライアントの判断を尊重する。
3.参考探し
コンセプトが固まってきたらギャラリーサイトなどから参考を探します。
クオートワークスさんの記事が参考になります。
『muuuuu.org運営者が教える名著「アイデアのつくり方」に倣った、Web制作における参考サイトの探し方』
個人的な悩みとしては、スタイリングの参考としてAwwwardsなど海外のサイトを探すのですが、海外の尖ったデザインと実案件とを結びつけるのが難しく、探すのに苦戦してしまいます。 これは案件が決まってから探すのではなく普段のインプットで表現のストックをしておく必要があるのだろうなと認識しています。
4.デザイン制作に着手！
1〜3の工程を経て制作に着手します。 手が止まってしまった時はいままでの工程を振り返りながら進めていく感じです。
今後やっていきたいこと
ラフを描く
普段のデザイン制作では、ラフは基本描くことなく、いきなりツール上で制作にあたっているのですが、頭の中にあるアイディアをたくさん出すには描いたほうがいいのかも。（デザイン勉強し始めのときは描いていた記憶があるのに、いつの間にか描かなくなってしまっていた…）
型にこだわらず自由に発想する
例えば一つのビジュアルやキーワードからアイディアを派生させていったり、クライアントと意見を重ねて行ったりデザインの作り方は色々あると思うので案件によって柔軟に進め方を選べるようになりたいです。
購入して軽く読んだままでしたが『アートディレクターの流儀 考え方・つくり方のデザインストーリー』にさまざまな制作過程のストーリーが掲載されているのでまずは読み込んでみます！
おわりに
「デザインする前」に考えていることを整理してみましたが、改めて“考えること”がデザインの一部であると感じています。誰かの思考整理の一助になれば幸いですし、他にもこういうアプローチがあるよ！という方がいればぜひ教えてください。
コメント