By fszbn
FatSecret iOS team workflow: feature development lifecycle, story analysis, test planning, Figma-driven implementation, code review, and build tools
Use when starting a new feature or when the user says "new feature", "start feature", "feature workflow" — orchestrates the full development lifecycle from story analysis through implementation to branch completion
Use when a Figma URL or design reference is provided, before writing implementation plans, to fetch and analyze the design via Figma MCP and produce a design brief
Use when implementing UI components that have a Figma design reference with known nodeIds, to ensure layout, sizing, spacing, and colors match the design exactly
Use after completing an implementation task — runs spec compliance, UI verification against Figma, and codex debate review in a single pass
Build and run the app. Default: booted simulator. Use `device` for physical device. Use `--delete` for clean install. Specify simulator name to target a specific simulator (e.g. `iPhone 16 Pro`).
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
Claude Code plugin for the FatSecret delivery team — orchestrates the full feature development lifecycle from story analysis to branch completion.
Add the marketplace:
claude plugins marketplace add https://github.com/fszbn/fatsecret-workflow.git
Install the plugin:
claude plugins install fatsecret-workflow
Verify it's working — start Claude Code and run /fatsecret-workflow:story-analysis to check the skill loads.
Update:
/plugin update fatsecret-workflow
Uninstall:
claude plugins uninstall fatsecret-workflow
claude plugins marketplace remove fszbn/fatsecret-workflow
This plugin depends on the superpowers plugin for core development skills (TDD, planning, debugging, etc.).
Install superpowers first:
/plugin install superpowers@claude-plugins-official
Or via custom marketplace:
/plugin marketplace add obra/superpowers-marketplace
/plugin install superpowers@superpowers-marketplace
See superpowers for other platform instructions (Cursor, Codex, Gemini CLI, etc.).
Some skills integrate with external tools via MCP. Skills gracefully degrade if their MCP server is not configured — you only need to install the ones you use.
| MCP Server | Used by | Purpose |
|---|---|---|
| Figma MCP | figma-design-brief, figma-driven-implementation, review-task | Design-to-code workflow |
| Codex MCP | review-task | AI code review debates |
| Shortcut MCP | story-analysis | Read stories from Shortcut |
| XcodeBuildMCP | run, review-task | Build, run, UI automation |
Figma MCP is an Anthropic built-in integration. Enable it in Claude Code:
claude mcp add figma -- npx -y figma-developer-mcp --figma-api-key=YOUR_FIGMA_TOKEN
Or get a token at https://www.figma.com/developers/api#access-tokens
claude mcp add shortcut -- npx -y @shortcut/mcp@latest
Set your API token:
export SHORTCUT_API_TOKEN=your_token_here
Or add to your project's .mcp.json:
{
"mcpServers": {
"shortcut": {
"command": "npx",
"args": ["-y", "@shortcut/mcp@latest"],
"env": {
"SHORTCUT_API_TOKEN": "your_token_here"
}
}
}
}
Install via Homebrew:
brew install xcodebuildmcp
Then add to Claude Code:
claude mcp add xcodebuildmcp -- xcodebuildmcp
Install globally:
npm install -g @openai/codex
Then add to Claude Code:
claude mcp add codex -- codex --mcp
Requires OPENAI_API_KEY environment variable.
| Skill | Description |
|---|---|
feature-workflow | Main orchestrator — guides the full feature development lifecycle |
| Skill | Description |
|---|---|
story-analysis | Analyze Shortcut stories + Figma designs into executable items |
write-test-plan | Generate test plans from stories/requirements |
figma-design-brief | Fetch and analyze Figma designs into a design brief |
| Skill | Description |
|---|---|
figma-driven-implementation | Pixel-accurate UI implementation from Figma nodeIds |
run | Build and run app — simulator (default) or device. Supports --delete for clean install. |
| Skill | Description |
|---|---|
review-task | Per-task review: spec compliance + UI verification + Codex debate |
The run skill defaults to the first booted simulator and auto-discovers connected devices. Override workspace/scheme/bundle ID in your project's .claude/skills/run/SKILL.md if they differ from the defaults.
The feature-workflow skill orchestrates these superpowers skills:
superpowers:brainstormingsuperpowers:writing-planssuperpowers:test-driven-developmentsuperpowers:verification-before-completionsuperpowers:finishing-a-development-branchIf any of these are unavailable, the workflow will prompt you to install superpowers.
npx claudepluginhub fatsecret-group/fatsecret-workflow --plugin fatsecret-workflowBrainstorm future features and improvements with wireframes and implementation detection
Specification-driven development workflow: specify → plan → tasks → implement
Spec-driven development for big features. When features get too big, plan mode gets too vague—leading to hallucinations during implementation. ShipSpec replaces vague plans with structured PRDs, technical designs, and ordered tasks that keep Claude grounded.
Design workflow for coding agents: discovery, research, strategy, inclusive design, critique, and handoff — enforced automatically
Design System compliance harness for Claude + Figma. Enforces library-first components, token binding, and automated QA — so AI-generated designs stay on-spec.
Plugin that includes the Figma MCP server and Skills for common workflows