web-dev-qa-db-ja.com

ボタンの一貫性を壊しても大丈夫ですか?

現在、すべてのボタンがダッシュボードで左揃えになっています。配置はフォームの入力に意味があります。ただし、ウィザード内で「戻る」ボタンと「次へ」ボタンを追加する必要がある場合は、これらのボタンを期待どおりに配置してから、次に戻ることは理にかなっています。

ボタンの一貫性を壊しても大丈夫ですか? Button Layout

3
andrw

特定の状況では、明快さが一貫性を上回ります。

コンテキストが変化するアプリケーションの場合、設計システムの不整合の意図的なインスタンスがたくさんあります。

私はウィザードの例を見てきました < BackNext > ボタンは互いに隣り合って配置されており、あなたが下に持っているアプローチと同様に、両方とも機能しているように見えました。

ユーザーとテストして、ユーザーがスリップ(間違ったボタンをクリックするなど)を行っていないかどうか、および完了時間を確認します。

Salesforceの復元力のある設計原則

この記事(および付随する講演)では、Salesforceが設計上の決定に優先順位を付ける方法について説明します。それらは優先順位付きリストを持ち、その最初の原則はClarityであり、Consistency3位入賞。

enter image description here

一貫性を構築しようと過度​​に試みたときに、これが貴重なリソースであることがわかりました。ユーザーテストでは、パターンを解除することで、ユーザーにとってより明確でエラーが少なくなることがわかりました。

どちらの方法でも、ステッパーを下部に固定するコントラストを追加して、上記のフォームコンテンツと区別することができます。

enter image description here

7
Mike M

ここで重要なのは、「一貫性」ではなく、「近接性」のプリンシパルと関係があると思います。つまり、互いに類似したアイテムは、互いに近くに配置する必要があります。

論理的な観点から見ると、ユーザーが「後ろ」と「前」を左右のコーナーに関連付けると考えるのは簡単です。ただし、ユーザーは通常、ブラウジング時に論理的なアプローチをとらず、視覚的な流れに沿って進むだけです。これが近接性が非常に重要な理由であり、ボタンを分離する必要はないと思います。

主な例として、Webブラウザーを検討します。これは、この規則を他よりも多く使用しているアプリケーションです。これらの機能は常に互いに隣接しています。後ろがアドレスバーの左側にあり、前が右に遠い場合、それはかなり奇妙に思えます。

いつものように、テストは重要です。お役に立てれば。

1
Andrew Weibert

ボタンの一貫性は、ボタンの配置ではなくスタイルと動作に重点が置かれているため、この場合は、アプリケーションのさまざまなセクションまたは領域にあるコンポーネントのレイアウトと位置を参照しています。 2つの異なる例。

ただし、一貫性はユーザーが定義して従うスコープとコンテキストに基づいているため、実行していることが一貫性を壊さなければならない理由はありません。あなたがする必要があるのは、次のルールと動作を定義することです。

  • フォーム上の行動を促すフレーズ(例:プライマリボタンとセカンダリボタン)の場所
  • ウィザードのナビゲーションボタン(および関連するデザインパターン)
  • ボタングループ内の配置と間隔

これらの設計ガイドライン(および考慮する必要のあるその他のガイドライン)の間に一定のレベルの一貫性がある限り、規則に違反することはありません。ただし、一連のガイドラインを設けることの一部は、そうすることが理にかなっている場合にルールを破ることもできるようにすることです。ここで重要なのは、既存/従来のデザインパターンを適用する場合でも、新しいパターンを作成する場合でも、デザインの根拠を伝えることです。

そして前述のように、ユーザーとデザインをテストすることが重要です(これはおそらくすべての中で最も重要なルールです)。

0
Michael Lai