「Add New Button」の最適な場所はどこですか？
レコードのリストがあります。新しいレコードは定期的に追加されますが、一度に1つのレコードのみが追加されます。 「Add New Button」の最適な場所を決定するのに苦労しています。ボタンをクリックすると、ユーザーがレコードの詳細を入力できる新しいウィンドウが開きます。
2つのオプションが検討されています。
- リストの外側にレコード追加ボタンのあるリスト（上、下、左揃え、右揃え？）
- 新しいレコードを追加するためのリンクが付いた永続的な追加行（上部または下部）を持つリスト。新しいレコードを明確にすると、このテーブルに追加されます。
私のクライアントは2が大好きですが、既存の例を見つけるのに苦労しています。これはどこでもうまく使用されていますか？
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
ワークフローの設計！
ユーザーがレコードを作成する理由と方法をモデル化します。
例えば：
ユーザーがレコードを作成する明確な目的でページを開く可能性が高い場合、ボタンを左上にすぐに配置すると、ユーザーは最小限の摩擦でボタンを押すことができます（ボタンを探す必要はありません）。
ユーザーがレコードを作成する前にテーブルをスキャンする必要がある場合（たとえば、既存のレコードがあるかどうかを確認するため）、下部に作成ボタンを配置すると、そのワークフローに役立ちます。
ユーザーの90％がテーブルを読み取り、ユーザーの10％だけがレコードを追加する場合、テーブルを最上部に配置し、下に作成ボタンを配置することは、90％のユーザーにとってより良いワークフローです。
...これらの例は、ランダムな他のサイトが行うことを単にコピーするのではなく、実際のワークフローと生産性に基づいて、ユーザーワークフローのモデリングにアプローチし、効果的なソリューションを設計する方法のアイデアを提供するのに役立ちます。
要素の位置はコンテンツの量によって異なります。要素がレコードの下に配置されている場合、ユーザーは行を追加するときにさらに下にスクロールする必要があります。
フローティングアクションボタンを見る
Googleのマテリアルデザイン フローティングアクションボタン は、多くの場合画面の右下に配置され、上の要素から絶対的に配置されますページ。状況によってはユーザーのビューをブロックする可能性があるため、FABボタンに関していくつかのUXの不満がありました。その場合は、コンテンツの右上にボタンを配置する必要があります。
ユーザーが多くの行を追加する場合、ボタンを画面の右下の固定位置に配置すると、最もユーザーフレンドリーになります。
ボタンまたはリンク？
フィッツの法則 によると、ユーザーが定期的にクリックした場合、ボタンになるはずです。
Razor9012の答えから続く：
ボタンを上に配置することをお勧めします。理由は、ビューポート全体をカバーする多数の行がテーブルにあるとしましょう。次に、この場合、ボタンはビューポートから非表示になります。ユーザーが実際に新しい行を追加するには、下にスクロールする必要があります。ほとんどのユーザーは、画面が小さく、下にスクロールしなかった場合に、追加ボタンがあることさえ知りません。 Razor9012の回答に記載されている画像は、この良い例です。アイデアは、プライマリアクションボタンをユーザーに表示することです。
右上から見たところ、右から左に読む中東の地域を除いて、右上が新しいボタンの最も一般的な配置のようです。
http://blog.mailchimp.com/wp-content/uploads/2013/06/Redesign2x_iPad.pnghttp://blog.datalicious.com/assets/sites/2/ TagSummary1.pnghttps://www.submarinecrm.com/assets/post-shortcuts.png