セグメントコントロールとタブの使い分け

2本目のアプリを作ろうとプロトタイピング中。

ある程度コンセプトやコアの機能が固まってきたので画面のタイプを決めることにしました。あまり機能が多いものは作らないので、デフォルトで入っているユーティリティタイプか、タブタイプのどちらかにしようと決めました。

色々と紙に書きなぐって検証したところユーティリティタイプは向かないことが判明。

すぐにメインの画面にたどり着く必要があるアプリなので以下の理由でダメに。

1)ページ数に限りがある

2)1ページずつめくらなければならない

3)ステータスによって表示する内容が変わる

こんな感じでタブ型に決めようとした時に、ふとセグメントコントロールを使えばいいんじゃないか。と思いついたのですが、この2つってどう使い分けるんだろう?と疑問がわきました。

つーことで「iPhoneアプリ設計の極意 ―思わずタップしたくなるアプリのデザイン」を引っ張りだしてタブ型のページを見てみるとこんな記述が。

121230_blog0

それぞれのタブボタンに表示するものに制約はありませんが、アプリで提供する機能(タスク)や情報の種類別にするのがよいでしょう。

さらに

各タブに関連づける画面はそれぞれ独自のスタイルのインタフェースにすることができ(むしろ普通はそうすべきで)、各画面のコンテンツや利用するツールに合わせて調整します。

なるほど、確かに時計アプリケーションを見てみると”時間を計測する”という共通の概念の下に一つのアプリケーションの中に色々な機能が収められています。

しかしタブを切り替えるだけで”時間を計測する”あらゆる機能の提供を可能にしています。

121230_blog2

現在の時間を見る時計、目覚まし時計、ストップウォッチ、タイマー(砂時計とか)は現実の世界でも使い分けられています。決して壁にかけられている時計で50m走を計測することはないですし、ストップウォッチでカップラーメンの3分を計ることはありません。

今回、僕がやりたいのは処理済みなのか、未処理なのかといった状態を元に表示を切り替えることです。コンテンツ自体は変化のないものなのでタブはふさわしくありません。

このタイプの切り替えはセグメントコントロールが一番ふさわしいのではないか、という結論に。

121230_blog1

またもや「iPhoneアプリ設計の極意 ―思わずタップしたくなるアプリのデザイン」で調べてみました。

ピンときたのはこのワード。

セグメントコントロールは、アプリのひとつの画面またはカテゴリ内でコンテンツの表示方法を変更できる、いわばサブナビゲーションとして使えるわけです。

ビンゴ。ついでにもう一丁。

セグメントコントロールにおいては、すべての選択肢の重みが同じでなければならず、見た目も平等でなければなりません。

求めてたのはまさにこれでした。タブを使用した場合と比べておそらく作業工程もグッと減らすことができたはずです。

おそらく書きだしたりしていなければ、これに気づかずにタブ型で進めて、ある程度進んだところで引き返せなくなって後悔していたかもしれません。徹底的に検証しておくことに重要さが分かりました。

セグメントコントロールを使用したデザイン的な部分がほぼできたので、これから技術的な部分の検証に入るのですが、色々と盛り込みすぎて正直できるのかどうかすごく心配です。

広告

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中