🕵️

最悪なデザインから学ぶUI/UX

Tomo2023/01/24に公開

お断り

この記事は主に私の所属する組織内の知識・技術共有用に作成されています。(もちろん、コミュニティガイドラインに沿ってコミュニティ全体にとっても有益な情報です。)

この記事が対象としている人

・WEBサイトのデザインをしている人
・デザインを複数人で行いたいが意思疎通やルール統一で悩んでいる人
・マニュアルなどに沿って一定の規則でWEBサイトを作成する業務に従事している人
などを対象にしています。

わかりやすいWEBデザインとは

「わかりやすいWEBデザイン」という言葉を耳にしてみなさんはどのようなデザインを思い浮かべるでしょうか?私は一定の規則に常に支配されていることがわかりやすいデザインの大前提だと思います。また、その規則は自社のWEBサイトだけではなく世界全体の当たり前のルールだったりすると思います。(例えば「→」は右向きを指しているなど。)

組織内でのデザイン規則の統一

申し訳程度に世界の様々な企業や組織が行っているデザイン統一方法を紹介します。

・日本 デジタル庁
デザインシステム」というデザインドキュメントを作成しています。また、WEBサイト上で実際のコンポーネントを配布していてFigma Communityより閲覧が可能です。

・Google
Material Design」というデザインルールを作成しています。こちらもWEBサイト上にて公開されていてGoogleという巨大組織がどのようなルールで統一性のあるアプリケーションを作成しているのかがわかります。

今後も読んで気に入ったドキュメントがあれば更新します。

「世界一わかりにくい」デザイン

最後にまともに入力するのが難しいデザインのWEBサイト「User Inyerface」を紹介します。こちらは実際に自分でプレイしたほうがわかりやすいと思います。作成した企業は直感的な操作では最後までたどりつけない“最悪のUI(ユーザーインタフェース)体験”ができるゲームとして紹介しています。

わかりにくい点としては...
・「Yes」と「No」のデザインが通常と逆
・常に見にくい配色
・閉じるボタンのテキストが「©lose 2023」
etc

まとめ

・組織内のデザインルールの統一は大切
・自分が作ったものだと初見殺しに気づかず、いつの間にか「わかりにくいデザイン」が発生しているかもしれない
・テキストとデザイン両方についてちゃんと何も知らない第三者にレビューしてもらいましょう。

Hiroo-Gakuen-ICT-Committee

組織内で日々更新されるTipsを掲載していきます。

Discussion

ログインするとコメントできます