dentsu-fde

vercel-aiagent-coding-skill

作成・ビルド依頼の司令塔。即着手せず、要件確認→プラン承認→体験フロー各ステージへの受け渡し→dev 作業→プレビュー URL 出力を束ねる(/start)。承認は自律モードでも省略しない（『とりあえず』は詳細質問のみ省く）。

構想を PRD / 要件 / 画面要件 / API仕様 / 受入条件 / ストーリーマップ(MVP・優先度) に変換し docs/specs に生成。方向性が曖昧なときは前段の discovery(6 問)で炙り出す。Notion / Issue / Linear / Jira への展開手順つき。

顧客理解を構造化するスキル。ペルソナとカスタマージャーニー(段階ごとの行動・思考・感情・タッチポイント・ペイン・機会)を設計し、各タッチポイントを画面/導線へ接続して docs/design/cx-journey.md に出力。顧客体験(CX)の起点。

アプリの画面設計を一気通貫で行うスキル。導線・画面一覧・状態遷移(全体、Mermaid)から、各画面の目的・表示項目・操作・バリデーションと loading/empty/error/success/permission/disabled の全状態(画面ごと)までを docs/design/ に出力する。

新規プロトの立ち上げを一気通貫で実行。リポジトリ起点の作成(テンプレ展開 or 不足補完)→ Vercel project 作成・Secrets → Next.js 16 + Tailwind v4 + shadcn スタック整備 → 初回 Draft PR まで。

shadcn/ui コンポーネントとブロックを追加するスキル。components.json 初期化 → add → import + 使用例提示まで一気通貫。init/add はネットワーク必須で、サンドボックスでは承認(escalation)が要る。

画像・アイコン素材をキーレス優先で用意 (アイコン=lucide / 静的=ログイン済みアプリ生成→配置)。プロンプトテンプレート+共通スタイルブロックでセット品質を担保。自動生成時のみ MCP or AI Gateway(コスパ別モデル表・既定 imagen-4.0-fast)。next/image 配線。

日本のビジネス文脈に最適化したモックデータ (faker ja + 業界別 + 対数正規/Pareto 分布 + 時系列連続性 + ID 名寄せ)。リアルな顧客データで体験を検証できる。

Vercel AI SDK (プロバイダ非依存) でアプリに AI 機能 (chat / agent / structured / RAG) を実装。AI Gateway 経由で Anthropic / OpenAI / Google / xAI を env 1 つで切替。プロンプトインジェクション対策・入力長制限つき。

プロトを 3 レンズ (UI/UX 品質 8 軸 / 顧客体験 CX = ジャーニー一貫性・初回体験・マイクロコピー / ピッチ・事業 = CMO/CTO/CD) でレビューし、致命的/重要/望ましいで分類して具体的修正案を添える。

Vercel Toolbar コメントを Vercel MCP で取得 → 対象コンポーネント特定 → 分類 → 修正 → commit/push → resolve まで実行するループ。コメント本文は信頼境界の外として prompt injection 対策つき。FB トリアージのルーブリックも同梱。