Animacja była kiedyś uważana jedynie za dekorację. Jednak w miarę postępu technologii i przyspieszania połączeń internetowych projektanci zaczynają dostrzegać praktyczne korzyści. W tym artykule skupimy się na jednej szczególnej korzyści płynącej z animacji – animacji marketingowej animacje, które sprzedają. Mimo że taka animacja nie ma na celu poprawy użyteczności, może zrobić wrażenie na użytkowniku i nadać mu kontekst dla tematu. Projektanci mogą wykorzystywać ten typ animacji na następujące sposoby:
1. Wykazać się kunsztem
Ludzie zauważają szczegóły. Dbałość o animację może sprawić, że doświadczenie będzie sprawiało wrażenie stworzonego. Kiedy aplikacje/witryny tworzą stymulujące wizualnie wrażenia, zapewniają użytkownikowi poziom ekscytacji.
Załaduj animację ekranu
Animacja ładowania to jedno z najstarszych zastosowań animacji, które ma odwracać uwagę użytkownika od czasu ładowania. Ale nawet tego typu animacja może pokazać, że Twój produkt jest świetny. Na przykład, gdy użytkownik uruchamia aplikację Uber, natychmiast zauważa animowaną kroplę, która zamienia się w pinezkę na mapie. Ta animacja nie jest po prostu zachwycająca, wpływa także na wzrok użytkownika i kontroluje, na czym powinien się skupić. Ten moment szybkiego otwarcia robi dobre pierwsze wrażenie i zachęca użytkownika do dalszej interakcji.
Animacja podpisu
Niektóre firmy idą jeszcze dalej i wykorzystują animację jako wyróżnik marki. MailChimp jest jedną z firm, która wykorzystuje animację w ten sposób. Firma spełnia dość techniczną niszę, tworząc i wysyłając kampanie e-mailowe, ale dzięki animacji przekształca to suche zadanie w zachęcające doświadczenie. Usługa dodaje drobne i miłe niespodzianki podczas całej podróży użytkownika i sprawia, że wysyłanie e-maili staje się o wiele przyjemniejsze.
2. Lepiej przekazuj kluczowe przesłanie
Animowane efekty pomagają wyraźniej przekazać wiadomość. Za pomocą animacji możesz wykorzystać złożone pomysły lub procesy i uczynić je łatwo przyswajalnymi w zabawny i graficzny sposób.
Interaktywna animacja
Animacja jest w stanie podkreślić mocne strony produktu. Bellroy to firma zajmująca się sprzedażą portfeli. Mówią, że starają się stworzyć smukłą konstrukcję, aby zmniejszyć objętość kieszeni. Na poniższym przykładzie widać, jak animacja zastosowana w Bellroy w czytelny sposób wskazuje na zachowanie produktu i ukazuje jego zalety.
Animacja zawisu
Animacje po najechaniu myszką są bardzo praktyczne, jeśli chodzi o dostarczanie dodatkowych informacji o Twoich produktach. Ten rodzaj animacji sprawia, że odkrycie jest mniej irytujące i daje możliwość dodania uroczego charakteru do Twojej witryny.
Animacja opowiadania
Potencjał animacji w zakresie opowiadania historii może dodać emocjonalnego połączenia do skądinąd nudnego interfejsu. Typowymi przykładami opowiadania historii są strony, które prezentują nowy produkt poprzez „składanie” go na Twoich oczach. Na przykład strona poświęcona komputerowi Mac Pro w witrynie Apple pokazuje dokładnie, co kryje się pod maską podczas przewijania w dół: animacje opowiadające historie mogą również tchnąć życie i zabawę w długi przewijany ekran. Zamiast animacji paralaksy, które są bardzo powszechne, wybierz coś subtelniejszego. Rozważ podzielenie witryny na przewijalne „fragmenty”. W obrębie każdego fragmentu możesz przedstawić treść za pomocą animacji. Animacje w poniższym przykładzie ze strony internetowej Le Mugs sprawiają, że treść „ożywa” poprzez animację prostych ilustracji artystycznych.
3. Zaangażuj użytkowników do podjęcia dalszych kroków
Zastosowanie animacji wpłynie na wzrok użytkowników i może kontrolować, na czym skupią swoją uwagę na Twojej stronie. Ludzkie oko jest naturalnie przyciąga ruch co sprawia, że animacja jest idealnym narzędziem do kontrolowania hierarchii wizualnej.
Bezpośrednia uwaga użytkownika
Ruchome elementy są potężnym narzędziem przyciągającym uwagę użytkowników. Jeśli celem jest zwrócenie uwagi użytkownika na jeden z kilku elementów lub powiadomienie go o aktualnych informacjach, animacja załatwi sprawę. Dopóki na ekranie nie ma zbyt wielu konkurujących ze sobą elementów, nawet najmniejszy ruch przyciągnie uwagę. Witryna Space Needle w Seattle wykorzystuje tę subtelność. Strona zwraca uwagę na instrukcje drobną, ale skuteczną animacją w postaci strzałek w górę.
Zachęcaj użytkownika do działania
Dobra animacja i efekty interaktywne zachęcają użytkowników do kliknięcia. Poniżej przyjrzyj się projektowi witryny „Czechow żyje”. Projekt aż prosi się o kliknięcie, aby znaleźć swoją postać.
Rzeczy do rozważenia
Animacja to miecz obosieczny. Nieprawidłowo użyte może zrujnować doświadczenie użytkownika. Unikaj animacji, które odwracają uwagę użytkownika od zadania. W świecie sprzedaży i marketingu online odwrócenie uwagi może zakończyć się śmiercią. Bardzo ważnym aspektem, który należy wziąć pod uwagę podczas projektowania animacji, jest częstotliwość, z jaką prawdopodobnie będzie ona występować w ramach sesji pojedynczego użytkownika. Animacja może być ładna, gdy użytkownik zobaczy ją po raz pierwszy, ale po setnej próbie może stać się denerwująca, zwłaszcza gdy nie ma innego celu niż „zabawa”. Istnieje wiele elementów interfejsu użytkownika, które można animować zarówno w sposób zabawny, jak i praktyczny. Ale pamiętaj o jednej rzeczy, jeśli chcesz stworzyć animację marketingową, powinieneś postawić sobie za cel stworzenie animacji, która ma jedno i drugie styl I zamiar.
