虎の穴開発室ブログ

虎の穴ラボ株式会社所属のエンジニアが書く技術ブログです

MENU

「インタフェースデザインの心理学 第2版」を読んで、効果的なUIを学ぶ

こんにちは、虎の穴ラボの後藤です。

この記事は夏の連載企画の25日目の記事です。
前回は山田さんによる「エンジニア組織を強くする開発生産性の教科書」を読んでが投稿されました

今回は「インタフェースデザインの心理学 第2版」を読んで、特に勉強になった3項目をご紹介します!

なぜこのUIが良い/良くないと感じるのか、言語化したい!

とらラボの業務では、エンジニアであっても要件を踏まえてUIを検討したり実装することがあります。
そのため、UIに対して感じることを言語化して、相手に改善提案や実装意図を上手く伝える必要があります。
ですが、私は「なんとなく気になるけど...」で止まってしまい、なぜ気になるのかを説明するための材料も無い状態でした🫠

そこで、科学的な研究から導き出されたUIの指針を示す「インタフェースデザインの心理学 第2版」を読んで、まずは知識を得ることから始めました!

www.oreilly.co.jp

全体的な感想

「インタフェースデザインの心理学 第2版」は、理論だけでなく実用性に富んだ内容で多くの気づきを与えてくれました!

研究論文に基づいた論理的な説明
各指針が科学的な研究に基づいているため、ただの意見や経験則に留まらない信頼性の高い情報が得られます。
特に、ユーザーの行動を予測する際の心理的要因が明確に説明されており、なぜそのデザインが効果的なのかの背景を深く理解することができました。

図解とイラストが多く、直感的に理解しやすい
複雑な研究内容や実験データも、視覚的に表現されているため非常に理解しやすいです。
具体的な例やケーススタディが豊富に含まれている点も、実際のシナリオを想定しながら学ぶ上で非常に役立ちました。

特に勉強になった項目

「006 人は過去の経験と予想に基づいて画面を見る」

人は過去の経験を踏まえて、画面を見るときに特定の情報がどこに表示されやすいか意識して画面を見ていると紹介されています。
例えば、この技術ブログのトップページに戻る導線はどこにあるでしょうか?
過去を振り返ると、トップページへの導線はヘッダーに配置されることが多いため、ヘッダーを探した方が多いのではないでしょうか?

上記を踏まえて、情報を配置する際にはユーザーが過去の経験からどこを探すか考えると良いUIに近づくといった学びが得られました。

「019 ワーキングメモリの限界」

ワーキングメモリ、すなわち「ちょっと覚えておく記憶」では、覚えておける情報量は多くなく、また、邪魔が入ると忘れやすくなると紹介されています。
例えば、画面遷移間で情報を覚えさせる作りにすると、ユーザーは情報を忘れてしまいイライラする可能性が上がってしまいます。

上記を踏まえて、ユーザーに情報を覚えさせる作りを避ける、覚えさせる場合は邪魔が入らないようにするといった学びが得られました。

「055 進歩や熟達によりヤル気が出る」

何かを達成したいという気持ちがヤル気を引き出す効果は非常に大きいと紹介されています。
この気持ちを強くするには、小さなものでも進捗を目にみえる形で提示すると良いそうです。
(個人的にもオンライン講座などで進捗が埋まっていくとヤル気が出ます!)

上記を踏まえて、目に見える形で進捗を示し、達成に向かう気持ちを引き出すといった学びが得られました。

振り返り

「インタフェースデザインの心理学 第2版」を読んで、UIデザインに関する説明可能な指針を得ることができました。具体的な研究結果や例を通じて、なぜ特定のデザインが効果的なのか、またどのようにしてユーザーの動作や感情に影響を与えるのかの理解が深まりました。

UIがただ直感的であるだけでなく、心理学的要因に基づいて設計されるべきであるという意識を持ち、多くのユーザーにとって使いやすいものとなるよう努力していきたいと思います。

Fantia開発採用情報

虎の穴ラボでは現在、一緒にFantiaを開発していく仲間を積極募集中です!
多くのユーザーに使っていただけるtoCサービスの開発をやってみたい方は、ぜひ弊社の採用情報をご覧ください。
toranoana-lab.co.jp