Frontend e UI

animation-vocabulary

Trasforma una descrizione vaga di movimento nel suo termine tecnico esatto.

Che cos’è

Un glossario a ricerca inversa. Descrivi a grandi linee un effetto di movimento e la skill restituisce il termine preciso, citato alla lettera, con alternative vicine quando più d’una calza.

Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding). Use when t
Dal SKILL.md originale

Perché conta per il design

  • Dà al designer la parola giusta con cui istruire un agente.
  • Disambigua coppie vicine come clip-path contro mask, pop in contro bounce.
  • Si rifiuta di inventare termini, così la nomenclatura resta affidabile.

Cosa copre

  • Entrances and exits
  • Sequencing and timing
  • Transitions between states
  • Scroll
  • Spring animations
  • Polish and effects

Come installarlo

animation-vocabulary

  1. Clona il repository.

    git clone https://github.com/emilkowalski/skills
  2. Punta Codex sul file della skill.

    skills/animation-vocabulary/SKILL.md
  3. Poi descrivi la UI che vuoi. Codex segue la skill.

Come usarlo con Codex

  1. Descrivi ciò che hai visto, tipo «lo scroll rubber-band di iOS».

  2. Restituisce il termine in grassetto più una definizione di glossario in una riga.

  3. Chiedi le alternative quando due termini potrebbero calzare entrambi.

Ogni plugin qui è gratuito, open source e rimanda alla sua vera fonte upstream.

Altro sulla lista codex-design ↗

Prossimo passo

Progetta con Open Design, senza il setup

Installa questo plugin da solo, oppure porta attorno a Codex un intero strato di design curato con Open Design. Usa la tua chiave, resta padrone dell’output.