Interaktywne opowiadanie historii i jego zastosowanie w branży projektowania stron internetowych

Posiadanie elementu graficznego to obecnie konieczność każdej strony internetowej. Bez odpowiedniego wykorzystania wizualizacji po prostu nie możesz przekazać swojej wiadomości odwiedzającemu, a jeszcze lepiej sprawić, by opuścił Twoją witrynę.

Wizualizacje mogą dotrzeć do wnętrza umysłu widza i zwabić go do wszystkiego, co próbujesz wprowadzić, sprzedać lub zainwestować. Aby wykorzystać efekty wizualne na swoją korzyść i zdobyć ruch w najszybszy możliwy sposób, najlepszą metodą zaangażowania i konwersji odwiedzających jest interaktywne opowiadanie historii.

Dlaczego opowiadanie historii?

Wiem, co musi teraz pojawiać się w twojej głowie. Co Kopciuszek lub Roszpunka mają wspólnego z wizualnym doświadczeniem strony internetowej? Cóż, opowiadanie historii nie ogranicza się tylko do bajek i franczyz Disneya, ale opowiadanie historii jest raczej skutecznym sposobem w miksie marketingowym każdej witryny internetowej, która ma na celu zdobycie czołówki konkurencji.

Jak stworzyć interaktywną historię

Połączenie projektu z historią wymaga dużo planowania i prób, więc kiedy pokażesz go na stronie docelowej swojej witryny, nie zrobisz z siebie głupka. Twoje efekty wizualne nie muszą być dziełem mistrzowskim kilku projektantów i kosztownym CGI. Możesz opowiedzieć swoją historię za pomocą jednego dobrze sformułowanego banera graficznego. Jednak wyzwanie pojawia się, gdy Twoja narracja krzyżuje się z celem Twojej witryny. O czym jest Twoja strona internetowa? Jakie jest logo Twojej marki i dlaczego sprzedaje to, co sprzedaje? Wszystko, co wyjaśnisz za pomocą elementów wizualnych, musi być wyjątkowe, bez grama plagiatu. Musi stać się tak przekonujący, że po jednej wizycie w Twojej witrynie ludzie zaczną ją udostępniać, rozmawiać o niej i ponownie ją odwiedzać.

Jak to działa

Istnieje ogromna rozbieżność między witryną zawierającą obrazy, grafikę i animacje a nijaką platformą skoncentrowaną na tekście, którą nazywasz witryną internetową. Nie da się osądzać ludzi i zanim można przeprowadzić właściwą rozmowę, już ich nie ma. Elementy multimedialne są wstrzykiwane, aby tego uniknąć. Kiedy klient widzi zwykły tekst opisujący produkt, ma poczucie przymusu przeczytania alfabetu i słów wypowiedzi, podczas gdy obraz, wideo lub animacja graficzna są równie łatwe do zobaczenia, co do zrozumienia.

Sprzedawanie dużego produktu z krótką historią

Firma sprzedająca samochody ma wiele do wypełnienia, zanim będzie mogła sprzedawać za pośrednictwem swojej platformy internetowej. Kupowanie samochodów przez Internet wymaga od klienta sporo nerwów, ponieważ w grę wchodzą duże sumy. Jeśli strona internetowa nie przyciągnie wzroku klienta, to nic innego jak śmieci pływające po Internecie. Sprzedaż samochodów, ciężarówek lub ciężkich maszyn online pod pewnymi kątami marketingowymi, aby ujawnić USP (unikalne cechy sprzedaży) produktu. Znam witrynę samochodową, która wykorzystała doskonałą technikę opowiadania historii, aby pokazać swoją pizzę na ekranie klienta.

Przykład :

Lexusls.asia jest odgałęzieniem Toyoty, która sprzedaje luksusowe samochody. Na stronie internetowej projektanci genialnie wykorzystali przewijanie paralaksy, aby przedstawić samochód z tekstem wystarczającym do tego, aby odwiedzający mógł zacząć. Potem nagle opona toczy się z prawej strony i pokazuje kilka innych fajnych cech samochodu. Gdy przewiniesz dalej, strona internetowa nie puszcza Cię i za pomocą kilku fajnych grafik opisuje cel i zalety samochodu.

Język wizualny

