ほとんどのデザイナーは、ワイヤーフレームとプロトタイプが設計プロセスの重要な部分であることを認識しているはずです。プロトタイプは優れたデザインを実現するうえでなくてはならないものです。適切なプロトタイプを作成するために、デザイナーはアイデアを練る時間が必要です。ブレインストーミングにおいて、デザイナーはアイデアを生み出すために役立つさまざまなツールとテクニックを持っています。その過程をもっとも効果的にするツールの１つがムードボードです。
ムードボードは、デザインの正しい方向性を見つけ、これから作ろうとしている感情的なユーザー体験の基盤となるものを作成するのに役立つツールです。
この記事ではムードボードの概要と、それをもっとも効果的に利用する方法をご紹介します。
ムードボードとは？
ムードボードとは、デザインに関連する質感表現と画像を集めたもので、参考資料の１つとして使用されます。
ムードボードは要望によってさまざまな使い道があります。ムードボードの典型的な例をいくつかご紹介しましょう。
１. ブランドブック / ロゴ（ブランド / アイコンのスタイルを見つけるのに役立ちます）
２. UIデザイン（ビジュアル的な原則を見つけて定義するのに役立ちます）
３. コンテンツ戦略
４. モーションとインタラクション
ムードボードを使ってデザイナーが出来ること
インスピレーションを得る
ムードボードはインスピレーションそのものと言えるでしょう。
ムードボードは、デザイナーが美しいものを見つけだし、それを実際に使いこなすために役に立つものです。たとえば、アイコンデザイナーはさまざまな形のものを収集し、その中から使用したいアイコンの形を見つけだします。
ムードボードは、クライアントにインスピレーションを与えます。クライアントがそのデザインを感覚的に理解することに役立ち、また、クライアントが考えるデザインの方向性を知るための優れたツールでもあるのです。
アイデアを伝える
デザイナーがアイデアを伝えようとするとき、口頭で伝えることが難しい場合があります。言葉だけでは不十分なのです。デザイナーは目に見える何かを見せる必要があります。
ムードボードは、デザイナーが同僚や関係者に特定のデザインを採用する「理由」を説明し、そのイメージを描くのに役立ちます。「なぜUIにこの形が必要なのか」と聞かれたら、ムードボードを見せることにより、そのデザインを決定するに至った理由がより明確になるのです。
ムードボードがアイデアをうまく伝えるためには、抽象的な概念だけでなく、身近にあるもののサンプルを含めるようにしましょう。異なる業界のサンプルであっても構いません。このように使われることで初めて、そのデザインの方向性が正しいということの証明としてムードボードは役に立つのです。
ムードボードの作成と利用に関する８つのヒント
ムードボードの作成は難しい場合があります。幸いなことに、このプロセスを簡単にするためのヒントとコツがいくつかあります。
１. 心から湧き上がる感情的な反応を目指す
ムードボードを使って関係者に伝えたい感情について考えてみましょう。ムードボードの最初の画像や質感表現を選択する前に、感情的な反応を引き起こすものはどんなものか想像してみてください。
ヒント：ムードボードを見せるときの最終目標は、それを見ている人たちが心から発する「素晴らしい」や「いいね」などといった言葉の反応を得ることです。見ている人たちの表情を観察してみましょう。これにより、ムードボードがうまく役目を果たしているかどうか、実感できるでしょう。
２. ムードボードが全体的に機能しているか
デザインを担当するチームが、プロダクトの全体的なデザイン戦略（つまりプロダクトのすべての部分）を任されている場合、すべてのムードボードが全体的に機能するよう、明確な方向性を決める必要があります。これにより、作業に取り掛かる前に、今後のデザインのしっかりした基盤を作り上げることができるのです。全体的に機能しているムードボードは、デザイナーが全体像を想像するのに役立ちます。製作するプロダクトを通じてユーザーに伝えたい感情は何かを、誰もが明白に描けるようになるのです。
３. 参考資料として実現可能なものだけを含めること
ムードボードを共有するときには、期待値を設定しましょう。とても洗練されたムードボードを提示された場合、関係者は最終的なデザインも同じレベルの職人技で完成できるものだと信じます。できあがったプロダクトがムードボードの品質と大きく異なる場合、クライアントの信頼を失うリスクにつながるのです。結果的に失敗する可能性につながってしまうため、ムードボードには実現できないものは含めるべきではありません。
４. デジタルの世界を超えて
ムードボードを作成しようとするデザイナーは、その多くがオンラインで検索してインスピレーションを得ようとします。もちろん、Googleは多くの素晴らしい画像を提供してくれますが、それはあくまでも１つのソースにすぎません。
デジタルメディアに縛られないようにしましょう。自然の中でインスピレーションを探してみましょう。もし写真が好きなら、お気に入りの写真から見つけた色をプロダクトのデザインに取り入れてみるのも良いでしょう。
Gleb Kuznetsovによるムードボード
紙媒体のメディアは、もう１つの優れたインスピレーションの源です。書籍や雑誌は完璧なイメージの情報源といえるでしょう。
Jack Dylan氏によるカバーピッチ。アーティストの好意により掲載
５. コレクションを整理する
必要以上に大量の画像や質感表現をムードボードに含めることをしないように注意しましょう。画像は多ければよいというものでもありません。画像の数が多いほど、人々が情報を理解できる可能性は低くなります。なぜでしょうか？ ユーザーの注意力は限定的で、多くの情報により人々は比較的簡単に圧倒されてしまうからです。多すぎる情報でメッセージを伝えることをより難しくしてしまいます。
ムードボードを使用する主な目的は、楽しませることではなく、特定の問題を解決することです。そのため、すべての画像や質感がムードボードに適しているわけではありません。ムードボードを作成するときは、コレクターではなくキュレーターだと考えてみましょう。私がムードボードを作るときは最大1,000個の画像を組み合わせますが、その中のもっともパワフルで一貫性のある10個の視覚的な参考資料のみをムードボードに含めるようにしています。
ヒント：ムードボードを準備するのは簡単なことではありません。膨大な数の視覚的なサンプルに目を通しますが、結局のところ、どれを使えばよいのかわからなくなる、というような状況に直面するでしょう。大量の情報を扱う際に、それに圧倒されてしまうのは一般的なことです。そのため、情報の収集作業の途中で、リラックスした時間を持つことはとても重要なポイントです。
私の場合だと、こんな感じです。
１. 数日間かけて、画像を収集（1,000個ぐらい）
２. まったく別のことをしてリラックス
３. 集めた画像のうち、半分を削除
４. 残りの画像が30〜40枚になるまで手順２と３を繰り返す
５. 画像を慎重に振り分け、最初に集めた画像の１％だけを保存
一貫した感情的な感覚を伝えるための画像をまとめあげることが、最終的なゴールです。
1,000個近くの画像を組み合わせたあと、もっとも強力で一貫性のある視覚的な参考資料10個だけがムードボードに残ります。
６. 適切なフォーマットの選択
プロジェクトの種類に応じて、ムードボードはオフラインでもオンラインでも作成が可能です。形式にあった準備を始めることが必要です。
オフライン形式は、チームメンバーが物理的に一つの空間で作業する場合に最適で、関係者とも直接顔を合わせることができます。オフライン形式の利点は、自分が意図することを直接説明する機会を設けられる点です。クライアントはあなたに質問をし、意見を聞くことができます。
リモートチームまたはチームが分散している場合、唯一、可能なのがオンライン形式です。この場合、コメントのやりとりをせずに、チームメンバー全員がムードボードのイメージを明確にすることに時間を費やす必要があります。アイデアを説明するための短いメモなどを追記するのも良いでしょう。
７. 重要なメッセージを強調
どのフォーマットを選択するにしても、デザインの基盤となる画像の選択は重要です。ちょっとしたコツがあるので、参考にしてみてください。目線を誘導するため、の大きさを工夫してみましょう。サイズの大きな物体（画像/質感表現）は、小さな物体よりも注目を集めます。小さい物体は大きい物体を補完することができます。
この方法を利用することで、これから作ろうとしているデザインのもっとも重要な部分に、見ている人の視点を誘導し、必要な情報を一目で伝えることができるのです。
８. 今後のプロジェクトのために最高の画像/質感表現を収集
ムードボードはプレゼンテーション以外にも使い道があります。今後のプロジェクトにムードボードを活用してみてはどうでしょうか。Pinterestを使用してサンプルを保存してみましょう。Pinterestを使用する利点は、特定の「ボード」のセクションごとに作品を分けることができる点です。
Gleb Kuznetsov.によるムードボード
ムードボード作成に便利なデジタルツール
ムードボードの素晴らしい点は、特別なツールを使用する必要がないことです。必要なのは、作業スペースにあるホワイトボードだけです。しかし、アイデアをさらに伝えやすくするために、デジタルツールを使用することもできます。
１. Pinterest
Pinterestはデザイナーにとって必須のツールです。Pinterestは、Web上のリソースを使ってムードボードを作成することができます。また、キッチンのアイデアからハイテク機器まで、既存のムードボードの豊富なコレクションへアクセスすることもできます。このすべての情報へのアクセスが、デザイナーがインスピレーションを得る絶好の機会となるのです。
Pinterestは、インスピレーションを得るのに最適な場所です。上記は Gleb Kuznetsovによる自動車ムードボード。
Matboardは、写真家、映画製作者、コマーシャルディレクターたちによる、厳選された画像コレクションへのアクセスを提供します。
３. Canva
Canvaは、オンラインでムードボードを作成するための優れたツールです。ドラッグ＆ドロップの編集機能があり、誰でも数分で素晴らしいムードボードを作成できます。Canvaには画像のライブラリも備っています。この機能により、作業時間を大幅に節約できます（適切な画像を見つけるためにWebを閲覧する必要がないからです）。
４. Evernote
Evernoteの大半のユーザーはメモを取るためにこのアプリを使用していますが、ムードボードの作成に使用することも可能です。
５. Mural
Mural は、チームでムードボードを作成する必要がある場合に最適なツールです。Muralは、チームが共同してアイデアを出し合える、共有デジタルスペースを作成します。
まとめ
ムードボードを作成するプロセスは退屈なものになってはいけません。楽しいものであるべきです。すべてのクリエイティブな人材はインスピレーションを必要としていて、デザイナーにとってムードボードの作成は、有益な習慣でもあると言えるでしょう。。
