跳到正文
cccskills
免费在 GitHub 公开

user-first-product-design

アプリ・Web 製品のユーザーファースト設計の正本。目的・タスク・認知負荷・エラー・Accessibility を先に固定してから UI/Figma/実装に進む(全PJ共通)。

中文简介正在准备中。当前显示原文说明。

ax-inc-dev/claude-cursor-orchestration星标 3(GitHub 3 + cccskills 0)
集成工具Figma

实测评分 未实测

查看安装方法

包含的文件(1)

  • SKILL.md3.9 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

User-First Product Design

When to Use

  • すべてのアプリケーション/プロダクト UI を触る前(Figma・コード・要件のいずれでも)
  • figma-mcp-design-orchestrator の Phase 0
  • 機能一覧だけ決まっていて 誰が何のために使うかが薄いときの再出発

フロントエンド実装との順序(全PJ)

顧客/ユーザーファーストで体験と画面の契約を先に決め、内部構造はその後。
コンポーネント設計・リポジトリのフォルダ構成・グローバル状態・API の振り分けを UI 設計より前に始めると、見た目・タスク・a11y が後付けになり品質が落ちやすい。

  • アプリ系: 本 SKILL → product-ui-ux-design(および /product-ui-ux-designer)で docs/ux-design/ 等を埋めてから実装。
  • マーケサイト系: site-build-orchestrator と /site-design-planner で docs/site/* を埋め、計画承認 後に /site-frontend-implementer。
  • トークンが DESIGN.md で固定されている場合: design-md-reference を併読。

グローバルルールの単一記述: ~/.cursor/rules/global-agent-workflow.mdc(「フロントエンド実装の順序」)、人間向け要約: ~/.cursor/CURSOR_GLOBAL_RULES.md。

原則(優先順)

  1. ユーザーの成果(Outcome) が先。機能や画面数は後。
  2. 主要タスク(理想は 1 セッション 1 主目的)を文章化してからワイヤーやフレームを作る。
  3. 圧倒的に使いやすいかは「学習コストが低いか・迷わないか・ミスから戻れるか・待たされないか」で測る。主観「かっこいい」だけにしない。
  4. アプリの目的(事業目的・成功指標)とユーザーの目的の 接点 を明示する。一致していなければ設計を疑う。
  5. Accessibility:色だけに頼らない情報、focus / キーボード、コントラスト、動き(prefers-reduced-motion)を後回しにしない。

設計前チェックリスト(出力前に自分で埋める)

問い答え
主ユーザーは誰か(1 手で書けるか)
その人が「今日ここで達成したいこと」は
失敗・離脱が一番コスト高いのはどの操作か
初見が 3 秒で理解すべきことは
絶対に誤操作させたくない操作と、その防止
オフライン・遅延・権限不足のときの振る舞い

成果物(リポに残すなら)

プロジェクトルートに docs/design/ を推奨(テンプレは ~/.cursor/templates/docs-design/)。

  • 誰の・何のための UI かを一文で
  • タスクフロー(箇条書きでよい)
  • 非対象(やらないこと/後回し)

よくあるアンチパターン

  • スクリーン一覧から入る(タスクが見えない)
  • 全ロールに同じ画面上詰め込み(意思決定者と実行者を混在)
  • エラーを「Something went wrong」で丸める
  • デザインシステムの見た目だけ真似して 情報の優先順位が崩れる

接続

参考(外部)

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

B2B サイトの戦略・情報設計。価値提案・メッセージマップ・ジャーニー導線・意思決定マップ・信頼棚卸・トーン/禁止表現まで一気通貫でテンプレ化する。実装前フェーズ専用(全PJ共通)。

中文简介正在准备中。当前显示原文说明。

ax-inc-dev/claude-cursor-orchestration32026年4月25日 更新

babysit

免费

Keep a PR merge-ready by triaging comments, resolving clear conflicts, and fixing CI in a loop.

中文简介正在准备中。当前显示原文说明。

ax-inc-dev/claude-cursor-orchestration32026年4月25日 更新

法人向けHTMLプレゼンスライドの実装エンジン。Claude Codeから指示書(アウトライン+テンプレート指定+カラー+コンテンツ)を受け取り、単一HTMLファイルとして実装する。43種テンプレート+14種アニメーション。トリガー:プレゼン実装、スライドHTML生成、提案資料コーディング。

中文简介正在准备中。当前显示原文说明。

ax-inc-dev/claude-cursor-orchestration32026年4月25日 更新

You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.

中文简介正在准备中。当前显示原文说明。

ax-inc-dev/claude-cursor-orchestration32026年4月25日 更新

canvas

免费

A Cursor Canvas is a live React app that the user can open beside the chat. You MUST use a canvas when the agent produces a standalone analytical artifact — quantitative analyses, billing investigations, security audits, architecture reviews, data-heavy content, timelines, charts, tables, interactive explorations, repeatable tools, or any response that benefits from visual layout. Especially prefer a canvas when presenting results from MCP tools (Datadog, Databricks, Linear, Sentry, Slack, etc.) where the data is the deliverable — render it in a rich canvas rather than dumping it into a markdown table or code block. If you catch yourself about to write a markdown table, stop and use a canvas instead. You MUST also read this skill whenever you create, edit, or debug any .canvas.tsx file.

中文简介正在准备中。当前显示原文说明。

ax-inc-dev/claude-cursor-orchestration32026年4月25日 更新

Authors Cursor Rules (.cursor/rules/*.mdc) and custom Subagents (.cursor/agents/*.md or ~/.cursor/agents). Use when creating or refactoring rules/subagents, splitting large rules, choosing subagent vs skill, setting model/readonly/background, or replacing repeated delegation prompts.

中文简介正在准备中。当前显示原文说明。

ax-inc-dev/claude-cursor-orchestration32026年4月25日 更新

查看 ax-inc-dev 的全部技能

报告此技能的问题