Język wizualny ma możliwość wykorzystania samego fundamentu projektowania skoncentrowanego na człowieku. Język wizualny sięga daleko wstecz i jeszcze zanim wynaleziono jakikolwiek alfabet, ponieważ malowidła naskalne były podstawowym środkiem komunikacji. Malowidła naskalne służyły jako źródło opowieści, przewodnik, jak przetrwać i uniknąć potencjalnych niebezpieczeństw, które były częścią tego okresu. Mniej więcej rysunki naskalne są najwcześniejszą formą danych wizualnych.

Wiemy, że obrazy i filmy wideo mają ogromną moc komunikacyjną, jak można wykorzystać tę moc za pomocą pikseli?

Przykład :

W tym momencie zaczyna działać twoja własna wyobraźnia. Dodawanie obrazów i filmów z odpowiednim tekstem mieszanym, aby Twoja witryna mówiła sama za siebie.

Bellroy.com sprzedaje swoje skórzane portfele z gwarancją większej przestrzeni i cieńszych wzorów. Pokazują to za pomocą eleganckiego suwaka z obrazami HD jednego portfela w stosunku do drugiego. Wraz z przesuwaniem suwaka historia również się porusza i w ciągu 10 zdjęć taka sama liczba kart jest dopasowana do ich markowego portfela, deformując drugi portfel bardziej, niż jest w rzeczywistości. Tutaj wniosek jest uderzający i ma morał do stracenia.

Zaprojektuj historię

Projektowanie opowieści wizualnej przypomina pisanie sztuki. Wszystkie aspekty i elementy spektaklu są obecne na Twojej stronie i mieszają się z taką intymnością, że całkowicie łączą się z przedstawioną przez Ciebie historią. Twoja historia zaczyna się od zaaranżowanej przez ciebie konfiguracji, następnie zmierza w kierunku konfliktu i kończy się rozwiązaniem.

Na przykład ta witryna ma unikalny sposób brania gościa za ramię i zapraszania go na bal taneczny pełen emocji i wizualnych smakołyków.

Użytkownicy muszą być świadomi historii, która prowadzi ich do celu. I tu odwiedzający staje się leadem, a lead klientem. Sprawiedliwe jest, aby produkt lub usługa, które planujesz przedstawić w procesie opowiadania historii, musi mieć coś, czego potrzebuje użytkownik, wyjątkową funkcjonalność lub marżę cenową, której szuka klient.

Przykład :

Bagigia.com najpierw przedstawia odwiedzającemu sprzedawcę, a następnie przedstawia prosty, ale głęboki obraz 3D samego produktu z emocjonalnym tekstem, aby historia była płynna. Duże białe odstępy w projekcie pomagają użytkownikowi się skoncentrować, ponieważ produkt wyróżnia się na środku, wprowadzając historię do akcji i zmierzając do rozwiązania.

Wykorzystanie animowanej historii na swoją korzyść

To prawda. Animacja stron internetowych padła ofiarą nadużycia bez względu na konwencje i standardy i to jest główna przyczyna jej upadku w ciągu ostatnich 5 lat. Jak na ironię, bardzo niewielu projektantów wie, w jaki sposób użycie sprytnej i trafnej animacji może sprawić, że Twoja historia stanie się filmem o Mrocznym Rycerzu. Animacja została stworzona, aby pokryć to, czego statyczne obrazy nie mogą wypełnić, jednocześnie dodając rozrywki do samego projektu.

Przykład :

Mówiąc o DarkKnight, ta aplikacja na iOS na stronie benthebodyguard.com pozwala zabezpieczyć i zaszyfrować informacje w Twojej witrynie, która zawiera animację przejścia (dosłownie), gdy schodzisz z „Benem" pośrodku, ochroniarzem przysięgającym chronić twoje informacje za pomocą budzącą grozę reputację. Ta witryna internetowa jest przykładem najlepszego wykorzystania animacji do stworzenia idealnej historii dla produktu.

Tłumaczenie wiadomości projektowych

Czy nie jest dla ciebie zaskoczeniem, jak projekt, który jest po prostu mieszanką sztuk wizualnych i grafiki, może wywołać w tobie empatię? Wiem, że mam. My, ludzie, reagujemy na nasze zwierzęce zmysły tak samo, jak każdy inny organizm, który jest wierny swojej naturze. Kiedy widzimy bicie serca – robimy tak, jak zaprogramowano. Wykorzystując tę ​​cechę ludzkiego zachowania, Twoja historia nie zawsze musi być zabójstwem szumu na temat Twojego manifestu i produktów, ponieważ prawdopodobnie tak ma na myśli każdy inny właściciel witryny. Kiedy dodasz poczucie sentymentu, ducha i moralności, twoja historia przekształci się w przesłanie.

