Agent skill
frontend-specialists
Deliver resilient frontend solutions with performance, accessibility, and UX guardrails.
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/design/frontend-specialists-dnyoussef-context-cascade
SKILL.md
STANDARD OPERATING PROCEDURE
Purpose
Plan and implement frontend features and architectures with strong accessibility, performance, and reliability practices.
Triggers
- Positive: Frontend feature work, performance tuning, accessibility audits, design-to-dev translation, state management decisions.
- Negative: Pure backend/system design (route elsewhere) or prompt rewrites (prompt-architect).
Guardrails
- Structure-first: maintain
SKILL.md,examples/,tests/,resources/, andreact-specialistdocs; fill gaps before work. - Constraint clarity: HARD/SOFT/INFERRED (framework, bundle budget, perf targets, accessibility requirements, release cadence).
- Quality gates: lint/format, type-check, tests (unit/e2e), accessibility/perf checks.
- Confidence ceiling enforced (inference/report 0.70; research 0.85; observation/definition 0.95).
Execution Phases
- Intake: Capture framework (React/Next/etc.), design assets, perf/a11y targets, and release constraints.
- Design: Choose state management, routing, data-fetching strategy; define component contracts and error handling.
- Implementation: Build components with accessibility defaults, performance safeguards (code-splitting, memoization), and logging.
- Validation: Run lint/format/type/test; measure Core Web Vitals and a11y checks; run regression snapshots where applicable.
- Delivery: Provide changelog, release plan, monitoring hooks, and rollback steps.
Output Format
- Request summary + constraints.
- Architecture/component plan and rationale.
- Validation results and risks.
- Confidence with ceiling.
Validation Checklist
- Constraints confirmed and design assets referenced.
- Perf/a11y targets defined and measured.
- Lint/format/type/test run.
- Confidence ceiling stated.
VCL COMPLIANCE APPENDIX (Internal)
[[HON:teineigo]] [[MOR:root:F-R-N]] [[COM:Frontend+Usta]] [[CLS:ge_skill]] [[EVD:-DI]] [[ASP:nesov.]] [[SPC:path:/skills/specialists/frontend-specialists]]
[[HON:teineigo]] [[MOR:root:E-P-S]] [[COM:Epistemik+Tavan]] [[CLS:ge_rule]] [[EVD:-DI]] [[ASP:nesov.]] [[SPC:coord:EVD-CONF]]
Confidence: 0.71 (ceiling: inference 0.70) - SOP refreshed with prompt-architect constraint handling and skill-forge structure-first rules.
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?