以前スマホデザインの基礎的ルールについて書かせていただきましたが、
(見やすい、使いやすいスマホサイトを制作するには? デザインのまとめ)
今回はスマホのUI設計についてご紹介いたします。

■ １．利用シーンを想定する

スマホUIを設計するには、利用シーンを想定することが重要です。

ここでは例として、次のように利用シーンを仮定します。
『友達とご飯を食べに行くことになった！今すぐスマホでお店を検索しよう〜』
その時にまず、どのような情報を必要とするでしょうか?

・お店のメニュー、食べ物のジャンルは何だろう?
・お店までの道順はどれくらいだろう。
・電話をかけて予約をしておきたいなー。
・何時までやっているのだろうか。
・クーポン券はあったりするのかな?

などが考えられます。
これらの情報が分かりやすく、スムーズに頭に入るように設計できれば、ユーザーのニーズを満たすUI設計になるでしょう。

■ ２．使う場面(場所)を想定する

次に使う場面(場所)を考えてみましょう。

・歩きながらの操作、片手でも使いやすいサイトか。
・ボタンが見やすいか、押しやすいか。
・屋外で閲覧しても見やすいサイトになっているか。

さらに細かく考えれば、

▽ボタンが押しやすいか
→誤操作が起きないようボタンを詰め過ぎないようにする
→押しやすい大きさにする
→重要ボタンは右利きでも、左利きでも押しやすいよう横長のボタンを配置する
→指が届きやすい位置にボタンを配置する
→一目で重要なボタンと、そうでないボタンが分かるように大きさや色で差をつける

▽屋外で閲覧しても見やすいサイトになっているか
→背景と文字色の色のコントラストをつけ、はっきりと見やすい配色にする

などなどあげられますね。
まだまだほんの一部しかあげられていませんが、
利用シーンをしっかりと想定し、設計することが大事です。

■ まとめ

今回はご飯を食べに行くという設定で書きましたが、実際にはこのようなシチュエーションはたくさんあります。
『誰がどのような利用シーンでどのように使われるか』を今まで以上に考える必要がありますね。
また、普段使用していて『使いやすいサイトだな〜！不便なサイトだな、、』と気づいたことをメモしておくといざ設計＆デザインを考える時にとても参考になります。

皆さんが使いやすいサイトを制作できるよう心かげていきます〜