iPhoneアプリで連続してデータを入力する画面レイアウトを考えてみる (前編)

iPhoneアプリ開発

連続入力画面前編1

現在リリースしているアプリにはポモドーロテクニックが使えるように、25分、5分という間隔で通知が行われるようになっています。
これをもっと自由に、そして手軽にユーザーの方に作成して使ってもらえるようにしたいなと考えています。
そのためには、通知パターンを手軽に登録できることが必須です。

入力項目はタイトル、時間、通知の音の3つ。
ユーザーによる必須入力項目は時間のみというものです。

連続入力画面前編2

一番最初に考えたのがこの画面。
Table型でそれぞれの入力項目をタップすると、キーボードなりPickerなりが下から出てくるような画面。入力後はセルが順番に下に追加され、同じ画面で削除や入れ替えができるような画面です。

この仕様だと何かしらの項目を入力する度に上に指を伸ばしタップして・・・を繰り返すことになります。それだと指の移動距離が長く、あまり手軽ではにないよなと。

連続入力画面前編3

次に考えていたのが、タイトル、時間、通知方法を1画面ずつ構成するパターン。
これならば、指は画面下のエリアにとどめたままで入力が可能になります。

ところが、これはあまりよろしくないパターン。
最近読み始めたモバイルデザインパターンにアンチパターンとして記載されています。

2-4 Multi-Step (複数のステップ)
モバイルデバイスでは、画面が小さいため大きなプロセスバーは表示できません。
プロセスバーに小さな文字列が埋め込まれており、そのエクスピリエンスうんざりするものでした。

2-8 Long Form (長いフォーム)
フォームを機械的に複数のステップへ分割するのは避けましょう。1つのページの中でスクロールしながら操作してゆくというのが、望ましいやり方です。ただし、不要なフィールドは遠慮なく削除しましょう。

Webでよくあるやり方をそのまま持ち込んではダメ。モバイルに特化した作りにしなければなりません。
次回ではもう少し違う画面構成を考えてみることにしてみます。