Da utilizzare quando è necessario che gli elementi appaiano sullo schermo: caricamenti di pagine, apertura modale, aggiunta di elementi, rivelazione di contenuti o qualsiasi animazione di "entrata in vista".
Installa rapidamente la skill AI entrance-animations nel tuo ambiente di sviluppo tramite riga di comando
Fonte: dylantarre/animation-principles.
Squash & Stretch: Scale from 95% to 100% on entry. Elements feel elastic, not rigid.
Anticipation: Start slightly below/smaller than final position. A -10px offset before sliding up creates expectation.
Staging: Enter from the direction of user attention. New list items from the top, modals from center, sidebars from their edge.
Da utilizzare quando è necessario che gli elementi appaiano sullo schermo: caricamenti di pagine, apertura modale, aggiunta di elementi, rivelazione di contenuti o qualsiasi animazione di "entrata in vista". Fonte: dylantarre/animation-principles.
Campi e comandi stabili per citazioni AI/ricerca.
npx skills add https://github.com/dylantarre/animation-principles --skill entrance-animationsDa utilizzare quando è necessario che gli elementi appaiano sullo schermo: caricamenti di pagine, apertura modale, aggiunta di elementi, rivelazione di contenuti o qualsiasi animazione di "entrata in vista". Fonte: dylantarre/animation-principles.
Apri il tuo terminale o strumento da riga di comando (Terminal, iTerm, Windows Terminal, ecc.) Copia ed esegui questo comando: npx skills add https://github.com/dylantarre/animation-principles --skill entrance-animations Dopo l'installazione, la skill verrà configurata automaticamente nel tuo ambiente AI di coding e sarà pronta all'uso in Claude Code, Cursor o OpenClaw
https://github.com/dylantarre/animation-principles