フォームはUI品質が最も問われる場所
フォームのUIはユーザー体験に直結します。デフォルトのブラウザスタイルから脱却した、洗練されたフォームデザインをAIで一気に実現できます。
プロンプト例（お問い合わせフォーム）
「お問い合わせフォームのHTML・CSS・JSを作成してください。
フィールド：お名前・メールアドレス・お電話番号（任意）・お問い合わせ内容（テキストエリア）・送信ボタン
・フローティングラベル（入力時にラベルが上に移動するアニメーション）
・フォーカス時のボーダーカラー変化（#3498db）
・バリデーションエラーはフィールド下に赤テキストで表示
・送信ボタンのローディング状態（スピナー表示）
・送信完了アニメーション（チェックマーク）
・label-input の for/id 属性を正しく設定（アクセシビリティ）」
フォームデザインの改善パターン
- フローティングラベル：入力欄がアクティブになるとラベルが上に浮き上がる。
- パスワード表示切り替え：目のアイコンで入力内容を表示/非表示にする。
- ステップフォーム：複数ステップに分けたウィザード形式のフォーム。
- リアルタイムバリデーション：入力のたびにバリデーションメッセージを更新。
アクセシビリティも一緒に依頼する
- 「label と input の for/id を正しく設定してください」
- 「必須フィールドに required 属性と aria-required を設定してください」
- 「エラーメッセージに role=’alert’ を設定してください」
