要素の配置について

以前、ボタンの UI についてで、使いやすいアプリケーションを作るためには「細かい部分の使い勝手の追求」が大切、というお話しをしました。今回はその続編で、ボタンなどの要素の配置についてご紹介します。

アプリケーションの利用シーンを考える際、必ず関わってくるポイントの一つが利用場所とそれに合った持ち方です。ゲームのように自宅などでじっくり操作することを想定しているアプリケーションであれば、右利きの人の場合、ユーザーは左手で iPhone を支えて右手人差し指で操作することや、ゲーム機のコントローラーのように両手で持って両の親指で操作することができます。しかし、屋外で、特に移動中にチェックするメーラーやニュースリーダーだと、片手親指での操作、しかも道順や他の歩行者、車などに気を取られながらの操作になるので、すばやく簡単な操作が求められます。

例えば、先ほどの移動中、片手での操作を想定するアプリケーションの場合だと、端末の画面に対するユーザーの操作範囲は図のようになります。

＊右手での操作の場合です。

一番濃いオレンジが「とどきやすい」、つまり一番操作しやすい部分になります。

次に濃いオレンジがふつうに「とどく」部分になります。画面右下部分は指に近いので一見とどきやすいのでは？と考えてしまいますが、実際操作するのは親指のお腹の部分です。そのため、手前部分を操作するには指を曲げた上で動かすことになるので、「とどきやすい」箇所よりは若干操作はしづらくなります。

そして、一番薄いオレンジの範囲はある程度指を伸ばさないいけない「とどきにくい」部分、黒い箇所が操作するためには手のひらから iPhone の位置をずらす必要がある「非常にとどきにくい」部分になります。
＊あくまで目安です。手のサイズによって異なります。

言うまでもありませんが、使いやすいアプリケーションにするためには、「とどきやすい」部分を中心に、よく使う機能を使いやすいように配置する必要があります。

ナビゲーションバーやツールバーなど、ある程度配置が固定される UI もありますが、それ以外のスペースに関しては、ユーザーがどこでどのように利用するかを意識して要素の配置や操作方法について熟慮すると、もっと使いやすいアプリケーションになります。