Przykład :

Ta strona internetowa everylastdrop.co.uk zabierze Cię w podróż po codziennym korzystaniu z wody w Twoim domu i otoczeniu. Czytanie o tym, ile wody marnuje się każdego dnia, jest zbyt mainstreamowe i często nigdy nie jest traktowane poważnie. Ten niewinny mały człowieczek, który bez wyjątku korzysta z wody w swoim codziennym harmonogramie, nie tylko podkreśla znaczenie wody, ale także kontrastuje ją z tymi, którzy najbardziej jej potrzebują w trudnych częściach świata. Tak rośnie w umyśle widza, że ​​​​prawdopodobnie zastanowiłby się dwa razy, zanim następnym razem zmarnuje kolejną kroplę wody.

Używanie ciemnych elementów

Powieści są zabawne w czytaniu, a przy ostatnich postępach technologicznych konieczne jest teraz czytanie ich z książek. Nawet do dziś zdecydowana większość internautów woli oceniać książkę po okładce niż czytać prolog. Aby poradzić sobie z tymi użytkownikami online i zwabić ich do produktu, wielu pisarzy często zatrudnia programistów do tworzenia stron internetowych poświęconych ich powieściom. Próba powieści krok po kroku z animowanymi sekwencjami nie tylko zapewni fajerwerki, których potrzebuje, ale także usidli internautę, by ją przeczytać.

Przykład :

Korzystając z tej samej zasady i struktury, uznane opowiadanie Nam Le „The Boat” zostało przekształcone w interaktywną powieść graficzną, tworząc świat pustoszącego ocean, wypychając łódź z okropności wojny w Wietnamie. Najlepszą rzeczą, jaką każdy może zrobić podczas fiesty opowiadania historii, jest dodanie dźwięku do swojego projektu. To superlatyw animowanego opowiadania historii, aby zdobyć UX. Zobacz to tutaj.

Wciągająca i pełna ilustracji, to naprawdę dowód na to, jak dobrze można zarządzać produktem, tworząc projekt, który porusza się podczas interakcji z nim.

Ujednolicenie przewijania

W branży e-commerce ludzie często są zainteresowani uzyskaniem korzyści płynących z produktu, który może być używany w wielu przypadkach, ale z tego samego powodu. Po pierwsze, sprawia, że ​​ich życie jest o wiele łatwiejsze, a po drugie, jest częścią ery technologicznej. Ale mając tak wiele do nauczenia się i uznania na temat takiego przedsięwzięcia, jest bardzo mało prawdopodobne, że klienci zaryzykują w czymś, co ma futurystyczne implikacje i zbyt łatwo służy ich celowi, czyniąc to zbyt pięknym, aby mogło być prawdziwe. Widziałem firmy, które próbowały sprzedawać takie produkty za dużo, aby się zgodzić, a rezultatem było tragiczne porzucenie.

Przykład :

Jednak ten produkt nie tylko udaje się sprzedać, ale także spełnić to, co obiecuje swoim klientom. Ten produkt na onlycoin.com to pojedyncza karta, na której znajdują się wszystkie Twoje karty kredytowe. Proces opowiadania historii pomaga widzowi zrozumieć komplikacje związane z noszeniem zbyt wielu kart w portfelu z uzasadnieniem, ale dzięki graficznemu przedstawieniu optymalizacji kart krok po kroku i kompaktowemu noszeniu trudno nie zgodzić się z obiecanymi zastosowaniami produktu.

Wniosek

Opowiadanie historii nie ogranicza się tylko do dowolnego produktu lub celu; jest otwarty na wszelkiego rodzaju ćwiczenia e-commerce, które pomagają odwiedzającym uzyskać idealny UX bez uszczerbku dla funkcjonalności projektu. Nauka opanowania tego dla własnych produktów i usług za pośrednictwem witryn e-commerce jest niezbędna w dobie marketingu elektronicznego. Bez odczytania sposobu myślenia konsumenta po prostu nie możesz zaprezentować swojego produktu, a bez popytu nie ma produkcji. Jak mówi Tim O’brien: „Opowiadanie historii jest podstawową czynnością człowieka, im trudniejsza sytuacja, tym bardziej jest istotna” i zaufaj mi, przyjacielu, sytuacja nigdy nie staje się łatwiejsza.