W jaki sposób zespół projektantów UX firmy Zivame umożliwił wielokierunkowe odkrywanie produktów

Jest to pierwszy z pięcioczęściowej serii blogów gościnnych autorstwa Udita Khandelwala, dyrektora ds. UX w Zivame.

Jeśli użytkownicy nie mogą jej znaleźć, funkcja nie istnieje! – Human Factors International (HFI)

Po raz pierwszy usłyszałem ten cytat podczas sesji szkoleniowej w HFI w 2012 roku i zawsze będzie to odpowiadało mojemu podejściu do UX.

Odkrywanie produktów jest jednym z najważniejszych aspektów każdego biznesu detalicznego, a jeśli użytkownicy nie mogą znaleźć oferowanych przez Ciebie produktów, to znaczy, że nie istnieją. Aby umożliwić bezproblemową eksplorację produktów w Zivame, opracowaliśmy wielokierunkową strategię odkrywania na naszych platformach. W tej serii 5 artykułów omówię dźwignie używane do prezentowania kolekcji, odkrywania produktów i komunikacji ofertowej w Zivame.

Jest to pierwszy artykuł z tej serii, a tutaj będę głównie omawiał pozycje pod Lodołamaczami z listy dźwigni podanej poniżej:

Każdy z nich służy bardzo konkretnemu celowi na ścieżce użytkownika i jest odpowiednio używany. Przyjrzyjmy się im po kolei – rozmawiając o wyzwaniach w każdym przypadku i o tym, co zrobiliśmy, aby je pokonać. Opowiem również o wskaźnikach biznesowych, tam gdzie ma to zastosowanie.

Karty lądowania na stronie głównej

Wyzwanie

• 45% ruchu internetowego na Zivame to użytkownicy po raz pierwszy

• 40% ruchu bezpośredniego i organicznego trafia na stronę główną Zivame

• Większość z powyższych użytkowników ma bardzo niewielkie pojęcie o zakresie oferowanych przez nas produktów

Rozwiązanie

Brak otwartego menu poziomego i korzystanie z nawigacji z hamburgerami na urządzenia mobilne było bardzo dobrze przemyślanym i przetestowanym przez użytkowników podejściem, które zaczęliśmy stosować z naszym nowym stosem.

Stało się to kosztem braku szczerego spojrzenia na naszą ofertę.

Dlatego kluczowe stało się dla nas komunikowanie tego samego, od samego początku. Do tego właśnie służą pokazane poniżej karty.

Interesujące jest to, że to podejście zostało najpierw skonceptualizowane dla komputerów stacjonarnych, a później dostosowane do urządzeń mobilnych, jak pokazano poniżej. W wersji desktopowej

karty zajmują pierwsze miejsce na wierzchu, podczas gdy na urządzeniach mobilnych znajdują się tuż pod sztandarem bohatera ze względu na ograniczenie przestrzeni w pionie.

Kiedy tworzyliśmy konceptualizację, nasi menedżerowie wyobrażali sobie to w następujący sposób:

Nikt, kto spędza 8 sekund na mojej stronie głównej, nie powinien odejść, nie wiedząc, że Zivame sprzedaje bieliznę, odzież i odzież sportową. – Shaleen, dyrektor operacyjny Zivame

…i myślę, że wykonaliśmy dobrą robotę, osiągając to samo poprzez projektowanie. Umiejscowienie kart sprawia, że ​​nie można ich przegapić, a tytuły wraz z linkami wyznaczają jasne oczekiwania co do poszczególnych kategorii , tj. Bielizna, Odzież sportowa i Odzież. Co więcej, czwarta karta pozwala na wystarczającą elastyczność, aby umieścić meta przedmioty, które zasługują na miejsce w pierwszym złożeniu.
PS Ten komponent jest w fazie rozwoju, kiedy piszę ten post i zostanie wkrótce wydany!

(Przeczytaj również: Kształtowanie doświadczenia użytkownika w Zivame: studium przypadku zarządzania produktem)

Dążyć

Trudno zgadnąć, które 4 rzeczy znajdą się w każdej karcie, ponieważ każdy interesariusz w firmie poszukuje najlepszej nieruchomości na swoją nieruchomość!
Chociaż dane wydają się łatwą drogą ucieczki, w której można po prostu trzymać na wierzchu najbardziej poszukiwane dane, firma może podążać w sprzecznym kierunku . Na przykład sama Apparel generuje zaledwie 8% przychodów Zivame na dzień dzisiejszy, ale zajmuje 25% największych nieruchomości.

Współpraca między funkcjami z dużą dozą umiaru ze strony kierownictwa firmy powinna dać ci właściwą odpowiedź. Jak mówi mój menedżer produktu:

