web-dev-qa-db-ja.com

マテリアルデザインには、多くのフォームフィールドをグループ化/整理するためのガイドラインがありますか?

マテリアルベースのサイトに、ユーザーがエンティティデータを編集できるエディターがあります。各アイテムには多数のキーと値のペアが含まれる可能性があり、そのうちのいくつかのみが必要です。最も一般的に使用されるものを上部近くに表示しようとしていますが、それでもすぐに あなたの会社のアプリ の領域。

私は マテリアルフォームのfieldsetに関するSO に関するこの古い質問を見てきましたが、 この質問の唯一の回答からのこの例 を出発点として使用します。ただし、フラットな編成でも、数ページスクロールする可能性のあるエディターになります。ステッパー(またはおそらくタブ?)を使用しても意味がないと思います。1つのフィールドを編集するためにポップインしたユーザーは、複数のミステリーページをクリックして、どこにあるかを理解する必要がないためです。探しているかもしれません。

すべてのフィールドが1つのページにあることを確認するようにしてよろしいですか?もしそうなら、マテリアルは私の壁の壁をユーザーの不快感を少なくする方法について意見を持っていますか?

4
Coderer

私は フォーム要素のグループ化に関する一般的なユーザビリティガイドライン に従いますが、マテリアルデザインでスタイルを設定します。

ステッパーはあなたの目的には適していませんが、 通常、タブは同じワークスペース内の異なるパースペクティブを表す 、または異なるセクションであり、タブ付きのインターフェースを使用すると、ユーザーはセクションを切り替えることができます(ステッパーとは異なります)。

Jakob Nielsenの記事から、タブ、使用済み

タブを使用して、異なるコンテキストに移動するのではなく、同じコンテキスト内でビューを切り替えます。これは、最も重要な点の1つです。なぜなら、ビューを交互に表示している間、その場所に留まることが、そもそもタブがある理由です。

ユーザーが特定のタブを選択したときに何が表示されるかを簡単に予測できるように、タブの背後にあるコンテンツを論理的に分割します。 (カードの並べ替えは、この「ミニIA」問題を調査するための1つのオプションです。明確に区別できるグループが見つからない場合、タブはコンテンツを管理するための誤ったインターフェースコントロールである可能性があります。)

ユーザーが複数のタブのコンテンツを同時に表示する必要がない場合にのみ、タブを使用してください。人々が異なるタブの背後にある情報を比較する必要がある場合、前後に切り替える必要があるため、短期記憶に追加の負担がかかり、認知負荷と相互作用コストが増加し、すべてを1つの大きなものに配置するデザインと比較して使いやすさが低下します。ページ。

本質的に並行しているタブをデザインします。タブが大幅に異なる場合、ユーザーはそれらをサイトナビゲーションとして解釈します。

2
Yvonne Aburrow