【翻訳】ムードボードでインスピレーションを形にする（Cameron Chapman, Toptal）

www.toptal.com

デザインプロジェクトのためのインスピレーションを見つけるのは大事ですよね。でも、それを整理して、クライアントやユーザーを驚かせるデザインを生み出すための、よりまとまりのあるベースとすることは、まったく別のことです。

その解決策は？ムードボードです。

ムードボードは、画像、素材、テキスト、その他のデザイン要素を、最終的なデザインのスタイルを代表するフォーマットにアレンジした、物理的またはデジタルなコラージュです。ムードボードは、ブランドデザイン、プロダクトデザイン、ウェブサイトデザインなど、あらゆるタイプのデザインプロジェクトの作成に使用できます。

基本を理解する

ムードボードは何をするものなのか？

ムードボードは、プロジェクトのインスピレーションを整理することから始まり、さまざまな目的に使用されます。ムードボードは、プロジェクトのスタイルや美的感覚を、クライアントの目標や期待に合致させるための貴重なリソースです。また、実際のデザインプロセスに入る前に、プロジェクトのスタイルを洗練させるための優れた方法でもあります。

グラフィックデザインにおけるムードボードとは？

ムードボードは、画像、素材、テキスト、その他のデザイン要素を、最終的なデザインのスタイルを代表するフォーマットにアレンジした、物理的またはデジタルなコラージュです。ムード> ボードは、ブランドデザインやプロダクトデザインなど、あらゆるタイプのデザインプロジェクトの作成に使用することができます。

デザインにおけるメタファーとは？

デザインにおけるメタファーとは、ゴミ箱が削除を意味し、紙飛行機が送信を意味するなど、ユーザーがインターフェイスを理解したり操作したりするための手がかりを与えるものです。

ムードボードの目的

ムードボードは、プロジェクトにまつわるインスピレーションを整理することから始まり、多くの目的を果たすことができます。また、デザインプロジェクトを通して、スタイルや美的感覚を一貫させ、クライアントの目標や期待に沿うようにするための貴重なリソースとなりえます。

また、ムードボードは、実際のデザインプロセスに入る前に、プロジェクトのスタイルを洗練させるための優れた方法です。モックアップやプロトタイプに比べ、リソースや時間をかけずに、最終的なデザインのルック＆フィールについて多くのことを伝えることができます。

画像、イラスト、ロゴ、タイポグラフィー、カラーを取り入れたムードボードは、優れたコミュニケーションツールになります。(by Diffusion Digital)

ムードボードは、クライアントにデザインのアイデアを伝えるための優れた手段でもあります。ウェブデザイナーが「ミニマリスト」「グロテスクフォント」「リアリズム」と言っても、多くのクライアントはそれが何を意味するのかまったく理解できないでしょう。しかし、それらを取り入れたムードボードを見せれば、すぐに理解し、そのアイデアが好きか嫌いかを表現できるようになります。

最後に、ムードボードは、デザインチームが一緒にプロジェクトに取り組む際に、全員が同じ考えを持っていることを確認することもできます。あるデザイナーの考えるミニマリストは、同僚の考えるマキシマリストよりはるかに多いかもしれません。

ムードボードの作り方

ムードボードの作り方は1つだけではありません。ムードボードには、さまざまなフォーマット、形状、スタイルがあります。デジタルで作成するデザイナーもいれば、物理的なコラージュを作成するデザイナーもいます。デジタルでムードボードを作成する場合は、Photoshopのテンプレートや専用アプリなど、さまざまなオプションが用意されています。

写真や色見本を使って、物理的なムードボードを作成するのもひとつの方法です。(by Planoly)

ムードボードに盛り込むべき内容

ムードボードはそれぞれ異なり、デザイナーが何を含めるかは、プロジェクトによって異なります。ブランドのムードボードは、パッケージやウェブサイトのデザインよりも多くの要素を含むかもしれません。重要なことは、作成するデザインのルック＆フィールを伝えるために必要な要素をできるだけ多く含めることです。

