全画面ウィザードでの戻る、キャンセル、次の配置

Question

こんにちは私はフルスクリーンウィザードを持っています。多くのウィザードと同様に、[戻る]、[キャンセル]、[次へ]ボタンがあります。これらのボタンを画面に配置する最適な方法は何ですか？

これを調べた研究はありますか？.

これらはいくつかのオプションですが、それらすべてが間違っている場合は遠慮なく教えてください。 

Answer 1

これはwizard patternについての良い記事です http://ui-patterns.com/patterns/Wizard

最善の方法は3番目のオプションです。右下にNextおよびBackボタンを配置します。ユーザーは通常これらを使用するため、主にNextボタンを使用します。何かを忘れた場合や何かを確認したい場合は、Backボタンを使用します。 Cancelボタンは、例外として意図されているため（つまり、ユーザーがプロセスをキャンセルしたいため）、左下にあるはずです。

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

キャンセルボタンがあることは非常に重要です。複数のステップを含むウィザードがあり、キャンセルボタンがなく、開始した場所に戻りたい場合は、いくつかのBackボタンをクリックして最後までクリックする必要があります。回、これはユーザーにとって恐ろしい経験です。

Answer 2

私はラベルBackを避け、それをPreviousで置き換えて、[戻る]ボタンとの混乱を避けます。これは、ウィザードページが閲覧履歴と一致しない場合に特に当てはまります。

また、キャンセルはWebページではあまり明確ではないため、次のように名前を変更することをお勧めしますキャンセルしてabcに戻る

レイアウトに関しては、ページナビゲーションが同じ場所に配置され、リンクのキャンセルが少し焦点が合っていない3番目のオプションをお勧めします。

Answer 3

これは、ある時点でおそらくボタンの配置に関して、プライマリアクションとセカンダリアクションのある記事です。 http://www.lukew.com/ff/entry.asp?571

あなたの例はマルチページウィザードであり、2つのセカンダリボタンがあるため、少し異なるアプローチが必要だと思います。

したがって、このようなものが機能する可能性があります。

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

Answer 4

あなたの例は、デスクトップアプリケーションとは対照的に、ブラウザーで実行されるWebアプリケーションであると想定しています。これが本当である場合、ボタンのレイアウトの混乱は、ボタンをクリックしたときに何が起こるかを本当に理解していないことに起因する可能性があります。

これは、ユーザーが「キャンセル」をクリックした後に何が起こるかわからないことが多いため、Webアプリケーションの「キャンセル」は理解するのが比較的難しいと言われています。かなりの数のユーザーテストを実施しましたが、95％以上のユーザーが[キャンセル]をクリックした後に何が起こるかを理解していませんでした。

「戻る」と「次へ」ボタンに関して。これらは、ユーザーが現在プロセス内のどこにいるかを示すインジケーターがある場合にうまく機能します。

フォームが過度に大きくない場合の個人的な提案として、セクションの明確な視覚的インジケータを備えた単一のページに配置することをお勧めします。明確なサブタイトルと行がうまく機能すると思います。

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}