Stylie - Besplatni CSS Web Animation Builder
Ako se borite sa sintaksom CSS3 i želite a jednostavan način za stvaranje animacija Stylie je odličan alat za spremanje.
Ovo je jedan od mnogih besplatnih generatori koda s fokusom na čiste CSS animirane efekte. Stylie je potpuno besplatan i otvoren, hostiran na GitHubu i pokreće ga ključna knjižnica pod nazivom Rekapi.
Knjižnica Rekapi koristi JavaScript, tako da je to alternativa čistom CSS-u. I na sreću, web-aplikacija Stylie podržava obje metode, tako da možete izvozni kod u čistom CSS-u ili JavaScriptu.
Prema zadanim postavkama prva stranica učitava kontinuirani demo animacije s linearnom animacijom. Možete igrati s tim uređivanjem zadane postavke u Kartica Motion ili uređivanjem Kartica ključnih ključeva.
Na popisu ključnih kadrova možete dodajte nove okvire ključnih riječi, uredite njihovo ukupno trajanje, i promijenite stilove animacije, uključujući kretanje na temelju osi X / Y.
Prvo, ovo će izgledati vrlo zbunjujuće, pogotovo ako nikada prije niste radili animaciju s ključnim kadrom. Međutim, što se više igrate s ovom aplikacijom, to više ima smisla.
Prema zadanim postavkama imat ćete tonu različite opcije ublažavanja da se zabrljate i sve su super lako prilagoditi.
Grafikon kretanja je puno teže učiti, ali vam daje daleko veću kontrolu nad olakšavanjem animacije. Stylie vam čak dopušta spremite prilagođene efekte pokreta i ponovno ih upotrijebite na kartici Ključni kadrovi za ostale animacije.
Ako bih se mogao žaliti na jednu stvar, to je web-aplikacija nedostatak odgovarajućeg dizajna.
Nisam mogao dobiti cijelu aplikaciju da se uklopi na moj 13-inčni MacBook Pro ekran čak i kada je preglednik u potpunosti povećan. To može biti problem jer stranica nema vertikalnu kliznu traku i mnoge od opcija (poput izvezenog koda) su pronađene u oknu postavki.
No, osim ove manje smetnje, dobro je funkcionirao na mom većem monitoru. I, izvozna kvaliteta je kao ništa drugo što ćete naći na webu.
Zavirite u aplikaciju Stylie kako biste vidjeli kako radi i pokušajte se petljati s nekim od opcija. Kada napravite animaciju, možete izvoziti CSS ili JavaScript i koristite ga za bilo koji projekt koji želite.
Ako imate problema s učenjem sučelja, možete pogledati i ovaj kratki vodič u trajanju od oko 9 minuta i pokriti sve glavne značajke.