ここでは、ムードボードに含めるべきもののアイデアをいくつか紹介します。

画像：ブランドイメージ、ストックフォト、製品イメージ、Instagramや他の写真共有サイトで見つけた写真、イラスト、そしてロゴなど。
色：デザインのカラーパレットを取り入れることは、ほとんどのムードボードで重要な要素であり、見本として、または画像やその他のデザイン要素に取り入れることができます。
視覚的なメタファー：視覚的なメタファーは、現代の広告やブランディングの重要な部分であり、適切であれば含めることができます。
言葉：ブランドや伝えるべきメッセージに関連する言葉は、ムードボードの重要な要素になります。
フォント：デザイナーは、テキストが目立つようなデザインの場合、特定のフォント（または少なくとも一般的なフォントスタイル）をムードボードに含める必要があります。
テクスチャ：デザインが取り入れるテクスチャやパターンは、ムードボードに含めるべきです。
説明：必要に応じて、ムードボードに含まれる要素の説明は、文脈を追加し、すべての異なるパーツが最終的なデザインに向けてどのように機能するかを容易に理解することができます。

ムードボードのさまざまな要素に説明を加えることで、提示されたアイデアがより明確になります。(by Emily Holt)

テーマを決めると、ムードボードだけでなく、それをもとにした最終的なデザインにもまとまりを持たせることができます。テーマは、抽象的でもよいのですが、デザインやブランドの目標に密接に結びついていることが望ましいです。たとえば、子供服のサイトでは、ジャングルやカーニバルをテーマにしているかもしれませんが、だからといって、トラやピエロを取り入れる必要はないでしょう。その代わりに、自然な質感や原色を取り入れたムードボードを作成することができます。

ムードボードのインスピレーションを集める

ムードボードのインスピレーションは、ほぼどこからでも得ることができます。デザイナーはインスピレーションをスワイプファイルで保存していることが多いので、まずはそこから始めるとよいでしょう。その他にも、ストックフォトサイト、デザインギャラリー、Coolors.coやDesign Seedsなどのカラーパレットサイト、物理的な環境や物、Typewolfなどのタイポグラフィーギャラリー、ソーシャルメディア（InstagramやPinterestは特にデザインのインスピレーションを見つけるのに適しています）などを参考にしてみてください。

ムードボードのためのインスピレーションを集めるとき、デザイナーは完成したプロジェクトの目標を念頭に置いておく必要があります。また、ブランド価値やターゲットとなるユーザー像も念頭に置く必要があります。これらはすべて、収集するインスピレーションの種類に大きな影響を与えます。

例えば、法律事務所のウェブサイトと、ティーンエイジャー向けのストリートファッションサイトでは、トーンやスタイルが大きく異なるでしょう。デザイナーがムードボードの制作を始める際に、これらの違いを念頭に置いていなければ、完成したボードがクライアントの心に響くことはないでしょう。

ムードボードのすべての要素が、完成したデザインに直接、あるいは文字通り関連している必要はありません。感覚や一般的なスタイルを呼び起こす画像を見つけることは、特定のフォント、色、デザイン要素と同じくらい重要です。

ムードボードのフォーマット

ムードボードは、物理的またはデジタルなフォーマットで作成することができます。どちらにも長所と短所があります。

物理的なムードボードは、デジタルデザイナーが画面の枠を越えて考えるのに役立ちます。物理的な世界から多くのインスピレーションを得るプロジェクトには、最適な方法です。しかし、多くの印刷を必要とし、作成に少し手間がかかることもあります。また、物理的なムードボードは、アーカイブしたり、クライアントや他のチームメンバーと共有したりするのが難しい場合があります（最良の共有方法は、写真を撮ることです）。

Margauxの製品ムードボードは、物理的なムードボードの素晴らしい例です。(Margauxによる)

一方、デジタルムードボードは、日常的に使っている同じツールを使うことになるため、デザイナーの創造性を制限してしまうことがあります。それが悪いことではない場合もありますが、本当にユニークなデザインを考えようとするときには、妨げになることもあります。デジタルムードボードは、画像ファイルとしてエクスポートして共有するだけなので、とても簡単です（プログラムによっては、直接共有できるものもあります）。

