ウェブUIにおけるシンプル=スッキリという誤解

岡本 早樹のプロフィール画像
デザイナー 岡本 早樹

4,367 view

デザイナーMTGにて枌谷さんからウェブUIにおける「シンプル」についてお話いただいた。今日は3つ特に心に残ったことを振り返りたい。

シンプルの定義

ウェブUIにおける「シンプル」とは迷わない、使いやすい、目的に早くたどり着けるなどの「脳内負荷が軽くなるUI」のことを指す。単に要素を削ぎ落としたり、情報を隠してスッキリさせることではない。

このシンプル=スッキリという誤解はデザイナーでも意外と多いのではないだろうか。実際ベイジに入社する前の自分がそうで、深く考えず情報を隠したり削ぎ落としていた。

シンプル=スッキリさせること という認識を持っているとユーザーにとって必要な情報まで隠したり削ってしまい、逆に使いづらいものになってしまう。

例えば「できるだけ情報を削ることでシンプルに見せ、簡単そうに感じてもらう」と考え、電話番号の受付時間を消してしまうとする。ユーザーが電話をかけて「本日の受付は終了しました」と言われたらどうだろうか。かなりのがっかり体験である。

極端な例だが「これで分かるだろう」「これで使いやすいだろう」というデザイナー都合の感覚は捨てなくてはと思う。

重要じゃないから隠すという矛盾

「この情報はあまり重要じゃないからアコーディオンで表示させる仕様にしよう」「重要じゃないのでハンバーガーメニューの中に入れましょう」と、情報を隠した経験はないだろうか。

重要じゃない要素にわざわざ能動的な行動を起こすユーザーはいない。

残すのであれば隠すのではなく情報の優先度を下げて見える場所においたり、それでも押されないようなものであればいっそ消してしまう。このような取捨選択が「シンプルにしていく」ことだろう。

「らしさ」や「個性」を表現する部分を履き違えない

人の原則の中で「見慣れないものは触らない、使わない、理解しようとしない」とあった。

見慣れないものを生産してしまう要因として「なんかかっこいいことしなきゃ」「他と違うことしないとデザインした感ないな」という考えもあるだろうが、操作に関わる部分で「その企業・サービスらしさ」を表現しようとすることも1つの要因ではないだろうか。

例えばボタンのデザインで個性を出そうとして、一見ボタンとわからない見慣れないものが出来上がるイメージ。そうなると「脳内負荷が重いUI」になってしまい、シンプルで使いやすいUIとはかけ離れたものになってしまう。

「らしさ」は操作に関わる部分ではなく配色やフォント・余白感など、ビジュアル全体の雰囲気で表現するものだと思うので「どこでその企業らしさを表現するか?」はしっかり区別しなくてはならない。

「なんか複雑に見えるな」「上手くまとまらないな」という場面でついデザイナーに都合の良い情報の取捨選択をしてしまいがちだ。

常に「ユーザーにとって脳内負荷が軽いのはどちらか?」を踏まえた取捨選択をできるようにしていきたい。

関連する日報

    フリー素材のアイコン・イラストを流用する時のコツ

    2,708 view

    岡本 早樹のプロフィール画像
    岡本 早樹 デザイナー
    経験やスキルがなくても、デザインのフィードバックはできる

    2,317 view

    原浦 智佳のプロフィール画像
    原浦 智佳 デザイナー
    「壁打ち相談」をうまく使って、情報設計を効率よく進めよう!

    1,592 view

    高島 藍子のプロフィール画像
    高島 藍子 デザイナー
    BtoBサイトにおける「ファーストビュー攻略法」

    3,006 view

    池田 彩華のプロフィール画像
    池田 彩華 デザイナー
    デザインを複数案作る時の心得

    6,591 view

    岡本 早樹のプロフィール画像
    岡本 早樹 デザイナー
上に戻る