Bazele de auto-creare de animație GIF, design web

Vă amintiți cum în școală, în lecții plictisitoare, au pictat fețe diferite în notebook-uri? Apoi, repetând paginile, îi forțau să se animeze. Deci, cu site-uri plictisitoare, sub șirul umplut cu informații plictisitoare, dar foarte necesare. Acum, dacă și acolo, adăugați câteva fețe de grimasă! Acest lucru este destul de fezabil dacă utilizați animația GIF:







Bazele de auto-creare de animație GIF, design web

Animate GIF

Formatul GIF (Graphics Interchange Format) a fost dezvoltat special pentru schimbul bitmap intranet. În trecutul recent, a fost formatul principal pentru imaginile plasate în spațiul web. Principalele caracteristici ale formatului GIF:

  • Abilitatea de a salva imagini în 256 de culori;
  • Greutatea redusă a imaginii - a fost ideală pentru etapa inițială a dezvoltării World Wide Web, când viteza de conectare la Internet a fost mult mai scăzută decât standardele actuale;
  • Formatele grafice din GIF sunt stocate pe linie, sprijinind doar o anumită paletă de culori (256 de culori);
  • În acest caz, una dintre cele 256 nuanțe poate fi marcată ca fiind transparentă;
  • Suport pentru obiecte animate.

Ultimul element din listă a servit drept un nou impuls pentru creșterea popularității acestui format grafic.

Bazele de auto-creare de animație GIF, design web

Animația Gif vă permite să creați un obiect grafic compus din mai multe imagini obișnuite (rame) aranjate într-o anumită ordine. Animația se produce datorită schimbării lor cu o anumită secvență și periodicitate. În acest caz, repetarea ciclică a cadrelor de animație este cea mai des utilizată.

Datorită mai multor imagini, restricțiile privind utilizarea a numai 256 nuanțe de culoare sunt complet eliminate. Acest lucru se datorează faptului că fiecare dintre desene poate conține paleta proprie. Reducerea greutății totale a obiectului animat este de asemenea realizată prin utilizarea transparenței, atunci când are loc doar o schimbare parțială în cadrul următor în raport cu cea anterioară.

În cadrul următor sunt desenate doar părțile în schimbare ale imaginii. Restul poate fi setat la transparent, iar pentru a le afișa utilizați cadrul static original.

Unii practică

Dar aceasta este o teorie, dar aș vrea să văd în practică modul în care animația este creată în format GIF. Am anticipat acest lucru și am pregătit o mică clasă de masterat pentru a crea un banner animat.

Să mergem:
  • Pe pagina de start a programului suntem rugați să alegem tipul de sarcină care trebuie rezolvată. Vom folosi "serviciile" vrăjitorului încorporat pentru a crea un banner. Pentru a face acest lucru, faceți clic pe elementul "Crearea unui banner animat":

Bazele de auto-creare de animație GIF, design web

  • În pasul următor, setăm dimensiunile viitorului banner. Puteți utiliza valori standard, dar vom introduce parametrii pentru lungimea și lățimea obiectului:

Bazele de auto-creare de animație GIF, design web






  • Apoi am creat fundalul bannerului. Ca stil de umplere, ați selectat un gradient, setați tipul și culorile primare:

Bazele de auto-creare de animație GIF, design web

  • În următoarea fereastră de experți, introduceți textul pe care doriți să-l afișați, setați dimensiunea, fontul și culoarea acestuia. Din lista derulantă, selectați efectul animației în momentul în care textul apare și dispare. Și, de asemenea, setați timpul pentru întreaga perioadă. Rețineți că, în acest fel, puteți seta efecte pentru mai multe fraze (până la trei). Ele sunt situate pe file separate ("Text 1", "Text 2"):

Bazele de auto-creare de animație GIF, design web

  • Înainte de a crea o animație GIF, rămâne doar să salvați fișierul banner în locul potrivit. După cum se sugerează în fereastra următoare:

Bazele de auto-creare de animație GIF, design web

  • După ce expertul este închis și bannerul este salvat, interfața de lucru a aplicației se deschide în fața noastră. Rețineți că în stânga, animația noastră este prezentată în mod incremental. Și fiecare dintre cadre poate fi editat separat:

Bazele de auto-creare de animație GIF, design web

Bazele de auto-creare de animație GIF, design web

Interfața aplicației este ușor de înțeles. Prin urmare, nu ne vom ocupa de descrierea detaliată a acesteia:

Bazele de auto-creare de animație GIF, design web

Bazele de auto-creare de animație GIF, design web

Pentru a facilita acest proces, puteți utiliza programul "Animation Wizard" încorporat. Este disponibil în program prin meniul "Fișier":

Bazele de auto-creare de animație GIF, design web

Acum, să arătăm ce sa întâmplat în cele din urmă. Sperăm că creația voastră nu va fi mai rău, dar chiar mai bună decât cea prezentată mai jos:

Bazele de auto-creare de animație GIF, design web

O caracteristică distinctivă a Easy GIF Animator este concentrarea sa pe domeniul dezvoltării web. Aplicația permite nu numai crearea de bannere animate, ci și generarea pentru ei a unui simplu cod hml pentru inserare. Această funcție este disponibilă prin elementul de meniu principal "Instrumente":

Bazele de auto-creare de animație GIF, design web

Sperăm că după o asemenea excursie am învățat toată puterea de a crea animații GIF.

Dacă nu, încercați să creați un banner răcoros sau un buton animat mic și plasați-l pe site-ul dvs. Va fi oferit feedback entuziast de la vizitatori!







Trimiteți-le prietenilor: