Upload
uxeria
View
331
Download
2
Embed Size (px)
Citation preview
Jak zepsułem produkt kilka lekcji pokory
Igor Farafonow
Lekcja 1
Pustka
Lekcja 1
Portal społecznościowy usprawniający budowanie relacji wśród znajomych w GG
Źródło: oficjalne materiały prasowe GG Network
Lekcja 1
W czym jest lepszy?
• Adhocowe konferencje one-to-few, one-to-one
• Walle półprywatne
• Emotikony w streamie
• Integracja z komunikatorem
• Znacznie więcej – zdjęcia, wydarzenia, gry
Lekcja 1
Konferencje
Źródło: oficjalne materiały prasowe GG Network
Lekcja 1
zdjęcia…
Źródło: oficjalne materiały prasowe GG Network
Lekcja 1
gry…
Źródło: oficjalne materiały prasowe GG Network
Lekcja 1
Launch udany – na grafikach.
Źródło: oficjalne materiały prasowe GG Network
Lekcja 1
Jaki błąd użyteczności łączy wszystkie te ekrany?
Lekcja 1
Prezentują produkt dojrzały.
Lekcja 1
?
• Jak to będzie wyglądać przy niewielkiej ilości treści? • Jak to wyglądać, gdy nowe ciekawe treści będą
pojawiać się bardzo rzadko? • Gdzie są ekrany pierwszych wejść? Co ze
scenariuszami budowania zaangażowanie? / czy rozwijania krzywej uczenia?
• Zresztą – po co użytkownicy mają dodawać treść? W jaki sposób mają się poczuć zachęceni?
Lekcja 1
Tak wygląda rzeczywistość, gdy nie uwzględnimy mechanizmów budujących zaangażowanie oraz pominiemy
kwestie syndromu pustego sklepu.
Źródło: publikacja w serwisie internetowym gadunews.pl
Lekcja 1
Projekt nie uwzględniał aspektów braku treści i niewielkich ilości treści. Tylko w podstawowej
formie określał narzędzia budujące zaangażowanie użytkowników.
Nie był przewidziany jeden kluczowy aspekt
w cyklu życia produktu – rzeczywistość.
Lekcja 1
Koncentracja na przeczuciach, doświadczeniach, branżowych
wzorcach projektowych.
Lekcja 1
A wzorce są bez sensu… Przykład:
Lekcja 1
Właśnie utworzyłeś konto i jesteś tu po raz pierwszy.
Źródło: zrzuty facebook.com
Lekcja 1
Czy Ciebie, jako nowego użytkownika te ekrany zachęcą
do korzystania z serwisu?
Lekcja 1
To, że użytkownicy korzystają z funkcjonalności nie znaczy, że są one dobrze zaprojektowane.
Wpływ na ich korzystalność mają znajomość produktu, zaufanie do marki, świadomość, że inni korzystają i inne.
Źródło: zrzuty facebook.com
Lekcja 1
Jedynym wzorcem kierującym przy projektowaniu jest rzeczywistość.
Intuicje i inspiracje znajdują uzasadnienie tylko wtedy, gdy w całości uwzględniają skalę i problemy produktu.
PS> tych problemów z dziś, nie z jutra
Lekcja 2
Kompletność
Lekcja 2
Ile osób spośród Was projektowało kiedyś sklep internetowy?
Lekcja 2
Czy w tym sklepie były systemy ocen / recenzji produktów?
Źródło: fotozakupy.pl
Lekcja 2
Czy projektowaliście scenariusze wysyłek mailowych do klientów po zakupie z prośbą
o oceną produktu lub ocenę jakości dostawy.
Źródło: mail zalando.pl
Lekcja 2
Projektowanie modułów opiera się rysowaniu i składaniu klocków.
Rozwiązywanie zagadnień biznesowych to budowanie wielosesyjnych doświadczeń na różnych płaszczyznach.
Doświadczeń uwzględniających różne kanały komunikacji –
przeglądarka, email, mobile, social, itd.
Lekcja 2
Ale tu nie chodzi tylko o ilość
Lekcja 2
Czy ktoś z Was projektował kiedyś system autentykacji?
Źródło: gg.pl (zrzut)
Lekcja 2
Kto w swoim projekcie nie uwzględnił wszystkich usecase’ów i scenariuszy?
• Ekran odzyskiwanie hasła • Niepoprawny email w procesie odzyskiwania hasła • Potwierdzenie wysłania instrukcji do utworzenia nowego hasła • Treść emaila odzyskiwania hasła • Ekran tworzenia nowego hasła – po kliknięciu w link z maila • Ekran potwierdzenia założenia nowego emaila • Ekran tworzenia nowego konta • Ekran wykorzystania Facebooka / G+ do założenia konta / zalogowania • Ekran potwierdzający założenie nowego konta • Treść emaila z linkiem aktywującym konto (dla double opt-in) • Ekran po potwierdzeniu założenia nowego konta • Ekran, gdy token zawarty w linku z maila już wygasł • Przypomnienie o potwierdzeniu adresu email • Walidacja formularzy dla wszystkich ustandaryzowanych elementów • Spójne GUI w ramach całego projektu – wszystkich formularzy, labeli, pól • Wszystkie dodatkowe komunikaty potwierdzające sukces porażkę w każdym usecase
Lekcja 2
Każda funkcjonalność powinna być kompletna.
Źródło: gg.pl (zrzut)
Lekcja 2
Nie układamy klocków – projektujemy doświadczenia. Powinny być wielowątkowe, wielokanałowe,
ale i kompletne w ramach scenariuszy.
Źródło: materiały własne
Lekcja 3
Zakres
Lekcja 3
Odtwarzacz muzyki: nieskończenie piękny
Lekcja 3
Jak to się miało do rzeczywistości?
Nijak. Sztuka dla sztuki.
Lekcja 3
Rok pracy zanim produkt powstanie?
Lekcja 3
Produkt musi być realizowalny
• Ciągła współpraca z IT • Określenie listy funkcjonalności kluczowych biznesowo • Realna wycena, jeszcze zanim powstaną makiety • Projektowanie ustalonego zakresu – ‘nie projektujemy
do szuflady’ • Konsekwencja – nie zmieniamy zakresu funkcjonalnego
w międzyczasie • Dyscyplina – nie zmieniamy projektu w nieskończoność
Lekcja 3
Bo co by było, gdybyśmy przygotowali prosty player MP3?
• Mielibyśmy gotowy produkt w ciągu trzech miesięcy • Skonfrontowalibyśmy interfejs użytkownika z Klientami • Poznalibyśmy, w jaki sposób korzystają z naszego
systemu i jakie problemy rozwiązują • Wdrażalibyśmy kolejne funkcjonalności mając już
działający produkt
Lekcja 3
Podobna historia w Uxerii
Źródło: Uxeria.com
Lekcja 3
Większy zakres funkcjonalny opóźnia launch i wprowadza dodatkowe ryzyka
• wydłuża czas oczekiwania na wydanie • zwiększa ryzyko, że coś się wysypie • zmniejsza elastyczność na zmiany – czasami
konieczne po pierwszej weryfikacji z rynkiem • z punktu widzenia produktowego potrafi
zmniejszyć przejrzystość głównych cech produktu
Lekcja 3
Nie robimy sztuki dla sztuki. Nie zawsze warto ratować świat.
Projekt powinien po prostu
być realizowalny.
Lekcja 4
Zasady
Lekcja 4
Każde kolejne pole formularza obniża konwersję o 15 do 30 procent.
Prawda?
Źródło: fotozakupy.pl (zrzut)
Lekcja 4
11.500 klientów w 70 krajach
1.900 klientów agencyjnych
Źródło: hubspot.com(zrzut)
Formularz na ebooku hubspot
Lekcja 4
Źródło: hubspot.com (zrzut)
Jeszcze raz…
Źródło: hubspot.com (zrzut)
Lekcja 4
Co więc tak naprawdę decyduje o konwersji formularza?
• Zaufanie – użytkownicy nie uzupełnią formularza, gdy nie ufają produktowi i intencjom • Opisanie celowości – użytkownicy muszą wiedzieć, po co uzupełniają formularz, po co
podają poszczególne dane – jeżeli to wiedzą, zrozumiały jest dla nich fakt podania tych danych
• Znajomość kontekstu uzupełnienia – forma formularza uzależniona powinna być od kontekstu uzupełnienia danych – czasem ktoś chce zrobić szybko bazując na standardowych form-fieldach; czasem warto dać więcej playability
• Pola umieszczone w odpowiedniej kolejności – kolejność pól nie może być przypadkowa – labele czytane jeden po drugim same z siebie powinny opowiadać historię – tworzyć nić komunikacji
• Konwersacja – forma opisów labeli powinna być jasna i czytelna – powinno się unikać słów kluczowych i generycznych haseł
• Podobne pola powinny być pogrupowane (razem) • Koncentracja na formularzu – no distractions please! • Autouzupełnianie możliwie największej ilości danych (np. miejscowość na podstawie
kodu) • Unikanie błędów zamiast ich walidowanie postsubmitowe • Proces to tunel • Na pewno nie ilość pól (zwłaszcza, gdy spełnione są powyższe)
Lekcja 4
Jeśli użytkownik rozumie celowość formularza i wie, do czego posłużą umieszczone tam dane,
formularz nie musi być kompaktowy.
Źródło: Inwestorwkapitalludzki.pl (zrzut)
Lekcja 4
1 2
Konwersja porównywalna. Z punktu widzenia biznesowego
różnica znaczna.
Źródło: Uxeria.com (zrzut)
Lekcja 4
Ogólne zasady, wzorce i statystyki są przydatne jako inspiracje i tezy.
Nie powinniśmy ich uznawać za prawdziwe,
dopóki nie zweryfikujemy na swoim podwórku.
• Testy A/B • Analytics • Badania z użytkownikami • Mouse tracking, heatmapy • Grupy fokusowe
Lekcja 5
Zaangażowanie
Lekcja 5
Źr.: http://johnhaime.com/2014/04/your-emotional-brain-a-key-in-performance/
Decyzja zakupowa nie jest wynikiem pracy mózgu racjonalnego, lecz emocjonalnego
Lekcja 5
Golden Circle – emotional design
Lekcja 5
Klienci kupują emocjonalnie. Determinantem wcale nie muszą być są logiczne przesłanki. Często jest nią wiara we wspólne wartości.
Lekcja 5
Emotional design w marketingu
Lekcja 5
Emotional design w webie
Lekcja 5
Emocjonalne doświadczenie powinno być spójne we wszystkich touchpointach Klienta z produktem
Lekcja 5
Emocje wynikają z sumy wszystkich doświadczeń Klienta z firmą / produktem. Tych dobrych i tych złych. Niestety gorsze doświadczenia i emocje są zawsze silniejsze (negativity bias).
Lekcja 5
Projektujemy emocje – stąd nasze projekty powinny być spójne z emocjonalnym nastawieniem klientów do produktu
• Jeśli jest to dyskont, powinien wyglądać jak dyskont • Jeśli jest to sklep z produktami premium, taką też
powinien mieć architekturę informacji • Jeśli to jest aplikacja wspierająca biznes, to też
powinna mówić strona – rozumiemy Twój biznes
To wszystko zarówno w kontekście architektury informacji, jak i estetyki witryny
Lekcja 5
źr.: http://jesserogerson.com/tag/brain/
A nasz projekt składa się z treści i formy, które powinny budować spójną komunikację…
Lekcja 5
Emotional design – połączenie formy i treści, by zbudować spójne doświadczenie emocjonalne.
Lekcja 5
Naszym zadaniem jest projektowanie doświadczeń emocjonalnych.
Czym ten produkt ma być dla Klienta – jakie
emocje mają ich łączyć? To nie decyzja projektanta, lecz biznesu.
Ta konsekwencja i spójność produktowa
powinna być zachowana na każdym touchpoincie.
Dziękuję za uwagę
Igor Farafonow [email protected]
Pragnę poinformować, że wszystkie przykłady i grafiki wykorzystane w tej prezentacji są oficjalnymi materiałami podmiotów, bądź też zrzutami ekranów aktualnych systemów i stron internetowych – dostępnymi wszystkim użytkownikom Internetu (przy każdym wpisane źródło pochodzenia). Żadne z zaprezentowanych w prezentacji grafik i informacji nie są objęte tajemnicą firmową ani nie są materiałami wewnętrznymi jakiegokolwiek podmiotu. Informuję również, że prezentowane przeze mnie przykłady nie powinny świadczyć o tym, że w ramach mojej dotychczasowej pracy realizowałem którykolwiek z przedstawionych projektów. Celem umieszczenia tych materiałów jest wskazanie moich subiektywnych odczuć i przemyśleń dotyczących pewnych rozwiązań. Nie powinno się przypuszczać, żebym bym był w jakikolwiek sposób powiązany z tymi witrynami i systemami, bądź podmiotami za nie odpowiedzialnymi. Igor Farafonow.
Uwaga dodatkowa