2014/10/27 クリエイター

ユーザー目線になって考えよう、モバイルデバイスのUIデザインのポイント6つ

ユーザー目線になって考えよう、モバイルデバイスのUIデザインのポイント6つ スマートフォンやタブレットなどのモバイルデバイスのUIをデザインを考える際に意識しおきたいポイントを6つ紹介します。フォント、色、操作性など、ユーザーの目線になり、ユーザーにとって使いやすいUIデザインとは何かを考えたいですね。

フォントを1種類にする

アプリで使用するフォントは1種類にしておく方が統一感があります。
フォントを数種類使用すると統一感が損なわれ、デザインにもブレが生じます。
行間、フォントサイズなどタイポグラフィを調整して読みやすくし、強調したい部分はウェイトで調整します。

色の種類を少なくする

アクセントをつけるために復数の色を使いたくなりますが、色の種類が多くなるとユーザーが操作に迷ってしまいかねません。
ベースとなる色を決め、アクセントに使う色は1色あれば充分優れたデザインはできます。
色数を抑えればアプリのカラーイメージも定着しやすいので、使用する色はできるだけ少なめにしましょう。

スワイプを活用する

スマートフォンやタブレットなどのモバイルデバイスは、スワイプという優れた操作ができます。
スワイプの方がサクサクとページ遷移ができるので、より高いUX(ユーザーエクスペリエンス)を実現するためにスワイプの存在は欠かせません。

ブラー(ぼかし)を活用する

ブラーエフェクトを使うと磨りガラスのように背景をぼかして映すことができ、通常のページ遷移よりもデザイン性が高い表現ができます。
iOS7以降ではコントロールセンターを下からスワイプして呼び出すことができ、磨りガラス風になっているので背景が透けて見えるように、ブラーエフェクトを効果的に使うと印象深くなります。

タップできる領域を広くとる

パソコンだとマウスでピンポイントでリンクをクリックできますが、モバイルデバイスの指でのタップだと正確にタップしにくいのが難点です。
タップして反応する領域を広くとっておき、ピンポイントでタップしなくてもリンクやボタンを押せるようにしておきましょう。
また、リンクであることが分かりやすいデザインにすることも大事です。

余白をうまく使う

シンプルでデザイン性が高いUIにするには、余白をうまく使うのがポイントです。
線を多用するより余白でデザインした方がスッキリ見せられます。
また、誤って操作しないように画面やボタンを左右や少し余白を持たせておく配慮も必要です。
Webデザインの求人案件 Webデザインの求人案件

Webデザイナーやクリエイターの求人・案件情報です。
制作会社もあれば自社サービスのUIデザイン案件等、幅広く掲載しています。