web-dev-qa-db-ja.com

モバイルアプリフォーム-水平プログレスバーのより良い代替手段?

私はモバイルアプリのフォームに取り組んでいます。フォームには、以下に示す5つのステップが含まれています。 5 step showing progress

これはiphone 5用であり、縦向きモードではステップ3と4が途切れるので、そのままでは適合しません。これを実装するためのより良いオプションは何ですか?誰かがすでにモバイルデバイスにこれを実装しているかどうかを確認したいと思います。事前に感謝して助けてください。

3
GirishUnde

一般的に、人々はモバイルデバイス上で長い連続したフォームを持っていません。ただし、モバイルはあらゆる面で機能が豊富になりつつあるため、モバイルに期待するのは当然です。 @tohsterは、ウィザードをモバイルに実装する方法の正確なソリューションを提供しています。

あなたはさらにあなたの不動産を解放するかもしれないいくつかの変更を検討したいかもしれません。これらは、すでに提供されているものに追加されます。これらのデザインはどちらもシーケンシャルフローに適しており、ジャンプは推奨されません(UIはそのための十分なアクション要素を提供していません)。

さらに、水平スワイプを使用して、1つずつステップ間を移動できます。

enter image description here

言うまでもありませんが、これは私が思いつくことができる簡単なモックアップであり、ピクセルパーフェクトではありません。随所に問題がありますが、伝えたいことをきちんと理解していただければと思います。

3
Sol

設計の優先順位付けを使用して、レイアウトを簡素化します。

最優先事項は次のようなものです。

  • ユーザーは彼女がどの段階にいるかを知る必要があります。
  • ユーザーは、彼女がプロセス全体のどこにいるかを知る必要があります。

その結果、いくつかの可能性があります:

enter image description here


enter image description here

3
tohster