デジタルムードボードは、クライアントや他のチームメンバーにデザインスタイルを提示するための、とても洗練された方法です。(by Milanote)

ムードボードのソフトウェア

ムードボードを作成するためのソフトウェアには、さまざまな選択肢があります。すでに使用しているデザインプログラムであれば、ほぼすべて使用できます（ほとんどのプログラムでテンプレートも用意されています）。その他のオプションもあります。

Pinterest：プロジェクトごとにボードを作成すると、オンラインで見つけたアイデアを整理するのに便利です。ボードは、公開または非公開にすることができます（特定の個人と共有することもできます）。
Moodboard：アカウント不要で、無料でムードボードを作成できます。テンプレートがあるので、すぐに始められますし、白紙のデザインから作ることもできます。
Moodzer：Moodzerは新登場（現在はベータ版）ですが、共有しやすい魅力的なムードボードを作成するために必要なすべての機能を備えているようです。
Adobe Express：Adobe Expressは、他のAdobe製品とうまく連携できるフォーマットでムードボードを簡単に作成できます。ストックフォト、フォント、デザインエレメントのライブラリーを用いて、様々な形やサイズのムードボードを作成するための柔軟性を十分に備えています。
Canva：Canvaにはムードボードテンプレートがあり、さまざまなフォント、デザインエレメント、ストックフォトが内蔵されています。

Canvaで作成したミニマムなムードボードのレイアウト例。（by Cameron Chap）

とはいえ、ムードボードの作成に使用するソフトウェアは重要ではありません。重要なのは、創造性を刺激し、クライアントや他の意思決定者と共有しやすいフォーマットで作成することです。

コミュニケーションツールとしてのムードボード

モックアップやプロトタイプを作成する前にムードボードを作成する最大のメリットは、クライアントや他のチームメンバーとコミュニケーションを取るための貴重なツールになることです。デザイナーが先にモックアップやプロトタイプを作成した場合、クライアントがそのデザインに満足していなければ、時間とリソースを無駄にするだけでなく、クライアントが望んでいたものと全く違うと感じれば、信頼を失うことになりかねません。

このムードボードの建て付けは、プロジェクトのスタイルを非常に明確に伝えています。(by Wray Ward)

ムードボードを作成することで、クライアントの「見たらわかる」症候群を防ぐこともできます。ムードボードを見せることで、比較的ローファイで簡単に作成できるものを見てもらうことができます。デザイナーは、クライアントが何を望んでいるのかがまったくわからない場合、複数のムードボードを作成することもできます。

ムードボードを早い段階でクライアントに見せることで、デザイナーとクライアントがデザインプロセスの初期段階から同じ認識を持つことができるため、完成したデザインの修正も少なくなります。そして、デザイナーがクライアントの期待に最初から応えていれば（たとえその期待が明確でなくても）、クライアントはデザイナーの能力をより信頼するようになるのです。

まとめ

デザイナーがデジタルまたは物理的なムードボードを作成するかどうかにかかわらず、ムードボードはあらゆるプロジェクトでまとまったデザインスタイルを作成するための重要なステップとなります。ムードボードの段階で十分な時間をかけることで、プロジェクトはよりスムーズに進行します。

ムードボードを作成する大きなメリットの1つは、ムードボードに何を含めなければならないか、どのように見えるかを決める「ルール」がないことです。このため、デザイナーはこの段階で非常に自由な発想ができるようになり、後のデザインフェーズではそれが薄れてしまうこともあります（もちろん、特定のプロジェクトにもよりますが）。

ムードボードの利点と欠点がない（多少の時間を費やすこと以外は）ことを考えると、デザイナーは、シンプルなウェブサイトの更新から完全なブランディングのコンセプトまで、あらゆるデザインプロジェクトにムードボードを取り入れることが理にかなっていると言えるでしょう。