ContentAvançado

Premium Frontend Design Skill

porkv0906·kv0906· v1.0.0 · atualizado em 2026-04-10

Score

Create award-winning, cinematic frontend interfaces that feel ALIVE. Combines 10+ years of creative frontend experience with technical excellence. Specializes in WebGL, custom shaders, premium animations, and distinctive aesthetics that would win on Awwwards. Use when building landing pages, dashboards, platforms, or any interface where "generic AI slop" is unacceptable.

frontend-designui-uxwebglanimationcssjavascriptpremium-design

0Stars

0Forks

0Usos

Fork

Documento do Skill

SKILL.mdpremium-frontend-design/workflow

1. Define the purpose, tone, and key elements of the interface.

2. Choose appropriate animation and 3D libraries (CSS, Framer Motion, GSAP, Three.js).

3. Establish a color architecture, typography system, and spacing/layout guidelines.

4. Implement the design, focusing on subtle animations, responsive micro-interactions, and depth.

5. Ensure code quality, performance, and accessibility.

6. Test on different browsers and devices.

7. Gather user feedback and iterate on the design.

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

Depende deGSAP Animation Skill

100%

Similar aImplement Design

60%

Árvore do Skill

Premium Frontend Design Skill

premium-frontend-design

Fases Cognitivas6

1.SENSE

2.CONTEXTUALIZE

3.HYPOTHESIZE

4.ACT

5.EVALUATE

6.REFLECT

Triggers8

create a premium frontend interfacedesign an award-winning websitebuild a cinematic user interfacedevelop a frontend with WebGLcreate a landing page with distinctive aestheticsdesign a dashboard that feels aliveavoid generic AI slop in frontend designmake my website look amazing

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 premium-frontend-design

$ synaptic skills detail premium-frontend-design

$ synaptic skills live premium-frontend-design

Dependências

three @react-three/fiber @react-three/drei framer-motion gsap @gsap/react @paper-design/shaders-react lucide-react recharts @visx/shape @visx/scale

Links

GitHub Repository