| 項番 | 詳細 | 名称 | 詳細 | 担当者 |
|---|---|---|---|---|
| 1 | アイテム検索キーワード入力 | 役割 ユーザーが任意の文字列を入力し、検索対象を特定するためのフィールド。初期状態 プレースホルダー「… | ||
| 2 | カテゴリ選択 | アイコン右端に下向きの矢印(Chevron Down)を配置。余白テキストが枠線に近すぎないよう、左右に十分な p… | ||
| 3 | 検索ボタン | 役割 検索アクションを確定・実行するトリガー。ラベル 「検索」。動作 クリックまたはフォームの submit… | ||
| 4 | マイページ | 役割uユーザー固有のデータ(購入履歴、お気に入り、設定)へアクセスするためのメインゲートウェイ。配置… | ||
| 5 | アイテム検索キーワード入力 | HTML要素 <input type="search"> または <input type="text">。属性 * placeholder: "アイ… | ||
| 6 | アイテム検索キーワード入力 | スタイル角丸(Border-radius: 4px〜8px程度)、ボーダーは薄いグレー。フォーカス状態outline ではなく、… | ||
| 7 | マイページ | システム連携とデータ整合性 認証チェック クリック時にセッショントークンの有効性を確認。無効な場合は… | ||
| 8 | マイページ | 心理的ハードルを下げるUI設計 視認性の確保: 画像にあるようなシンプルで清潔感のある枠線(Border-radiu… | ||
| 9 | カテゴリ選択 | HTML要素 <select> またはカスタムUIのドロップダウン。データ構造 Array<{label: string, valu… | ||
| 10 | カテゴリ選択 | test | ||
| 11 | 検索ボタン | HTML要素 <button type="submit">。状態管理 APIリクエスト中は disabled 状態にし、二重送信を防止… | ||
| 12 | 検索ボタン | カラーアクセントカラー(青色)を使用。背景色とのコントラスト比(WCAG 2.1)を確認。フィードバックHove… | ||
| 13 | 統計情報カード | 役割サービスの現状や実績(総アイテム数、おすすめ数、キュレーター数、平均評価)をひと目で把握するため… | ||
| 14 | 統計情報カード | 共通クラスカード全体は共通の StatCard コンポーネントとして定義し、Props で「アイコン、ラベル、数値、… | ||
| 15 | 統計情報カード | 視覚的ルールカラーシステム: * 各カードの役割に合わせてアイコン背景とアイコンの色をペア(トーン・オン… | ||
| 16 | 商品詳細カセット2 | 役割商品の主要情報(画像、カテゴリ、名称、評価、価格)をコンパクトにまとめ、詳細ページへの入り口とす… | ||
| 17 | 商品詳細カセット | 構造 article または div カード全体をリンクにするか、ボタンのみをインタラクティブにするか検討。データ… | ||
| 18 | 商品詳細カセット | 役割商品の主要情報(画像、カテゴリ、名称、評価、価格)をコンパクトにまとめ、詳細ページへの入り口とす… | ||
| 19 | 商品のジャンル | 商品のジャンル商品のジャンル商品のジャンル商品のジャンル商品のジャンル商品のジャンル商品のジャンル商… | ||
| 20 | 商品のジャンル | |||
| 21 | 商品のジャンル | 商品のジャンル商品のジャンル商品のジャンル商品のジャンル商品のジャンル商品のジャンル商品のジャンル商… | ||
| 22 | ページネーション | 状態管理currentPage: 現在表示中のページ。totalPages: 全データ数から算出される総ページ数。ロジック1ペ… | ||
| 23 | ページネーション | アクティブ状態 現在のページ番号(例: 「1」)を背景色付き(青色)でハイライトし、テキストを白抜きにす… | ||
| 24 | ページネーション | 役割大量のコンテンツを分割して表示し、ユーザーが現在の位置を確認・移動できるようにする。構成要素「前… |
- 50%
- 100%
- 150%
- 200%
アイテム検索キーワード入力
カテゴリ選択
検索ボタン
統計情報カード
商品詳細カセット2
ページネーション
マイページ
商品のジャンル
コントロールパネルを表示/非表示
ページの情報を表示
アイテムの大きさを変更する
ドキュメントの詳細
変更履歴
読み込み中...
履歴はありません
グラフィカルドキュメントの削除
このグラフィカルドキュメントに関連する画像とデータがすべて消えます。
本当に削除しますか?
変更履歴
読み込み中...
履歴はありません
過去のバージョン