ContentAvançado

Frontend Design Review

pordauquangthanh·dauquangthanh· v1.0.0 · atualizado em 2026-04-11

Score

Conducts comprehensive frontend design reviews covering UI/UX design quality, design system validation, accessibility compliance, responsive design patterns, component library architecture, and visual design consistency. Evaluates design specifications, Figma/Sketch files, design tokens, interaction patterns, and user experience flows. Identifies usability issues, accessibility violations, design system deviations, and provides actionable recommendations for improvement.

frontend-designui-uxdesign-reviewaccessibilitydesign-systemresponsive-designcomponent-library

Linguagens

TypeScriptJavaScriptHTMLCSS

0Stars

0Forks

0Usos

Fork

Documento do Skill

SKILL.mdfrontend-design-review/workflow

Gather Design Assets: — Collect Figma/Sketch files, design specifications, and design system documentation.

Understand Context: — Review project requirements, target users, and key user journeys.

Conduct Visual Design Review: — Assess typography, color, spacing, layout, and visual hierarchy.

Perform Accessibility Audit: — Test color contrast, keyboard navigation, and ARIA labels.

Evaluate Responsive Design: — Check content adaptation across different viewports and devices.

Document Findings: — Categorize issues by severity and create a detailed findings report.

Prioritize Fixes: — Separate must-fix from nice-to-have and consider implementation effort.

Follow Up: — Schedule a re-review to verify fixes and track issues to completion.

Telemetria de Agentes

Execuções

total

Taxa de Sucesso

últimos 30d

Latência Média

0.0s

p50

Alucinação

0.0%

detecção

Tokens Entrada

avg 0/exec

Tokens Saída

avg 0/exec

Uso por Plataforma

Skills Relacionados

Similar aFramer Code Development

60%

Similar aUI Design Brain

60%

Similar aSync Figma Token

60%

Árvore do Skill

Frontend Design Review

frontend-design-review

Fases Cognitivas4

1.SENSE

2.EVALUATE

3.RECOMMEND

4.REFLECT

Triggers10

conduct a frontend design reviewreview the UI/UX designvalidate the design systemperform an accessibility auditevaluate the component libraryassess the responsive designreview Figma filescheck design consistencyensure accessibility complianceevaluate user experience flows

Avaliar este Skill

Score Breakdown

⭐Avaliação Humana0%

🤖Sucesso de Agentes0%

🕐Atualidade100%

🔗Saúde de Dependências100%

🕸️Centralidade no Grafo0%

🛡️Segurança50%

CompositeScore = α·Humano + β·Agente + γ·Recência + δ·Deps + ε·Centralidade + ζ·Segurança

Instalação

$ synaptic mcp download frontend-design-review

$ synaptic skills detail frontend-design-review

$ synaptic skills live frontend-design-review

Links

GitHub Repository