Wędruj mniej, szybciej docieraj do pliku Desired Media w WhatsApp

Poprawa komfortu wyszukiwania plików multimedialnych WhatsApp w „informacjach kontaktowych” w celu skrócenia ogólnej długości sesji wyszukiwania określonego pliku multimedialnego, co skutkuje zwiększoną wydajnością, większą kontrolą i swobodą dla użytkownika.

Niedawno brałem udział w wyzwaniu projektowym, które doprowadziło do stworzenia tego studium przypadku. Więc zanim zagłębisz się w moje studium przypadku, spójrzmy na kontekst ⬇️

Jak zacząłem od UX Design Challenge

Tak więc moja podróż rozpoczęła się od uczestnictwa w 2-tygodniowych warsztatach UX Kickstarter prowadzonych przez Anudeep, gdzie dowiedziałem się o zasadach projektowania UX, heurystyce, budowaniu interfejsu użytkownika w Figmie, animowanym prototypowaniu i wpływie projektowania UX na biznes.

Wszystko, czego się nauczyłem, odbywało się w sposób niepodręcznikowy. Z jakimś magicznym eliksirem zdrowego rozsądku wywołanym ciekawością zacząłem patrzeć na produkty codziennego użytku, czy to fizyczne, czy cyfrowe, z ciekawym nastawieniem lub można powiedzieć, że otworzyło mi się trzecie oko, które jest „okiem projektanta”.

Z tym ciekawym nastawieniem rozpoczęliśmy sesję z Anudeepem, podczas której poinformowano nas o wyzwaniu związanym z projektowaniem UX. Będąc moim pierwszym w życiu udziałem w wyzwaniu projektowym, byłam bardzo podekscytowana i jednocześnie trochę zdenerwowana. Mieliśmy 2 dni na ukończenie wyzwania, ale myślę, że ten dreszczyk emocji związany z ukończeniem go w ścisłym ograniczeniu czasowym był świetnym doświadczeniem edukacyjnym, aby dowiedzieć się, jak projektować z uwzględnieniem ograniczeń.

➡️ Moje ostateczne przeprojektowanie doświadczenia wyszukiwania plików multimedialnych WhatsApp, które jest częścią ekranu informacji kontaktowych, który obejmuje opcję multimediów, linków i dokumentów

Oto porównanie oryginalnego ekranu i przeprojektowania. W dalszej części studium przypadku przeprowadzę Cię przez proces, w jaki doszedłem do rozwiązania.

Porozmawiajmy o rozwiązaniu i o tym, jak pomaga użytkownikom

W ostatecznym rozwiązaniu

Dodałem różne zakładki multimediów, takie jak Zdjęcia, Wideo, Audio, GIF-y i Naklejki. Teraz, gdy ktoś chce wyszukać określony plik multimedialny, powiedzmy wideo, może natychmiast przełączyć się na kartę wideo i znaleźć wszystkie filmy z tego konkretnego miesiąca, które chce komuś udostępnić lub zapisać na swoim urządzeniu. Pomaga to użytkownikom zaoszczędzić dużo czasu, który w przeciwnym razie byłby poświęcony na wyszukiwanie plików multimedialnych, w których pomieszano różne typy plików multimedialnych.

Oprócz tego dałem użytkownikom elastyczność i kontrolę, aby pokazać lub ukryć określoną kartę multimediów, którą chcą zobaczyć. Istnieją dwie opcje filtrowania, jedna dla każdego konkretnego miesiąca, w której można wyświetlać lub ukrywać karty multimediów w poszczególnych miesiącach, a drugą opcją jest ogólne filtrowanie kart multimediów dla wszystkich miesięcy, w zależności od preferencji użytkownika.

Dodałem również opcję dostępu do plików multimedialnych, których kopia zapasowa nie została jeszcze utworzona, aby te pliki bez kopii zapasowej nie mieszały się z tymi, których kopia zapasowa została utworzona. Ponieważ użytkownik może kliknąć pliki bez kopii zapasowej tylko po to, aby dowiedzieć się, że nie mogą otworzyć/interakcję z mediami. Tak więc te pliki bez kopii zapasowej będą dostępne na innym ekranie. Mając w ten sposób na uwadze heurystykę zapobiegania błędom dla użytkowników.

