材料設計必須フィールド
マテリアルデザインで、必須フィールドの表示方法を見た人はいますか？現時点では、必須フィールドが入力されるまで送信ボタンを非表示にするか、送信時にエラーをスローすることがガイドラインのようです。
「必須」がフィールドの横の括弧内に書かれている例と「不要」が書かれている例を見てきましたが、これは少し圧倒されます。
ラベルに古き良き赤いアスタリスクが付いているだけですか？ （この場合、それはプロンプトテキストであり、フィールドに入力するとラベルに変わります。）
フィールドを必須としてマークする方法は、マテリアルデザインの一部ではありません。
一部のアプリケーションは、事後に検証エラー「このフィールドは必須です」を使用することを選択し、他のアプリケーションは別の方法で選択することにすでに気づいています。
必須フィールドの指定方法に関係なく、有効な情報を入力したら、ユーザーに何らかの 即時フィードバックを提供してください。
必須フィールドが1つまたは2つしかない場合は、赤いアスタリスクを使用しても問題ありませんが、より明示的な
(required)フィールド名の一部としてのテキストは、そのスペースがあることを前提としてより明確です。オプションのフィールドが1つまたは2つしかない場合は、Word
(optional)はフィールドラベルの一部として括弧で囲んでいますが、特にオプションの場合は特に必要ありません。フォーム上の入力の変更を制御できず、単一の一貫したパターンが必要な場合は、すべての隣に（必須）を置くと言いますが、1つの入力の隣に（オプション）を置くよりも優れています1つの入力を除くすべて
必要な情報のみを尋ねることを検討してください
プログレッシブ開示 は、必須の情報のみを事前に収集し、ユーザーが後で追加の（オプションの）情報を追加できるようにする方がよいことを示しています。
デザイナーとして、私はすべての入力フィールドをエントリーへの障壁として扱います。言い換えれば、それが存在する必要がない場合、なぜ最初にそれを要求するのですか？かなりすべての入力が必要です。オプションがあるとユーザーに値が追加されるまれなケースを除きます。 （たとえば、descriptionまたはadditional info 田畑）
このセクションがいつ追加されたかはわかりませんが、現在、仕様には 必須フィールドに関する短いセクション があります。
フィールドが必須であることを示すには、フィールドの横にアスタリスク（*）を表示します。フォームの下部に、アスタリスクが必須フィールドであることを説明するメモを含めます。
材料設計は必須フィールドについては黙っています。ただし、マテリアルデザインのドキュメント この相互作用の例を示しています 必須フィールドの場合：
追加の提案：
私はアスタリスクのファンではありません。これは、「必須」を明確に伝えておらず、特にツールチップや凡例が提供されていない場合、ユーザーに不安や不満を引き起こす可能性があるためです。
マテリアルデザインは、色を使用してフィールドのステータス（フォーカス、無効、エラーなど）を伝えます。したがって、色は、オンスクリーンパレットが過負荷になる可能性があるため、必要なフィールドを区別する優れた方法ではありません。
マテリアルデザインでは、明確なプレースホルダーを（上記の例のように）広く使用しているため、必須フィールドを示す論理的な方法は、プレースホルダーテキストで
First name (required)を使用することです。これにより、フィールドの説明の横に要件が設定され、あいまいな記号や色に依存しなくなります。
必要なフィールドに対するマテリアルデザインのソリューションは、ユーザーに事前に通知するのではなく、入力に失敗した後の手首の平手打ちであることに驚きます。不正なパスワードを選択した後、怒りを誘発するだけでなく時間を浪費するなど、具体的なフォーマットが必要であることを事前に知らせずに怒鳴るサイトを思い出します。
私はStephenと同様に、保険会社の場合はフォーム駆動型のサイトを使用しており、1つのページに20以上のフィールドを簡単に設定できます。 （これまでに家の見積もりを通過したことがありますか？）一部のフィールドは必須ではありません。それらを取り除きたいのですが、それらはビジネス要件の一部です。
ヒントテキストの最後に「（必須）」を置くと、各必須フィールドにフォームが散らかって表示されます。必須フィールドのヒントテキストの前にアスタリスクを付け、入力時にヒントテキストが消えた後もアスタリスクを残してしまいました。まともな外観、そして-さらに重要なこと-うまくテストします。
また、入力に特定のフォーマットが必要な場合は、ユーザーがミスをした後にMDが行うことを実行します（上のスレッドに示されています）が、赤ではなくテキストのフォーカス色を使用して、フォーカス時に同じメッセージを表示します。うまくいきます。