Catch on to a trend
Webクリエイターとして、どうしたらもっとよいUIになるか、悩むことはないですか?
今回は、人の能力や共通認識などを踏まえたUIデザインについてです。著者は「UIデザイン(設計)の答えはひとつには絞れない。しかし、設計には良し悪しがある」と言います。
UXとUIの違いを再確認して、よいUI設計について考えてみませんか。
ユーザーとしてサイトを使っていて『このサイトは使いやすい』『あのサイトは分かりづらい』と思う反面、クリエーターとして、どうしたらよいUIデザインになるのか悩むことはありませんか?
使いやすさや分かりやすさは、人の習性が関係してるものもあります。一般的なルールや人の能力などを知っておけば、UIデザインがうまくいかないときに、立ち返って考えられるはず。
UI・UXの基本と、UIデザインで知っておきたいことを本から抜粋してお伝えします。
UIとUXは、併記して書かれることが多くあります。しかし、UXは主観と感情に基づいた体験、UIは分かりやすさや使いやすさで、違う分野のものです。
※紹介書籍(P14)の図を参考に作成
よいUIであれば、よいUXを提供できます。しかし、UI(分かりやすさや使いやすさ)が悪いとそこでつまづき、次のUXに進むことができません。
Webデザインでは、サイト全体の構造から、ボタンの配置や装飾まで、さまざまなところで、UXを意識したUIデザインが求められます。
サイト制作をしていて、「もっと分かりやすく」「もっと目立たせてほしい」という要望を受けることはないですか?よいUIデザインを設計するためには、人の能力や共通認識を知っておくことが大事です。
下のA~Cのうち、どれが一番「6」を見つけやすいですか?
※紹介書籍(P48)の図を参考に作成
Bは瞬時に「6」だけを見つけることができたと思います。Aは全ての数字を見る必要があり、Cは色数が多く見分けづらいですね。色に対する認知能力を使うことで、効果的なデザインができますよ。
「あれもこれも目立たせたい」とすると、逆に全てが目立たない結果になります。
※紹介書籍(P88)の図を参考に作成
一番目立たせたいものを整理し、コントラストを付け、視覚的な認知のバランスをとることが大切ですね。
アイコンには区別のしやすさ、省スペース化など、さまざまなメリットがあります。使い勝手がよい分、使うときには注意が必要です。
知られてない解釈や、解釈が分かれるアイコンにはラベルを付けるといいですよ。
※紹介書籍(P144)の図を参考に作成
今回ご紹介した書籍の著者である、原田秀司さんをお招きし、イベントを開催!
TVのアプリケーション画面設計を手掛けられたことがきっかけで、UIデザインの重要性を認識されたという原田さん。当時の事例を交えながら、原田さんがUIデザインでどのようなことを大切だと考えているのか伺います。
さらに、ウェブスタッフのキャリアカウンセラーが、書籍の中から気になるトピックについて根掘り葉掘り質問する予定です。
トレンドに左右されない、いつの時代でも通用するUIデザインの考え方のポイントを知りたい、そんな方は、ぜひご参加ください!
※当日の状況により、イベント内容が予告なく変更になる場合がございます。あらかじめご了承ください。
Webサイトの制作をクライアントワークで行っていると、目指すべき目的が、担当者の個人的な評価にすり替わってしまうことも…。
気持ちよく仕事をしながら、最適なUIを考えるためにも、陥りがちな盲点を知っておくといいですね。この本では、仕事をするうえで、人間の想像力や謙虚さなど、こころに留めておきたいことが書かれています。
Career advice
「今のままで本当にいいのか」と漠然とした不安や焦りをお持ちの方も、ウェブスタッフにお気軽にご相談ください。あなたの今のスキルやキャリアに対する心配ごとなどをお聞きして、将来を見据えたキャリアアドバイスを行います。
お申込みはこちらCareer advice
転職のアレコレ。プロに相談したい方へオススメ!
最新のIT・Web業界動向を知るキャリアカウンセラーが行う
「キャリアアドバイス」
ある程度経験を積んだので次のステップにキャリアアップしたい、しばらくWeb業界を離れていたが再度業界に戻りたい、 未経験・経験浅めだがどのように転職活動を行っていったらいいかなど、ウェブスタッフでは様々なご要望に対応したキャリアアドバイスを行っております。
ウェブスタッフが運営するサイトでは、利便性向上・分析・広告配信等のためにCookie等のデータを使用しています。当社が取得したアクセスデータとの関連付けの削除(オプトアウト)に関しては「個人情報の取り扱いについて」をご覧ください。
同意して閉じる