W jaki sposób rozwiązanie pomaga firmie?

Rozwiązanie pomaga zaoszczędzić dużo czasu użytkownikom, co z kolei pomaga im szybciej wykonywać zadania, zmniejszając w ten sposób długość sesji użytkowników i przerwy w wyszukiwaniu.

Oto prototyp Figma dla tego samego -

Porozmawiajmy teraz o tym, jak wyglądał proces dochodzenia do ostatecznych decyzji projektowych

Powód, dla którego wybrałem WhatsApp i ten konkretny przepływ

Jak wspomniałem wcześniej po warsztatach UX, wyrobiłem sobie nawyk patrzenia na każdy produkt, czy to fizyczny, czy cyfrowy, z punktu widzenia projektanta, a zrozumienie „dlaczego” projektu stało się moją drugą naturą. Pomógł w tym zeszyt ćwiczeń dotyczący uczenia się z istniejącego wzornictwa , ponieważ na każdy produkt patrzono z perspektywy zdrowego rozsądku.

Kiedy korzystałem z WhatsApp do udostępniania multimediów z danych kontaktowych czatu, zdałem sobie sprawę, że proces wyszukiwania jest nieco uciążliwy, zwłaszcza gdy szukam określonego pliku multimedialnego, którym może być wideo, GIF lub plik audio.

Wiedziałem, że musi istnieć sposób na zmniejszenie wysiłków związanych z wyszukiwaniem pliku multimedialnego. Inną rzeczą, o której pamiętałem, było to, że niezależnie od tego, czy jest to jakikolwiek produkt, znany czy nowy, zawsze istnieje pole do ulepszeń, ponieważ wraz z ewolucją produktu zmienia się również projekt i potrzeby użytkowników.

Kolejnym powodem, dla którego wybrałem WhatsApp jako moją aplikację do wyzwania, była szeroka baza użytkowników, licząca ponad 2 miliardy aktywnych użytkowników miesięcznie. Produkty posiadające tak szeroką bazę użytkowników oznaczają, że nawet pojedyncza zmiana w funkcji produktu może potencjalnie mieć ogromny wpływ zarówno na użytkowników, jak i na biznes.

Mówiąc o biznesie, UX ma ogromny wpływ na firmy, a wpływ ten można zmierzyć za pomocą wielu wskaźników biznesowych . Przepływ wyszukiwania WhatsApp, jeśli zostanie ulepszony, może potencjalnie skutkować skróceniem długości sesji i porzuceń podczas wyszukiwania użytkownika i może pomóc firmie w bardzo znaczący sposób.

Jak rozumiem obszary wymagające ulepszeń w WhatsApp?

Poznanie i zrozumienie 10 heurystyk projektowania bardzo pomogło mi w zidentyfikowaniu problemów w moim obecnym przepływie wyszukiwania. Z pomocą zdrowego rozsądku i oceny heurystycznej udało mi się wybrać kilka problemów, które można było rozwiązać w procesie wyszukiwania.

Podczas oceny heurystycznej wymyśliłem pytania takie jak:

1. Dlaczego pliki są segregowane jako Media, Linki i Dokumenty?
2. Elastyczność i efektywność użytkowania — podział plików na media, łącza i dokumenty pomaga użytkownikom szybko wyszukać plik, który chcą zapisać lub udostępnić komuś
• Elastyczność i efektywność użytkowania - Wyświetlanie plików multimedialnych według miesięcy pomaga użytkownikom szybko znaleźć multimedia specyficzne dla konkretnego miesiąca, w którym zostały udostępnione.
• Rozpoznawanie zamiast przywoływania — dzięki miesięcznej segregacji plików multimedialnych użytkownicy mogą szybko rozpoznać, jak stary lub nowy jest plik, zamiast próbować przypomnieć sobie, jak dawno temu plik multimedialny był udostępniany, co z kolei pomaga zmniejszyć obciążenie poznawcze użytkownik.

