anthropics/skills180kfrontend-design
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
前端开发
Create frontend work plan from design document and obtain plan approval
把这段话发给 Claude Code、Codex 或 Cursor。智能体会先检查安全性,你确认后才安装。
读取 https://funcoding.ai/skills/shinpr/claude-code-workflows/recipe-front-plan/install.md ,按里面的步骤帮我安装这个 Skill。
Explicit User Instruction: The user explicitly instructs and authorizes every subagent call named in this recipe. Execute each applicable call when its prerequisites are met.
Execute Skill: llm-friendly-context before writing Agent prompts, handoffs, or generated artifacts. Execute Skill: subagents-orchestration-guide before making workflow decisions, invoking agents, or resolving findings.
Context: Dedicated to the frontend planning phase.
Core Identity: "I am an orchestrator." (see subagents-orchestration-guide skill)
Local authority gate: Make this recipe's workflow decisions and validate each returned result directly; delegate semantic deliverable production to the named specialist.
Review Resolution Gate [MANDATORY]: Resolve every actionable deliverable-review finding through subagents-orchestration-guide Review Resolution before correction or progression.
Before the first finding disposition, read references/review-resolution.md from the loaded subagents-orchestration-guide skill.
Execution Protocol:
At each Agent invocation below, build the prompt as a mechanical extraction: copy the named source values into the exact fields, apply only the declared serialization, then invoke immediately.
Acceptance-test-generator is part of this planning flow and may return no selected lanes when the Design Doc has no justified integration/E2E proof boundary.
Included in this skill:
Responsibility Boundary: This skill completes when the user authorizes implementation of the reviewed plan.
Follow the planning process below:
$ARGUMENTS when presentdocs/design/ when exactly one existsReferenced UI Spec pathsubagent_type: "dev-workflows-frontend:acceptance-test-generator"description: "Test skeleton generation"design_docs: [Design Doc path]ui_spec: [UI Spec path] when one existsconfirmed_requirement_context: approved PRD path named by the Design Doc, or its unchanged Requirement Convergence record when no PRD existsvalue_input_required and its unknown-value continuationInvoke work-planner using Agent tool:
subagent_type: "dev-workflows-frontend:work-planner"description: "Work plan creation"mode: createdesignDoc: [selected Design Doc path]uiSpec: [UI Spec path] when one existsprd: [approved PRD path] when one existstestSkeletons: [non-null generatedFiles paths]Invoke document-reviewer to review the work plan:
subagent_type: "dev-workflows-frontend:document-reviewer"description: "Work plan review"prompt: "doc_type: WorkPlan target: docs/plans/[plan-name].md. Review the Work Plan's own Implementation Scope, tasks, Completion Criteria, dependencies, execution order, exact source-anchor existence, executable verification, and Review Scope. Governing Documents paths are citation sources only; keep issues limited to violations of cited obligations."Recommended: End with the following standard response after plan content approval
Frontend planning phase completed.
- Work plan: docs/plans/[plan-name].md
- Implementation authorization: granted for this task set
Please provide separate instructions for implementation.
When findings were declined during Work Plan review, append their IDs, governing reasons, and evidence to this completion response.
anthropics/skills180kGuidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
前端开发
anthropics/skills180kSuite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
前端开发
addyosmani/agent-skills103kGuides stable API and interface design. Use when designing APIs, module boundaries, or any public interface. Use when creating REST or GraphQL endpoints, defining type contracts between modules, or establishing boundaries between frontend and backend.
前端开发
addyosmani/agent-skills103kBuilds production-quality, accessible, responsive user-facing UIs. Use when building or modifying interfaces and pages, creating components, implementing layouts, meeting WCAG accessibility requirements, managing state, or when the output needs to look and feel production-quality rather than AI-generated.
前端开发
addyosmani/agent-skills103kOptimizes application performance across frontend, backend, queries, and databases. Use when performance requirements exist, when you suspect performance regressions, when Core Web Vitals or load times need improvement, when N+1 query patterns need fixing, or when profiling reveals bottlenecks.
前端开发
nexu-io/open-design100kOpenDesign's feature business case for the plugin marketplace: the user pain, options, tradeoffs, and the measure of success. Built as a decision-grade product management deck for PM, eng, design, leadership.
前端开发