Animoitu GIF: pieni, sulava ja brändisi näköinen

Hyvä animoitu GIF pysyy pienenä, koska se suunnitellaan muodon rajojen mukaan: maltillinen pikselikoko, 10-15 ruutua sekunnissa, animaatiosta muodostettu väripaletti ja mahdollisimman pieni muuttuva alue. GIF tallentaa enintään 256 väriä ruutua kohden ja pakkaa paljon videota tehottomammin. Sama silmukka voi siis olla kevyt MP4 ja raskas GIF. Käytä sitä harkiten siellä, missä muuta vaihtoehtoa ei ole, lähinnä sähköpostissa sekä joissakin keskustelu- ja dokumenttityökaluissa.

Mihin GIF pystyy ja mihin ei

Selaimet myös hidastavat erittäin lyhyitä ruutuviiveitä pyydetystä. Suuri kuvataajuus tuottaa siksi usein suuremman tiedoston, joka ei edes toistu nopeammin. Kuvataajuus selitettynä kertoo, miksi kuvataajuudella on merkitystä.

Näin pidät animoidun GIFin pienenä

Tiedostokoko määräytyy enimmäkseen ennen vientiä. Nämä keinot on järjestetty niiden tavallisen vaikutuksen mukaan.

1. 1

   Tee kuva todelliseen näyttökokoon

   Sähköpostin 600 px leveänä näytettävän otsakekuvan ei tarvitse olla GIFinä 1200 px leveä, jos tiedostokoko on tiheän näytön terävyyttä tärkeämpi. Leveyden puolittaminen vähentää pikselit noin neljäsosaan.

2. 2

   Lyhennä silmukkaa

   Siististi toistuva kahden tai kolmen sekunnin silmukka voittaa kymmenen sekunnin katkonaisen. Jokainen ruutu kasvattaa tiedostoa.

3. 3

   Laske kuvataajuutta

   10-15 fps riittää hitaasti liikkuville väreille ja tekstille. Hidas liike tarvitsee vähemmän ruutuja kuin nopea.

4. 4

   Liikuta pienempää osaa kuvasta

   GIF-kooderi voi tallentaa vain muuttuvat pikselit. Paikallaan pysyvä teksti hitaasti liikkuvan alueen päällä on paljon kevyempi kuin kokonaan liikkuva kuva.

5. 5

   Rajoita värejä

   Jos suunnitelma käyttää vain 64 väriä, 64 värin paletti on pienempi ja näyttää samalta.

Paletit, rasterointi ja raidoittuminen

Kun ruudussa on yli 256 väriä, kooderin on valittava. Se voi pyöristää jokaisen pikselin lähimpään palettiväriin, jolloin liukuväriin syntyy näkyviä raitoja. Tai se voi rasteroida eli ripotella vierekkäisiä värejä luodakseen vaikutelman välisävyistä. Rasterointi näyttää etäältä tasaisemmalta ja läheltä rakeiselta. Se myös kasvattaa tiedostoa, koska kuvio muuttuu ruudusta toiseen.

• Muodosta paletti animaatiosta. Omista ruuduista tehty paletti käyttää 256 paikkaansa todellisiin väreihisi yleisen värivalikoiman sijaan.
• Käytä animaatiossa järjestettyä rasterointia. Kiinteä kuvio, kuten Bayer, pysyy paikoillaan ruutujen välillä, joten se väreilee vähemmän ja pakkautuu paremmin kuin virheen diffuusio.
• Suosi vahvempia ja lyhyempiä liukuvärejä. Kahden läheisen värin liukuväri suurella alueella on hankalin. Suurempi kontrasti pienemmällä alueella raidoittuu vähemmän.
• Lisää rakeisuutta tarkoituksella. Pieni tekstuuri peittää sävyaskelia, mutta kasvattaa tiedostoa. Kokeile molempia.

Liukuvärin raidoittuminen käsittelee samaa ongelmaa still-kuvissa ja sen korjaamista lähteessä.

Toimivat vientiasetukset

Jos muutat videon GIFiksi, FFmpegin kaksivaiheinen palettimenetelmä tuottaa paljon paremmat värit kuin yksi käsittelykerta. Ensimmäinen komento muodostaa paletin leikkeestä, toinen käyttää sitä. Gifsicle voi pienentää tiedostoa vielä lisää.

# 1. Build a palette from the clip itself
ffmpeg -i loop.mp4 -vf "fps=12,scale=600:-1:flags=lanczos,palettegen=stats_mode=diff" palette.png

# 2. Use it, with ordered dithering that suits animation
ffmpeg -i loop.mp4 -i palette.png -lavfi "fps=12,scale=600:-1:flags=lanczos[x];[x][1:v]paletteuse=dither=bayer:bayer_scale=3:diff_mode=rectangle" loop.gif

# 3. Optional: optimise further (lossy trades a little quality for size)
gifsicle -O3 --lossy=40 loop.gif -o loop-small.gif

Pidä GIF brändisi näköisenä

Pieni paletti paljastaa erityisen hyvin, onko brändin värit valittu huolella. Läheiset sävyt sulautuvat, ja hienovaraisiin muutoksiin perustuva tausta voi hajota tasaisiksi portaiksi. GIFinä parhaiten toimivat brändit käyttävät selkeää pohjaväriä, yhtä tai kahta vahvaa korostusväriä sekä niin suurta tekstiä, että se kestää pienen paletin.

Gradientlyn Pro vie GIFejä MP4:n ja WebM:n rinnalla, joten voit suunnitella kerran ja lähettää GIFin sähköpostityökaluun ja videon someen. Liikkuva tausta on sinulle kuuluva Mark, joten vastaanottajan GIF näyttää brändiltäsi valmissilmukan sijaan. Sähköpostin varakuvista kertoo animoidut sähköpostin otsakekuvat.

Jos valitset tiedostomuotoa GIFin viimeistelyn sijaan, aloita artikkeleista GIF vai MP4 ja MP4 vai WebM.