Trzeba być nieproporcjonalnie uprzejmym dla niektórych podmiotów, aby zapewnić ich nieproporcjonalny wzrost. – Vishrut Shukla, Senior PM – Zivame

Karuzela bohaterów na stronie głównej

Wyzwanie

• To kolejna najlepsza nieruchomość, a nieruchomość jest wizualna. Musi reprezentować markę i przestrzegać ścisłego języka projektowania wizualnego.

Rozwiązanie

Szczerze mówiąc, było to łatwe do zaprojektowania, ale trudne do wykonania. Wiedzieliśmy, że kierujemy się językiem projektowania big-bold-beautiful, dlatego łatwo było zdecydować, że baner musi zajmować 100% szerokości ekranu i 100% pozostałej wysokości ekranu. Ale to pozostawiło nam 2 problemy do rozwiązania:

• Na niektórych rozmiarach ekranu baner został przycięty, ponieważ zamierzaliśmy użyć algorytmu „okładki”.

• Kiedy baner rozciąga się aż do dolnej krawędzi ekranu, użytkownicy mogą mieć złudzenie, że strona się tam kończy i nie ma nic poza tym.

Aby rozwiązać problem z przycinaniem, zdefiniowaliśmy bezpieczne obszary i przetestowaliśmy je w wielu rozdzielczościach. Po kilku trafieniach i próbach udało nam się to osiągnąć.
Umieściliśmy jodełkę na dole banera, aby dać użytkownikom wizualną wskazówkę, że poza banerem jest coś więcej. Aby zachować czystość, postanowiliśmy uczynić strzałkę nawigacyjną jednokierunkową, ale także daliśmy wskazówki do pokazu slajdów, umieszczając nawigację opartą na kropkach.

Przygotowanie odpowiedniego banera, z odpowiednią wiadomością i połączenie go z banerami na stronie kategorii wymagało intensywnej współpracy międzyfunkcyjnej, mając na uwadze podróż użytkownika. Powyższa sekcja wyświetla przykładowy zrzut ekranu, a poniżej jak zdefiniowaliśmy bezpieczny obszar:

Polecane kolekcje

Wyzwanie

• Banery są dobre do przyciągnięcia uwagi, ale aby wzbudzić zainteresowanie użytkowników i sprawić, że klikną z właściwymi oczekiwaniami, musimy powiedzieć im nieco więcej o kolekcji. Jednak nieruchomości są ograniczone i istnieje duża konkurencja między różnymi kolekcjami.
• Wcześniejszy projekt strony głównej Zivame dla telefonów komórkowych zawierał akordeon kolekcji, gdzie każda kolekcja składała się z 10 produktów, po których następował przycisk „Zobacz więcej” po przewinięciu do ostatniej miniatury. Analiza danych wykazała, że ​​ponad 40% użytkowników, którzy wchodzili w interakcję z akordeonem, klikało, aby zobaczyć więcej. To wzmacnia powyższy punkt. Nie chcieliśmy jednak używać akordeonu, ponieważ był niewizualny i ciężki tekstowo.

  

• Wczytanie zbyt wielu zdjęć produktów z góry negatywnie wpływa na wydajność strony. Za każdą dodatkową sekundę czasu ładowania strony konwersja spada aż o 7%.

Rozwiązanie

Kosztem dodatkowego kliknięcia pokaż USP, a także zajrzyj do każdej kolekcji. Oprócz kolażu produktów, po prostu ujawniliśmy 3 krytyczne informacje:

1. Nazwa kolekcji
2. Opis
3. Atrybuty podpisu

To nie tylko wzbudziło zainteresowanie kolekcją, ale także prowadzi użytkownika w podróż ku odkrywaniu produktów z określonymi oczekiwaniami. Kolaż produktów można zoptymalizować pod względem technicznym, aby był zwracany jako pojedynczy obraz kolażu, a nie wiele obrazów produktów. Ponownie, ta wersja została częściowo wdrożona w obecnej witrynie, a pozostała część jest wdrażana, gdy piszę ten artykuł.

Odwiedź Zivame

Kategoria Masthead

Wyzwanie

• Strony kategorii to główne strony docelowe płatnego ruchu. Ponadto każdy, kto kliknie dowolną z banerów kolekcji/ofert w witrynie, trafia na stronę kategorii. Dlatego kluczowe staje się zszycie tutaj podróży użytkownika i utrzymanie kontekstu.

• Szersza kategoria, tym trudniej użytkownikom dokonać wyboru. Dlatego w niektórych przypadkach możemy chcieć zawęzić podróż użytkownika do bardziej konkretnej podkategorii , a następnie do określonych produktów.

• Niektóre kategorie są bardzo szczególne lub nowe, a użytkownicy muszą być poinformowani o USP w momencie, gdy trafią na stronę.

