読書のきっかけ
皆さんはデザインが得意ですか? 自分は苦手です。最近だとTailwind CSSを使ってWebページにデザインをつけているのですが、なかなか難しいです。
というのも、プログラムのコードとは違って「正解」がないように思えるからです。
しかし、プロの方のデザインを見ていると、素人の自分とは明確な差異があります。その差異には理由があるはずです。
その理由を探るため、この『ノンデザイナーズ・デザインブック』を読んで確かめてみることにしました。
4つの大原則
この本には4つの原則が述べられています。
- 近接
- 整列
- 反復
- コントラスト
どういうことかというと、関連する項目が近くにあって、ページ内の配置が揃っていて、同じパターンが繰り返されていて、違いがハッキリしていることが、良いデザインの基本だと述べられています。
と言われても、この文章を読んだだけではピンと来ないかもしれません。
この本はカラー刷りになっていて、良い例と悪い例のデザインの実例が紹介されています。文章をあまり読まなくても、該当のデザインをパッと見ただけで、どれだけの効果があるか分かります。百聞は一見に如かず、です。
悪いデザインってどういうこと?
一言でいうと、ユーザが分かりにくいデザインは良くないです。
上の4原則を守っていないデザインは、その画面が何を伝えたいかが分からず、ユーザを混乱させます。
例えばWebアプリで考えてみましょう。そのアプリでは、サービス名と操作ボタンが重要だとします。
それにもかかわらず、ボタンの大きさがバラバラだったり、どこにあるか分からなかったら困るでしょう。また、サービス名が目立たないフォントだったら、名前を覚えてもらえないかもしれません。
逆に良いデザインとは?
Webアプリにおける良いデザインは何か考えてみましょう。それは、一瞬で使い方が分かるデザインです。
説明書きをほとんど読まず、アプリに関する知識が皆無でも、迷わずサクサク操作できる。これは間違いなく良いデザインです。
画面が心地よくて、思わずサービスに登録しちゃった! ここまでいけば最高のデザインでしょう。
読み取るのに時間が掛かっちゃダメ
私達はあらゆる情報が次々に流れていく情報社会を生きています。そのため、1つの画面を長時間見ることはできません。
このブログですら、目次をさらっと読まれているだけかもしれません。最初から最後まで読み通している人はいないでしょう。
しかし、こうして重要な所を目立たせるだけで、少なくともそこだけは注意を向けてもらえます。
太字で目立っている部分を読むだけで、内容が推測できる。
こうすれば斜め読みするユーザにも情報を伝えられます。また、通読してくれるユーザも情報処理がしやすくなるでしょう。
目立つ部分と目立たない部分のコントラストを設けることは重要なのです。
デザインが良いだけで競合に勝てるかも?
これは本書には書いていない私見なのですが、デザインの良いWebアプリは、それだけで競合に勝てる要素を持っている気がします。
というのも、今まさに自分が使っているこの「はてなブログ」は、あらゆる面でUI/UXが優れています。
例えば、この文章を執筆してる編集画面は、何をどう操作すれば良いのかが一目瞭然です。他のブログサービスも使ったことがありますが、自分がはてなブログを使っているのは、この操作性と明瞭さにあります。
また、自分が大好きなサービスにZennがあります。Zennのデザインは本当に素晴らしくて、記事投稿系のサービスでは1つの到達点だと思います。
上に挙げた4大原則を、Zennは全部活用しています。また、細部の使い心地も良いです。
このように、長く生き残っているサービス、そして人気のあるサービスは、良いデザインであることが多いです。
良いデザインであれば、繰り返し使われ、ユーザの滞在時間も長くなるでしょう。悪いデザインであれば、どんなにサービスが良くても、長期間にはユーザが少しずつ減っていくかもしれません。
素晴らしいスライド
この『ノンデザイナーズ・デザインブック』についてGoogleで調べていたところ、とても素晴らしいスライドを発見したのでご共有します。
read-a-non-designers-designbook - Speaker Deck
本の内容を、別の文献も用いつつ、科学的根拠から裏付けています。
それだけでなく、このスライド自体がとても良いデザインになっています。次に発表スライドを作るとき、参考にしたいと思います!✨
※ちなみにフィヨブー関係者なら全員必読だと思います。理由は秘密です。
まとめ
以前、とある飲み会でプロのデザイナーさんとお話ししたところ「UI/UXには正解があるんだよ」と仰っていました。
この本を読んだことで、その「正解」が何か分かった気がします。
つまり、ユーザにとって親切であること。言い換えれば、素早く明快に情報が伝わるデザインこそが1つの正解だということです。
そのための方法論を学ぶことができるのが、この『ノンデザイナーズ・デザインブック』でした。
デザインを学ぶ第一歩として、この本をオススメします。今まで無意識に捉えていたデザインの良し悪しを、具体的な事例とともに身につけられると思います。🎨