UIデザイナーを目指す人は「はじめてのUIデザイン」を最初に読んでほしい

UIデザイン勉強中のアシスタントデザイナーのくぼです！

今回はUIデザインを学びたい人に絶対最初に読んでほしい一冊「はじめてのUIデザイン 改訂版」をご紹介します！

なんとこちらから、EPUB版は無料でダウンロードできます！Kindle版でも100円で読むことができます！すごい！(2023年1月現在)

この本について

「UIデザイナーを目指している人に渡せる最初の1冊を作りたい。」この本は、そんな想いから作られているそうです。

その言葉の通り、UIデザインにおける基礎的に必要となる知識や考え方が網羅的に書いてあります。

UIデザインの重要性から始まり、UIデザインの歴史、コンポーネントの解説、情報設計の考え方、開発の流れ、UIデザインにとって必要な心構えの解説といった、UIデザイン全体に必要な基礎知識で構成されているのです。

「はじめての」と付いているように、デジタルプロダクトのUIデザインを学びたい人に必要な知識が詰まっております！

目次紹介

1章　はじめに

1-1 なぜ今UIデザインなのか

1-2 この本で学べること

1-3 UIデザインは大切？

1-4 UIデザイナーは何をする人なのか

1-5 デジタルプロダクトにおけるUIデザインの変遷

2章　UIの見える部分を学ぶ

2-1 コンポーネント

2-2 ビジュアル要素

2-3 アイコン

3章　UIの見えない部分を学ぶ

3-1 UIデザインの前に

3-2 情報設計

3-3 この章の流れと成果物

3-4 ペルソナを動かすシナリオを作る

3-5 必要な要素を整理する

3-6 UIモデルを設計する

3-7 プロトタイピング

4章　UIが機能する環境を学ぶ

4-1 スマートフォンアプリのデザイン

4-2 Webサービスのデザイン

4-3 タブレットやウォッチ、TVのアプリデザイン

5章　UIデザインを作ってみよう

5-1 UIを作る(1)情報をUIに落とし込む

5-2 UIを作る(2)デザインツールについて知る

5-3 UIを作る(3)一貫性を意識する

5-4 UIを作る(4)具体的な制作プロセス

5-5 UIトレースで観察力を鍛える

6章　UIデザインができたら

6-1 体験をデザインする

6-2 開発者と連携する

6-3 運用を考える

7章　UIをデザインする前の心得

7-1 サービスを作る

7-2 サービスコンセプトの検証

7-3 サービスロゴ制作の心得

7-4 これからUIデザインを始める方へ

終わりに

(2023年1月現在)

内容について紹介

UIデザインの重要な部分は利用者が目的を達成すること

この本を読んで、まず、そもそもUIデザインがなぜ今の形になっているのか？を知識として獲得することが重要だと感じました。なぜこの画面デザインになっているのか？見た目だけのデザインにだけでなく、中身の構造の部分の視点についても触れています。

また、「UIデザインの重要な部分は利用者が目的を達成することであり、インターフェースはその役割を果たすために存在している」と本書では書かれています。見た目にとらわれず、本来の目的を達成できるデザインとは何なのか？を思考する必要があるでしょう。

UIが正しく機能していないと、どんなに優れたプロダクトだろうと継続利用してもらえません。UIが正しく機能できているか？またそれはどのような状態なのか？を考える視点が重要です。

UIデザインの歴史の遷移

UIを正しく機能させるための前段階の知識として、UIデザインの歴史の遷移について触れています。

歴史の遷移を知っていることで、どんなUIデザインを経て今に至るのか？今はどんなUIデザインが多く採用されているのか？についての視点を持つことができます。

例えば、スマートフォンがまだ導入されたばかりの頃は、ユーザーが使ったことのないUIに感じるギャップやストレスをなるべく軽減するため、実際の形に近いリアリティな表現(スキューモーフィックデザイン)が主でした。しかし、スマートフォンやアプリケーションは人々に浸透し、リアルに近い形である必要がなくなりました。むしろリアルに近い方がユーザーの手間が増えるケースも発生したのです。(ダイヤル式電話など)つまり、少しずつ余計なものを省いたシンプルで明瞭なデザインが浸透していきました。

先人たちがどんな道を辿り現在の形に行き着いたのか？これまでの知識を材料に、これからのUIデザインがどのように進んでいくのかアンテナを張りましょう。

UIコンポーネントの機能と、場面に応じた使いわけ