Rozwiązanie

Masthead składa się z 4 głównych elementów. Wymyśliliśmy podejście, w którym konfigurowalne komponenty zajmą się wyżej wymienionymi przypadkami użycia: po prostu umieść baner w mastheadzie i polegaj na kreatywnych banerach, kupuj według, filtruj/sortuj pasek narzędzi i zaoferuj komunikację, aby zrobić resztę.
Opowiem tutaj o banerach, a „sklep przez” i ofertach omówię później. Zaprojektowaliśmy 3 warianty lub szablony dla banerów kategorii:

1. Pojedynczy baner
2. Karuzela
3. Podzielone banery

Pojedyncze banery doskonale sprawdzają się w wąskich kategoriach i mówią o ich USP. Z drugiej strony karuzele i banery Split to świetny sposób na umieszczenie wielu banerów w ograniczonej nieruchomości i są używane do prowadzenia do podkategorii.
Promując którąkolwiek z tych stron, zespoły ds. marketingu cyfrowego i kreatywnego upewniają się, że kreacje marketingowe mówią tym samym językiem i używają podobnych obrazów, aby połączyć podróż użytkownika.

Teraz, podobnie jak baner bohatera strony głównej, banery te zajmują 100% dostępnej szerokości, jednak wysokość jest stała. Dlatego w niektórych przypadkach (lub rozdzielczościach) kończymy przycinanie banera od prawej strony. Tak jak na stronie głównej, zdefiniowaliśmy bezpieczne obszary, a zespół kreatywny został poproszony o przestrzeganie tego samego podczas projektowania tych banerów.
Poniżej znajduje się przykład tego, jak zdefiniowaliśmy to samo dla podzielonego banera:

Zastrzeżenie

Nie jest to projekt zorientowany na urządzenia mobilne, a po wdzięcznej degradacji na urządzeniach mobilnych wracamy do prostego banera lub karuzeli obsługującej przesunięcie palcem. Nie ma podzielonego banera dla telefonów komórkowych.

Wprowadzenie do aplikacji

Wyzwanie

• Tak wiele chcesz powiedzieć użytkownikom, ale wyjście poza 4 karty podczas wprowadzania to przesada. Przestrzeń jest ograniczona, funkcje są ogromne, użytkownicy nie mają czasu na czytanie, a mimo to trzeba trzymać aplikację.

• Nie wiesz, kto przegląda : nowicjusz czy ekspert, odkrywca czy nawigator; i musisz zaprojektować odpowiednie dla wszystkich doświadczenie onboardingowe

Rozwiązanie

Zamiast myśleć o tym, co chcemy powiedzieć użytkownikowi, zaczęliśmy myśleć odwrotnie → Czego użytkownicy chcieliby się nauczyć? Dzięki szybkim badaniom paskowym byliśmy w stanie stwierdzić, że użytkownicy szukają głównie odpowiedzi na następujące pytania:

1. O czym to jest?
2. Co mogę tutaj zrobić?
3. Jak zacząć?
4. Co będę z tego mieć? Jak mi to pomaga?

Więc problem został po prostu zredukowany do 4 ekranów, które mogłyby odpowiedzieć na te pytania. Stąd wyzerowaliśmy następujące 4 ekrany:

Ostatni ekran jest sprytnie zaprojektowany do promowania FitCode, ale użytkownicy mogą go pominąć i kontynuować zakupy.

Zastrzeżenia

Jest kilka usterek, które teraz poprawiamy i przed którymi chciałbym Cię ostrzec:

1. Wyskakujące okienko uprawnień do powiadomień pojawia się bezpośrednio na ekranie startowym. Jest to bardzo irytujące dla użytkownika i prawdopodobnie uzyskamy tutaj minimalną konwersję. Co należy zrobić zamiast tego – o pozwolenie na powiadomienie należy ubiegać się po wystąpieniu określonego zdarzenia (np. logowanie lub sukces zamówienia, dostęp do treści itp.).
2. Komunikaty związane z zaangażowaniem w sieci (wyskakujące okienka marketingowe) czasami pojawiają się podczas wprowadzania. Ponownie, jest to bardzo złe doświadczenie, a użytkownicy najprawdopodobniej nie będą otwarci na żadne komunikaty marketingowe podczas onboardingu. Musimy zadbać o to, aby na ekranach startowych nie wyświetlały się żadne wyskakujące okienka.

FitKod

Wyzwanie

• Wiele kobiet woli kupować w sklepie fizycznym niż przez internet. Jednym z najczęstszych powodów jest to, że nie są pewni, czy dany produkt będzie do nich pasował. Nie mogą spróbować online.

