2021.08.04
UIデザインとは?<近接・整列・コントラスト・反復>
こんにちわ。営業の宇都木です。
今回は、UIについてご説明させて頂きます。
初めて聞かれる方がほとんどかと思いますが、WEBサイトを制作/リニューアルするにあたって
知っておけばかなりお得な知識ですので是非一度ご覧ください。
何故僕がこの記事を書こうかと思ったのは、クライアントで
「UIを意識したデザイン」「インパクトのあるデザイン」を求められたときに感じた違和感です。
お話を聞いているうちに、その要望を鵜呑みにしてしまうと「UIを意識したデザイン」というものと
ほど遠いものになってしまう…
と悩んだのがキッカケです。
UIとUIデザインとは
まず読み方は、UI(ユーアイ)です。
訳さず読むと、User Interface(ユーザーインターフェース)と読みます。
インターフェースには、「境界面」「仲介」などの意味があり、
IT用語的には「人(ユーザー)」と「モノ(機器、プログラム等)」をつなぐ役割を果たすものとして考えられています。
そしてUIデザインとは、
「ユーザーがWEBサイトに訪れた時に快適に、迷うことなくスムーズに使うための設計」の事を指します。
下記のような部分を踏まえていかにユーザーにとって使いやすいWEBサイトにできるか?それがUIデザインの本質となります。
大切なポイント
- フォントのサイズ、種類
- イラスト
- ボタンの位置、大きさ
- 入力欄の幅
なぜUIデザインが必要なのか
UIデザインがしっかり考えられて設計されているか、そうでないかでサービスの利用率に大きく影響するからです。
UIを考えずに制作すると
- アクセスされてもすぐ離脱される
- お問合せがない/あるいわ少なくなった
- 購入に結びつくことができない
せっかくWEBサイトを作り替えても悲惨な結果になります
※もちろんUIデザインだけが理由ではありませんが。。
UIデザインが悪いサイト
- 欲しい情報がどこにあるか分からない/li>
- 文字が小さく、イラストなどもごちゃごちゃしてて見づらい
- 動きが多すぎて早く見たい情報が見れない
- お問合せがどこにあるか分からない
いくらインパクトがあろうと、良い情報を発信していても、ユーザーが「使いづらいな…」と思ってしまえば
お問合せや予約に繋がることなく離脱されてしまいますので、それを避けるためにも
UIデザインを意識することが必要となります。
UIデザインの前に考える必須ポイント
- 「誰に伝える」
- 「どうしてほしい」
- 「何を伝える」
- 「どう伝える」
ここがぼやけているとWEBサイト自体もぼやけたものになりますので
なんとなくで進んでいきます。
それは避けていきましょう。
◆誰に伝える
・ターゲットは?
・男性?女性?
・年齢は?
・職業は?
◆どうしてほしい?
・お問合せしてほしい
・商品を購入して欲しい
・資料請求をしてほしい
・店舗にきてほしい
・会員登録して欲しい
◆何を伝える
・サービスの流れ
・価格
・仕様
・利用者の声
・商品のメリット
・実績
◆どう伝える
・テキストや画像を使って
・動画で伝える
・並びはどうする
ここらへんが具体的になってくると、デザインを提出された時に「なんじゃ、こりゃ!?」「思ってたのとなんか違う」となってしまい
トラブルになってしまいますので、制作会社に丸投げは避けましょう。
UIデザインをする上での画面設計ポイント
タイ
デザインをする上で、4つの大切なポイント
- 近接
- 整列
- コントラスト
- 反復
▶近接
情報同士の距離感を調整することでその情報が、どこの情報とセットで紐づいているのかを明確にします。
▶整列
バラバラになっている情報(テキストや画像)をそろえることです。
▶コントラスト
情報に強弱をつけて目立たせます。
色やサイズに変化を持たせることで、重要な情報なのかをユーザーに強調しましょう。
▶反復
レイアウトや、色などの要素を何度も使って一貫性を持たせます
全体的に統一感が生まれるため、ユーザーも情報を理解しやすくなります
まとめ
UIデザインについて書かせて頂きました。
UIデザインがしっかりとしていないと、サービスの利用率に影響を及ぼします。
インパクトがある奇抜なものを求めているわけではありません。
ユーザー自身にとって使いやすいサイトなのかを求めています。
また、使いやすい見やすいというのが無意識にユーザーにあるのであれば
UIデザインというのはWEBサイトを制作するにあたって必要最低限かもしれません。
そこを作り手側はもちろん、依頼する側もすこーしでも頭の片隅にあれば
より良いWEBサイトになるかと思います。
いいねありがとうございます!