Frontend e UI
emil-design-eng
Le regole di Emil Kowalski per timing delle animazioni, easing e rifinitura dei componenti.
Che cos’è
Codifica una filosofia di design engineering: un framework decisionale per le animazioni, indicazioni sulle molle, principi sui componenti, tecniche di clip-path, gestione dei gesti, regole di performance e una checklist di revisione.
This skill encodes Emil Kowalski's philosophy on UI polish, component design, animation decisions, and the invisible details that make software feel great.
Perché conta per il design
- Le azioni frequenti perdono del tutto l’animazione, così le command palette restano istantanee.
- Gli ingressi partono da scale(0.95), mai scale(0), così niente compare dal nulla.
- I popover scalano dal loro trigger invece che dal centro, mantenendo il legame spaziale.
Cosa copre
- The animation decision framework
- Spring animations
- Component building principles
- clip-path for animation
- Performance rules
- Review checklist
Come installarlo
emil-design-eng
-
Clona il repository.
git clone https://github.com/emilkowalski/skills -
Punta Codex sul file della skill.
skills/emil-design-eng/SKILL.md -
Poi descrivi la UI che vuoi. Codex segue la skill.
Come usarlo con Codex
-
Chiedi a Codex di rivedere il codice UI: restituisce una tabella Prima, Dopo, Perché.
-
Per un nuovo movimento risponde se va animato, perché, con quale easing e quanto veloce.
-
Applica la checklist, segnalando transition: all e durate oltre i 300ms.
Ogni plugin qui è gratuito, open source e rimanda alla sua vera fonte upstream.
Altro sulla lista codex-design ↗Altri plugin di design per Codex
Frontend e UI Cosa fa gpt-taste Costruisce landing page da premio con motion GSAP legato allo scroll e griglie bento senza vuoti. 
Design system Cosa fa Stitch Design Taste Scrive un DESIGN.md che guida Google Stitch verso schermate non generiche. 
Frontend e UI Cosa fa image-to-code Genera prima immagini di design, le analizza, poi costruisce il codice frontend corrispondente. 
Frontend e UI Cosa fa imagegen-frontend-mobile Genera flussi di schermate per app mobile di livello premium come immagini, non come codice. 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.