現状、推奨されているUIデザインのコンポーネントはどんなものなのか？についてそれぞれの部品ごとに解説されています。

コンポーネントはどの場面で、どのように機能するのか知った上で、場面に応じた最適な部品を提案するべきです。同じ機能でも、ケースは様々であるためその都度検討することで、UIを正しく機能させることができるのです。

この本ではコンポーネントを網羅的に解説してくれていますが、別途ガイドラインも読み込むとより専門的な知識が身につきます。

iOSは「Human Interface Guidelines」、Androidは「Material Design」です。

コンポーネントの機能を最大限活かす情報設計の重要さ

UIの画面上のコンポーネントを組み合わせてデザインをする前に必要となるのは、情報設計です。

ユーザーにとって使いやすい最善のデザインを行うためには、まず要件定義や構造の設計が必要なのです。なぜなら、表層として現れるデザインは最終的なアウトプットだからです。表面のデザインだけが整っていても、使い勝手が悪ければユーザーは使ってくれません。

情報設計の内容として、ペルソナやストーリーの作成とはどのようなものか、情報整理の観点、プロトタイピングについてまとめられています。

UIがどのような環境下で操作されるのか

さらには、UIがどのような環境下で操作されるのかについても触れています。

タッチやドラックなどの操作方法や、画面サイズ・解像度、iOSとAndroidの違いなどです。iOSとAndroidはそれぞれガイドラインが存在しているため、推奨されているガイドラインは何かを把握した上で、ベストな形を模索します。

サービスを作り上げていく心構え

「整理した情報をまとめ、ユーザーの目的を達成するプロダクトを一貫性を持たせデザインする。」

そのためには、開発者と連携し「何のためのUIなのか」を検討し続けることが重要です。

開発者にとってデザインは最終的なアウトプットですが、ユーザーにとっては入り口であることを忘れず、サービスを作り上げていきます。また、サービスを作り上げていく心得として「売上・利益」にも貢献する意識も持たなければならないことも本書では触れています。

例え、最先端のかっこいいデザインじゃなくても、それがユーザーにとって使いやすい「最適解」と考えられるケースなら、それを提案することも必要な場面があるでしょう。また、受注開発の場合、ユーザーだけでなく共にサービスを作り上げるパートナーにも意識を向けなければなりません。予算や利益も密接に関わってくるのです。

こういった心構えも持っておく必要があります。

感想

デジタルプロダクトのUIデザイン全体の流れを記しているため、実際にアサインされた場面で自分がどう動く必要があるのかを具体的にイメージすることができました。

また、これらの知識は、デザインの根拠となります。自分がデザインしたものの明確な理由・根拠のある説明として、歴史的背景や現在のベターな形、遷移してきた経緯などを踏まえた上でのデザインを提案すること理想でしょう。

ただこれを作りましたと見せるよりも、なぜそのデザインにしたのか根拠を示した方が、相手も納得感を持って聞くことができますよね。

そしてそこから共同開発者と共に、それが最適解なのか？の検討を繰り返すことで、より良いUIデザインになっていくはずです。

あと、タイトルに「はじめての」と付いているように、主な内容はUIデザインの基本的な知識や考え方のため、まずこの本を読み、枝分かれ的に派生するそれぞれの知識については、別途深めていく必要があると感じました。

コンポーネントの理解として別途ガイドラインを読み込む必要があり、情報設計についても考え方は一つではないため、本を読んだり色々触れてみたいと思います！

最後に、私は現在会社の一員として働いていることを意識したいと感じました。

「心得として売上・利益にも貢献する意識も持たなければならない」と本書で書かれています。

現在私が所属している部署は受注開発がほとんどで、自社開発とは違い、お客様がいます。ユーザーだけでなく、お客様にも目を向けてデザインします。作るだけでは意味がなく、お客様に利益が生まれないとそのサービスはすぐになくなってしまうでしょう。

ユーザーに継続的に親しみを持って使い続けてもらえる。そしてそれがお客様に利益を生む。それが繋がってお客様との長期的な関わりとなり、会社の売上にも利益にも実績にもなるはずです。会社の売上だけに目を向けるのではなく、価値のあるものを提供することが巡り巡って返ってくることを忘れずにいたいです。

会社の一員として貢献できるデザイナーになるため、今後も継続してインプット・アウトプットを続けます！！

参考になりましたら幸いです。最後までお読みいただきありがとうございました！