• Różne kobiety mają różne kształty ciała i nie ma jednego produktu, który pasuje do wszystkich, jeśli chodzi o bieliznę. Dlatego ważne jest, aby zaprezentować im produkt, który będzie odpowiadał ich sylwetce i upodobaniom.

• Jeśli dasz im formularz, aby wypełnić ich pomiary i preferencje, porzucenia są wysokie. Dlatego każde rozwiązanie, które wymyślimy, musi być skuteczne.

Rozwiązanie

Zespół Fashion Design firmy Zivame, wraz z kierownikami produktów, przeprowadzili szeroko zakrojone badania i wywnioskowali, że kobiece typy ciała można dokładnie opisać, umieszczając je w 11 rodzajach profili.

Połącz te profile wraz z pomiarami i preferencjami, a powinieneś być w stanie zapewnić użytkownikom odpowiednie rekomendacje produktów. Nazywamy to FitCode, który jest uzyskiwany przez zadawanie użytkownikom zestawu pytań (FitCode Quiz).
Wersja tego została zaprojektowana, przetestowana przez użytkowników, zaimplementowana i wydana w aplikacjach. Podczas gdy użytkownicy poznawali koncepcję i odpowiadali na quiz, pojawiły się 2 rażące problemy:

• Duża liczba porzuceń
• Niektórzy uważali, że obrazy, których użyliśmy do przedstawienia profili, były przerażające.

Doszliśmy do wniosku, że quiz został zaprojektowany w taki sposób, że najpierw zadajemy użytkownikom trudne pytania i to podejście musi się zmienić. Musieliśmy zainwestować użytkowników, zadając im najpierw łatwiejsze pytania, a potem te trudniejsze. Zmieniliśmy także naszych twórców i uczyniliśmy ich bardziej abstrakcyjnymi. Nie były już przerażające. Spójrz na poniższe ekrany:

Znajdź swoje idealne dopasowanie

Mam nadzieję, że ten artykuł był dla Ciebie pouczający i wnikliwy.

Ucz się kursów zarządzania produktami online na najlepszych światowych uniwersytetach. Zdobywaj programy Masters, Executive PGP lub Advanced Certificate Programy, aby przyspieszyć swoją karierę.

Polecany program dla Ciebie: Program certyfikacji Design Thinking od Duke CE

Co oznacza wielokierunkowe odkrywanie produktów?

Odkrycie produktu odnosi się do sposobu, w jaki klient, który dotarł do punktu styczności z klientem po raz pierwszy - uczy się, rozumie i zachowuje informacje o produkcie oferowanym przez firmę, na tyle, aby mieć pewność, że następnym razem natychmiast zapamięta markę mieć powtarzający się wymóg. Celem wszystkich menedżerów produktu powinno być zapewnienie, że stanie się to w ciągu pierwszych 8 sekund doświadczenia klienta w różnych punktach styku firmy z klientami. W przypadku, gdy firma oferuje więcej niż jeden produkt, celem jest, aby stało się to dla wszystkich. Na tym właśnie polega wielokierunkowe odkrywanie produktów.

Czy istnieją kursy specyficzne dla zarządzania produktami dla firm e-commerce?

Nie, nie ma kursów poświęconych zarządzaniu produktami w e-commerce. Kilka mniej skrupulatnych firm może tak twierdzić, ale rozsądnie byłoby sprawdzić ich referencje przed przystąpieniem do pracy. Dobre programy do zarządzania produktami nie są tak specyficzne, ponieważ byłoby to niekorzystne dla studentów. Celem umożliwienia osobie zostania dobrym menedżerem produktu jest zapewnienie, że posiadają oni niezbędne umiejętności i wiedzę do wykonywania dobrej pracy niezależnie od wyboru branży, co z kolei umożliwiłoby im przełączanie się między branżami na późniejszych etapach kariery.

Jak zostać menedżerem produktu bez dyplomu MBA?

Aby być dobrym menedżerem produktu, który może przejść najtrudniejsze rozmowy kwalifikacyjne, podstawowe umiejętności w dziedzinie domeny, których potrzebujesz, to dobre zrozumienie technologii produktu, doskonała znajomość projektowania produktu i projektowania podróży klientów oraz umiejętności zarządzania biznesem. W związku z tym może to być zniechęcające dla osoby, która ma wystarczające umiejętności techniczne i doświadczenie zawodowe, ale nie rozumie zarządzania biznesem, takiego jak planowanie finansowe, budżetowanie, zarządzanie projektami, marketing, strategia i tak dalej. Najlepszym sposobem na ich rozwinięcie byłoby zdobycie dyplomu MBA. Jednak dzięki zapotrzebowaniu wykwalifikowanych menedżerów produktu, można również dostać się do tych ról, kształcąc się w niepełnym wymiarze godzin w zakresie zarządzania produktem.