Creați animații cool CSS cu ușurință cu Animista

Sunt de tone de aplicații web de animație CSS online. Dar, foarte putine compara cu nivelul de detaliu si usurinta de utilizare cu care obtii Animista.

Această aplicație web gratuită vă permite generați animații personalizate CSS la apăsarea unui buton. Alegeți dintre mișcările pre-proiectate, cum ar fi diapozitive, transformări, leagăne și chiar și animații de umbră.

După ce ați creat animația, puteți exportați codul la fel ca și cu alți generatori de CSS. Cu excepția acestui cod este mult mai ușor de colaborat și chiar vine cu un instrument de miniatură încorporat.

Interfața se poate simți confuză la început, dar asta este doar din cauza numărului de opțiuni pe care le aveți!

Creați animații personalizate urmând trei pași principali și folosind interfața de sus până jos:

1. Alegeți un stil de mișcare (leagăn, diapozitiv, flip) din cercurile din partea de sus
2. Personalizați-l cu diferite tipuri de mișcare dedesubt
3. Editați opțiunile de animație în bara de opțiuni din stânga plutitoare

Prin acest proces, puteți schimba durata totală a animației, stilul de relaxare, întârzierea, aproape totul. Și totul lucrează prin CSS3 pură, ceea ce face și mai impresionant.

De asemenea, rețineți că în partea superioară a navbarului puteți alege între diferite tipuri de stiluri de țintă animație.

implicit este “de bază” care poate lucra pe ceva aproape orice (hover, click sau animație imediată). Alte obiective includ textul paginii, animațiile de fundal și chiar animațiile de intrare personalizate pentru a afișa un element de pagină ascuns.

Îmi place mai ales “Atenţie” link-ul din partea de sus, care are unele efecte tremurati si jitter pentru stiluri de butoane. Acestea funcționează excelent pe butoanele CTA pentru a atrage atenția și a încuraja interacțiunile utilizatorilor.

Odată ce ați terminat de făcut ajustări, pur și simplu faceți clic pe pictograma consolei mici în colțul din dreapta sus al panoului de examinare.

Aceasta aduce în revistă o nouă pagină clasa completă de animație CSS, împreună cu cadrele cheie. Funcțiile opționale vă permit minify codul și include prefixul auto care acceptă browsere web mai vechi.

Am folosit tone de instrumente personalizate de animație CSS și, fără îndoială, Animista este instrumentul cel mai bogat în caracteristici acolo. Este complet gratuit și un pic cam complex, dar odată ce înțelegeți interfața, este de departe cel mai bun generator pe care îl puteți utiliza.

Pentru a încerca, trebuie doar să vizitați pagina de pornire și să dați clic pe “Încearcă-mă”. De asemenea, puteți să vă împărtășiți gândurile și complimentele cu creatorul aplicației web @ ana108.