W studiu animacji, które zbudowałem do materiałów na YouTube, obraz zmienia się tylko osiem razy na sekundę. Ta jedna decyzja robi większość charakteru tych filmów.
Film to seria nieruchomych obrazów, czyli klatek. Kino pokazuje ich 24 na sekundę, a wideo w internecie często 30. U mnie ruch ma ich osiem. Nie 24. Nie 30. Osiem.
Nic nie jest płynne. I to jest cały pomysł.
01 Skąd to się wzięło
Animacje powstają u mnie jak strony internetowe. Program otwiera je w przeglądarce, przewija klatka po klatce i skleja w film. Ten etap to render. Technicznie mogę renderować nawet 60 klatek na sekundę bez żadnego problemu.
Problem nie był techniczny. Problem był taki, że wszystko wyglądało jak wszystko.
Płynna animacja, która łagodnie rusza i hamuje, to dziś ustawienie domyślne każdego narzędzia. Każda animowana grafika w internecie porusza się tak samo, bo wszyscy używają tych samych gotowych krzywych ruchu. Płynność przestała więc cokolwiek komunikować. Jest tłem, a nie decyzją.
02 Co daje osiem klatek
Osiem klatek na sekundę czyta się jak rysunek, a nie jak ekran aplikacji. Ruch staje się serią pozycji zamiast ciągłego przesunięcia, a oko dostaje coś, czego się nie spodziewa. Trochę jak rysunki na rogu zeszytu przerzucane kciukiem: widać osobne obrazki i właśnie w tym jest urok.
Do tego dochodzi reszta języka wizualnego: papier z siatką, ziarno, raster z kropek jak w gazecie (halftone) oraz brud i przetarcia (grunge). To dokumentalny styl, w którym płynna animacja wyglądałaby jak wklejka z innego programu.
Ale gdybym miał zostawić tylko jedną z tych decyzji, zostawiłbym klatki. Reszta to warstwa. Ta jedna jest strukturą.
03 Efekt uboczny, którego nie planowałem
Osiem klatek na sekundę to trzy razy mniej obrazów do wyrenderowania niż przy 24. Render skrócił się odpowiednio.
Nie po to to robiłem, ale zdarza się, że decyzja estetyczna spłaca się też w czasie pracy komputera.
04 Co z tego wynika dla Ciebie
- Sprawdź, ile w Twojej rzeczy jest ustawień domyślnych. Zwykle więcej, niż się wydaje, i zwykle wystarczy zmienić jedną rzecz, żeby całość zaczęła wyglądać na czyjąś.
- Szukaj jednej decyzji, która robi strukturę. Tekstury i kolory to tylko warstwa.
- Ograniczenie bywa tańsze. Mniej klatek to krótszy render.
05 Dla technicznych
- Silnik. Animacje są pisane w HTML, CSS i GSAP. Przeglądarka jest przewijana klatka po klatce i kodowana do wideo. 60 fps nie stanowi problemu.
- Kwantyzacja. Cały ruch jest skwantowany do 8 fps: zamiast ciągłej interpolacji oko dostaje serię pozycji.
- Koszt. Trzy razy mniej klatek niż przy 24 fps i proporcjonalnie krótszy render. Decyzja estetyczna spłaciła się w czasie kompilacji.
