絞り込みにはJavaScriptが必要です。すべてのレシピと詳細リンクは引き続き利用できます。
条件に一致するレシピはありません。検索語または絞り込み条件を見直すか、条件をリセットしてください。
ナビゲーション追加ライブラリ不要
アンカー型目次ナビ
長文を章単位で跳ねる目次の配置と、長い見出しでも崩れない導線を確認するレシピです。
詳細を見るフィードバック追加ライブラリ不要
非同期コンテンツ状態
読み込み、内容あり、0件、失敗、再試行、更新中、更新失敗を、サンプルデータと回復操作で確認できる状態レシピです。
詳細を見るナビゲーション追加ライブラリ不要
トップへ戻るコントロール
スクロール量に応じた表示切替と、戻る操作の成功フィードバックを確認するレシピです。
詳細を見るナビゲーション追加ライブラリ不要
パンくず階層ナビゲーション
利用者の現在地と上位階層への導線を、可読性の高いパンくずとして切り替えて確認できるレシピです。
詳細を見るダイアログ追加ライブラリ不要
確認ダイアログ
元に戻しにくい操作の対象と影響を説明し、取消、処理中、失敗、完了までを安全に扱う確認レシピです。
詳細を見るコンテンツ追加ライブラリ不要
開閉できる補足セクション
必須ではない補足を見出し単位で開閉し、複数項目を開いたまま比較できるnative disclosureレシピです。
詳細を見るフォーム追加ライブラリ不要
ファイル選択フィールド
native inputで選んだファイルの名前、形式、容量を送信前に確認し、不正理由と解除方法を示すレシピです。
詳細を見る状態表示追加ライブラリ不要
状態を切り替えられる通知リスト
通常、0件、エラーの表示を切り替え、テーマや表示幅による見え方の違いを試せる通知リストです。
詳細を見るナビゲーション追加ライブラリ不要
モバイルドロワー
モバイル用に主要導線を抽出し、開閉・背景固定・戻る操作を確認できるドロワーメニューです。
詳細を見るオーバーレイ/アクション追加ライブラリ不要
オーバーフローアクションメニュー
項目数が増えた際に主動作を圧縮して表示する、アクションの省略メニューを確認するレシピです。
詳細を見るナビゲーション追加ライブラリ不要
ページ送り付き検索結果
件数が多い結果で、現在位置、前後移動、先頭・末尾、欠番を意味構造と操作で確認できるページ送りレシピです。
詳細を見るナビゲーション追加ライブラリ不要
進行ステッパー
手順進捗を段階的に示し、戻る/進むや完了到達を確認できるステップUIです。
詳細を見るデータ表示追加ライブラリ不要
レスポンシブ申請履歴表
表としての意味構造を保ち、長い日本語や大きい金額を含むデータを狭い画面では表コンテナ内だけ横スクロールして比較できるレシピです。
詳細を見るナビゲーション追加ライブラリ不要
ビュー分割切替
一覧、カード、コンパクトの3表現を切り替えるビュー切替の挙動を確認するレシピです。
詳細を見るナビゲーション追加ライブラリ不要
スキップリンク導線
キーボード操作時に主要コンテンツへ素早く移動できるスキップリンクの設計と状態を確認するレシピです。
詳細を見るナビゲーション追加ライブラリ不要
タブ切替コンテンツスイッチャー
複数視点の情報をタブで切り替え、キー操作と初期表示の一貫性を確認できるデザインです。
詳細を見るフォーム追加ライブラリ不要
入力検証付きお問い合わせフォーム
入力項目ごとの修正方法と送信時のエラー要約を示し、二重送信を防ぎ、送信失敗後も入力を保持するお問い合わせフォームです。
詳細を見るナビゲーション追加ライブラリ不要
縦セクションナビゲーション
左側ナビに見出し、右側本文を紐づけて、スクロール位置と選択状態を確認するレシピです。
詳細を見る