Na stronach królowały animowane flashowe banery, które pozwalały pokazać więcej napisów i obrazków na małej powierzchni. To wstawki, które są już jednak passé.
Animacje internetowe a trendy w projektowaniu stron firmowych
Po tym, jak strony internetowe wyglądały jak choinki, weszły projekty intuicyjne, minimalistyczne i płaskie. Na takich witrynach bardzo ciekawie wybijają się teraz małe uatrakcyjnienia – animacje i mikrointerakcje. Dzięki nim użytkownik ma przyjemne doświadczenia.
Często animacje internetowe naśladują zachowania przedmiotów z realnego świata, więc dzięki nim strony są bardziej intuicyjne.
Kluczowe jest jednak to, żeby te smaczki ułatwiały interakcje ze stroną, a nie odciągały uwagę, irytowały czy uniemożliwiały wykonanie tego, co użytkownik chce właśnie zrobić.
Proste, a przydatne animacje na stronie internetowej
Jest kilka rodzajów animacji na stronę internetową, które są aktualnie tak oczywiste, że… prawie niezauważalne. Jednak ich brak sprawia, że poruszanie po stronie staje się niewygodne.
Mówię tu przede wszystkim o tzw. hoverach, czyli o zmianie wyglądu elementu na stronie po najechaniu na niego. Brak reakcji przycisku czy napisu klikalnego na najechanie jest w tej chwili dużym zaniedbaniem. Nie wystarcza już automatyczna zmiana kursora na „łapkę”, potrzebna jest też choćby najprostsza zmiana w samym elemencie, czyli:
Animowane napisy na stronę
- Zmiana koloru napisu po najechaniu
Takie najprostsze rozwiązania jak animowane napisy na stronę są zresztą chętnie używane przez największe serwisy jak choćby Facebook. Są wręcz niezauważalne, ale ułatwiają intuicyjne poruszanie się po serwisie.
Inne dobre animacje na stronie internetowej to takie, które naśladują interakcje w świecie realnym, jak choćby wszelkie animowane zabawy z kafelkami, sekcjami i zdjęciami
- Kafelki z usługami z opisem na odwrocie:
- Dynamiczne odliczanie w sekcji Firma w liczbach:
Hundreds of customers around the world trusted us:
- Dynamicznie reagujące zdjęcia w kafelkach bloga czy portfolio:
- Ciekawe animacje na stronie www z funkcją porównywania efektu przed i po w czasie rzeczywistym przy użyciu suwaka:
- Animacje na stonie internetowej: wjeżdżające zdjęcie:
need, simply call our 24 hour emergecny plumbing
- 661-481-8528
Animacje na stronie internetowej według konceptu
Są też i takie animacje na stronie www, które tworzą historie, wynikają z opowieści marki albo tworzą idee całej strony i zachęcają do jej poznawania. Poniżej kilka świetnych przykładów na animowane strony www przygotowane na WordPressie i Elementorze:
- Strona szwajcarskiej grupy organizującej wędrówki dla trzylatków drobnym elementem pięknie podkreśla swój charakter:
Żeby obejrzeć działanie strony na żywo przejdź na https://waldspielgruppe-duedingen.ch/
- Animacje na stronę internetową: Strona agencji zajmującej się designem z kresek i kropek tworzy piękną opowieść o swoich usługach:
Żeby obejrzeć działanie strony na żywo przejdź na https://fourpillars.studio/
- Niesamowita bajkowa opowieść o sięganiu głęboko przygotowana przez agencję brandingu i designu z Filipin. "Jeszcze raz" - krzyknęła moja dwuletnia córka kiedy dotarłyśmy na sam dół:
Obejrzyj na żywo tę piękną animację bezpośrednio na stronie: https://sunday.ph/
- Fragmentaryczne animacje na stronie www ze społecznego filmu o bezpieczeństwie na hulajnogach zostały wykorzystane jako ilustracje na samej stronie:
Strona oraz cały film do obejrzenia tutaj: https://escooters.utah.gov/
Animacje internetowe - podsumowanie
Animacje na stronę internetową dozowane z umiarem i z pomysłem będą służyć użytkownikowi, witrynie i firmie, która za nią stoi.