W jaki sposób użytkownik znajdzie określony plik multimedialny, aby zawęzić czas wyszukiwania dla użytkownika?

• Użytkownikowi trudno jest wyszukać konkretny typ pliku multimedialnego, którym może być wideo, gif, audio lub naklejka. Często użytkownicy mogą potrzebować dużo przewijania, aby znaleźć określony typ pliku multimedialnego podczas próby udostępnienia pliku komuś lub zapisania go na własnych urządzeniach.
• Heurystyka- Elastyczność i Efektywność użytkowania
• Użytkownikowi trudno jest określić, które pliki nie są objęte kopią zapasową, ponieważ kopie zapasowe i pliki bez kopii zapasowej są obecne w galerii i dlatego są pomieszane.
• Heurystyka — zapobieganie błędom

Z problemów zidentyfikowanych podczas oceny heurystycznej wymyśliłem 2 pomysły i wybrałem ten, który miał większy zakres rozwiązania problemu.



Pomysł 1 — Miej zdjęcia, filmy, GIF-y, naklejki i dźwięk jako opcje zakładek, aby je segregować i uelastycznić wyszukiwanie typu multimediów podczas udostępniania komuś lub zapisywania ich na urządzeniu, a także dodaj sekcję u góry na niezabezpieczone pliki do identyfikacji i zapobiegania błędom.

Pomysł 2 — Oprócz pomysłu 1 posiada również filtr kart, aby wyświetlać tylko żądane karty multimediów na raz, na przykład użytkownik, który chce zobaczyć tylko karty audio i wideo, może wybrać karty audio i wideo z filtra, aby szybko znajdź te pliki.

Poszedłem do przodu z pomysłem 2, ponieważ daje on użytkownikowi elastyczność i wydajność szybkiego wyszukiwania pliku multimedialnego z dużej kolekcji plików z galerii, a także kontrolę użytkownika i swobodę filtrowania typu pliku multimedialnego, który użytkownik chce zobaczyć na ekranie w danym momencie.

Wybrany pomysł wywrze również ogromny wpływ na biznes, skracając długość sesji i liczbę porzuceń podczas wyszukiwania.

Przelewanie myśli na papier

Musiałem zwizualizować, jak moje pomysły będą wyglądać w interfejsie, dlatego zacząłem szkicować papierowe prototypy, aby lepiej zrozumieć moje pomysły.



Byłem bardzo podekscytowany, mogąc ożywić swoje pomysły za pomocą papierowych prototypów, jak widać na powyższym obrazku, stworzyłem osobne zakładki multimediów i dodałem miesięczne filtry, aby ukryć/odkryć zakładki multimediów, a także dać opcję dostępu do niezabezpieczonych pliki multimedialne użytkownikowi.

Używanie aplikacji Marvel do tworzenia prototypów było zabawne, a kiedy grałem w prototyp, czułem się niesamowicie, ponieważ moje pomysły zostały przetłumaczone z mojego umysłu na ekrany!

Uczynienie mojego prototypu tak realnym, jak to tylko możliwe (prototypy High Fidelity)

Poznanie interfejsu użytkownika i zrozumienie, jak działa interfejs, ogromnie pomogły w tworzeniu prototypów o wysokiej wierności w Figmie. Umiejętności takie jak animowane prototypowanie, odstępy i zmiana rozmiaru przydały się podczas projektowania interfejsów. Wtyczki były również ogromną oszczędnością czasu podczas procesu projektowania interfejsu użytkownika.


• Podczas przeprojektowywania interfejsu użytkownika dodałem opcje kart plików multimedialnych, takie jak Zdjęcia, Wideo, Audio, Gify i Naklejki.
• Dodano ikonę filtra, aby ukryć/odkryć karty multimediów w poszczególnych miesiącach.
• Dodano jeszcze ikonę kopii zapasowej, aby zapewnić użytkownikom opcję dostępu do plików, których kopia zapasowa jeszcze nie została utworzona
• Korzystanie z wtyczek, takich jak Unsplash do obrazów stockowych i symboli projektowania materiałów do ikon, było ogromną oszczędnością czasu.

