web-dev-qa-db-ja.com

ワークフローボタンの場所

私たちのシステムには、1〜多くのステップを持つワークフローがあります。以下に、ボタン「保存」と「キャンセル」を備えた、1ステップのみの非常にシンプルな例を示します。私たちのシステムに存在する他のいくつかのワークフローには、「保存して追加」「保存」「キャンセル」などのボタンの組み合わせがあります。別のワークフローには、「前へ」「次へ」「プロセスの実行」があります。私のポイントは、ボタンの多くの組み合わせで多くの異なるワークフローがあり得るということです。

以下の2つの例を比較するときに、ワークフローのボタンの場所に関するベストプラクティスはありますか?

オプション1:左上にあるボタン

オプション2:ボタンが右下にあります

enter image description here

2
L. Lemmer

レイアウトとフォームのタイプによって異なりますが、最終的には、CTAボタンはフォームの下にある必要があり(UIをスキャンする方法のため)、入力から分離されていない可能性があります見える(または一部のビューに表示されない)

例によると、最良の方法は、垂直方向に従って、画面の下部にボタンを配置することです。

ステップの数は、ボタンを右または左に揃えるかどうかを定義します。

1列のレイアウトでは、ユーザーの目は垂直方向に動き、フォームに記入します。ユーザーがフォームの下部に到達すると、ボタンを見つけるために目を左または右に移動する必要がなくなります。

http://uxmovement.com/forms/aligning-submit-buttons-on-form-column-layouts/

検討する必要のあるフォームには、マルチページ、マルチセクション、および単一ページのフォームの3つのタイプがあります。使用するフォームの種類によって、送信ボタンを配置する場所が決まります。

http://uxmovement.com/forms/where-to-align-form-b​​uttons-on-different-layouts/

簡単に言えば、CTAをフォームの下に配置します。離しておけば、離れすぎているようには見えません。

1
S M