UI/UX デザイン 問題集

Web / アプリの UI・UX デザインを、公開されている一次資料（Nielsen Norman Group のヒューリスティック、Laws of UX、WCAG 2.2、Material Design 3、Apple Human Interface Guidelines、デジタル庁デザインシステム、GOV.UK Design System、Practical Typography）に基づいて問う問題集です。画面はワイヤーフレーム（線画）で示し、「どの原則に反しているか」「どう直すべきか」「この値は基準を満たすか」を判断します。

基礎	原則と法則、レイアウトと視覚階層、タイポグラフィ、色とコントラスト（計算を含む）。
実装	コンポーネントとパターン（フォーム・ボタン・ナビ・エラー）、アクセシビリティ（WCAG 2.2）、状態とフィードバック（ローディング・空・エラー・モーション）。
プロセス	情報設計と導線、デザインシステムとトークン、リサーチと評価。

学習モードでは選択肢をクリックすると正誤と解説が表示され、解説の末尾に参考資料へのリンクがあります。模擬テストモードでは制限時間つきで通しの演習ができます。

問題の前提

• ワイヤーフレームは実際の色や書体を表していません。問題文で示した数値（px・コントラスト比・文字数など）を根拠に判断してください。
• WCAG は 2.2 の達成基準を、レベル AA を基本にしています（AAA を問うときは明記）。
• 「px」は CSS ピクセル、コントラスト比は WCAG の相対輝度の式で計算した値です。
• プラットフォーム固有の数値（タッチ領域 44pt / 48dp など）は、どのガイドラインの値かを明記しています。