Sprawdzanie, czy moje rozwiązania będą działać za pomocą testów użyteczności ✅

Teraz, gdy ukończyłem swoje projekty zgodnie z problemami zidentyfikowanymi podczas oceny heurystycznej.

Przetestowałem projekt z użytkownikami, aby upewnić się, że działają i poprawić to, co nie działa.

Ponieważ WhatsApp jest bardzo znaną aplikacją i prawie wszyscy jej używają,
poszedłem do 3 przypadkowych osób na siłowni, aby przeprowadzić testy użyteczności.
W testach użyteczności poszedłem do użytkowników i poprosiłem ich o wykonanie zadań, aby zrozumieć, czy mój projekt jest zrozumiały dla użytkowników i czy użytkownicy są w stanie z nich korzystać. Jeśli uważają, że ta funkcja osobiście pomogłaby im, gdyby zostały zaimplementowane w prawdziwej aplikacji, i poprosili ich o sugestie, jeśli takie istnieją.

Zadanie powierzone użytkownikom —

1) Przejdź do multimediów, linków i dokumentów z ekranu informacji kontaktowych
2) Czy możesz wyszukać określony typ pliku multimedialnego
3) Czy możesz filtrować i zobaczyć typ pliku multimedialnego, który chcesz zobaczyć
4) Czy możesz wyszukać miejsce gdzie można zobaczyć pliki, które jeszcze nie zostały zarchiwizowane

Punkty obserwacyjne —

1) Czy użytkownik jest w stanie zrozumieć podział typów plików multimedialnych?
2) Czy użytkownik może nawigować i wyszukiwać żądany typ pliku multimedialnego?
3) Czy użytkownik ma możliwość odfiltrowania określonego typu mediów?
4) Czy użytkownik ma jeszcze dostęp do plików w opcji tworzenia kopii zapasowej?
5) Sprawdź, czy użytkownik może zrozumieć, czy ikona kopii zapasowej jest szybko rozpoznawana przez użytkowników?

Wnioski i informacje zwrotne z testów użyteczności

1. Użytkownik może łatwo przechodzić z jednej karty pliku multimedialnego do drugiej
2. Użytkownik uznał tę funkcję za bardzo intuicyjną w obsłudze
3. Użytkownik uznał opcję filtrów za pomocną i łatwą w użyciu
4. Użytkownikom podobała się przemyślana opcja, która jeszcze nie została objęta wsparciem


Podczas testów użyteczności stwierdziłem, że użytkownicy uznali wszystkie funkcje zawarte w prototypie za bardzo przydatne, jednak jeden z użytkowników zasugerował również dodanie opcji filtrowania zakładek multimediów, które mają ukrywać lub odkrywać typy plików multimedialnych, a nie tylko miesięczne ale ogólnie rzecz biorąc, wystarczy jedno kliknięcie, aby zobaczyć tylko zdjęcia lub tylko gify, filmy lub naklejki ze wszystkich miesięcy.



Kluczowe wnioski

• Nie jesteśmy użytkownikami
• Idziemy i rozumiemy problemy innych
• Rozumiemy główne problemy produktu
• Rozwiązujemy również problemy związane z problemem roota
• Dobrze zdefiniowany problem jest w połowie rozwiązany
• Ważne jest, aby podczas projektowania doświadczeń brać pod uwagę cele biznesowe oprócz celów użytkownika
• Priorytetyzacja problemów i praca pod ograniczeniami są bardzo ważne
• Rozwiązywanie problemów przy pomocy zdrowego rozsądku pomaga w projektowaniu świetnych i łatwych w użyciu produktów
• Walidacja pomysłów jest niezwykle ważna, co można osiągnąć poprzez testy użyteczności