デザインは気づきが大切！デザインを見る目をどのように養えばよいのか

Post on:2018年7月11日

デザインのセンスを磨き、デザインを見る目を養う

私はデザインを始めた時、デザインが苦手でした。

Dribbbleなどからトレンドのデザインをコピーするのに夢中で、それらがどのように機能するのか気がついていませんでした。私が加えたドロップシャドウや不必要なエフェクトをもしあなたが見たら、ぞっとすると思います。

私はデザインの天才ではありません。そのため、必要とするスキルをどのように身につけるべきかを考えました。そして今、その中の一つをあなたと共有したいと思います。
あなたがデザイナーであるかどうかに関係なく、ここではデザインのセンスを磨き、デザインを見る目を養うのに役立ちます。

スマホアプリは単に使うだけではなく、そのアプリのデザイナーの身になって考えることで、デザインの目を育てることができます。よく使用するアプリを開いた際に、コンテンツを楽しむ衝動を抑え、デザイナーとしてスクリーンを観察してみてください。注目すべきポイントがいくつかあります。

デザインはどのようにあなたのフォーカスを方向付けていますか？どんな情報が強調表示されていますか？どのようにカラーとテキストの処理が特定の要素の重要性を伝えていますか？

コンテンツを見た際にときめくような言葉が使用されていますか？どのようなコンテンツが目に見え、より興味深くみえますか？表示されていないコンテンツはどれですか？コンテンツをグルーピングするために空白スペースはどのように使用されますか？

そのアプリはどんな人が利用しますか？どんな問題を解決しますか？デザインはどのようにしてその問題をより良く解決するのに役立ちますか？

このアプリを使用している人は誰ですか？その使用例はあなたとどのように異なりますか？デザインはどのようにこれらの使用例をサポートしますか？

下記のGIFアニメーションは、各コンポーネントにフォーカスを合わせるためにアプリのUIを分析したものです。アニメーションでどのコンポーネントが次に来るかを予測すると、これまで認識できなかったディテールを観察することができます。

それぞれのコンポーネントが構築されるのを見て、これらのアプリのUIに必要なものを考えてみます。

AirbnbのUIを分析

検索バーのプレースホルダーのテキストには「ここで検索」と書かれていてもかまいませんが、代わりに都市名を入力するように書かれています。私はロンドンに行くつもりはありませんが、そういった可能性を見ることは楽しくなります。
「Dates」と「Guest」でフローにおけるポイントを繰り返し分析してみました。このアプリでは、場所を選択するまで日付は表示されません。これはユーザーがどのように検索するのか、そしていつ条件を追加するのか不思議に思えます。

TwitterのUIを分析

まず、「Retweets」と「Likes」の数字が太字であることに注目です
タイムスタンプには日付だけでなく、時間も含まれています。この時間はプロフィールで見ると表記が変わり、「5h」のように経過時間になります。なぜこのように異なるのか目的を考えてみてください。
Tweetstormでは、ツイートするための「Tweet」ボタンだけでなく、別のツイートを追加するためのアイコンが用意されています。それは「Add a Tweet」ではなく、「Add another Tweet」になっていることにも深い理由があるでしょう。

Tweetstorm

SpotifyのUIを分析

最初に注目すべきは、Spotifyが再生中の曲をどのように表示しているかです。
New Releasesでは、選択したコンテンツに新しいプレイリストと新しいアルバムやシングルが含まれます。
New Music Fridayのプレイリストではフォロワーのカウントがありますが、Release Radarのプレイリストにはありません。これがなぜか、考えてみましょう。Release Radarはユーザー固有のものなので、フォロワーがありません。誰かがコンテンツのユースケースをすべてマップし、ペアにすべき適切なサブヘッダを決めなければなりません。こういったルールに気がつくこともできます。