Jak zrobić diagram przepływu użytkownika

Diagramy przepływu użytkownika są niezbędne w opanowaniu user experience. Pozwalają one zrozumieć, w jaki sposób użytkownicy wchodzą w interakcję z Twoją aplikacją lub stroną internetową, jakie kroki podejmują, aby wykonać zadanie lub osiągnąć cel na Twojej stronie. Pomoże Ci to stworzyć lepsze doświadczenia użytkownika i skuteczniej zaspokoić jego potrzeby.

W tym poradniku przyjrzymy się, jak ważną rolę odgrywają diagramy przepływu użytkownika w projektowaniu UX, jak zrobić diagram przepływu oraz najlepsze praktyki, o których należy pamiętać. Przygotowaliśmy również kilka przydatnych szablonów, które możesz wykorzystać w trakcie procesu projektowania przepływu użytkowników.

Co to jest schemat przepływu użytkownika

Przepływ użytkownika może być interpretowany na wiele sposobów. Może być traktowany jako przegląd, który opisuje, gdzie użytkownicy mogą poruszać się w Twoim produkcie. Może również oznaczać rzeczywistą jakość i doświadczenie ścieżki, którą użytkownicy pokonują, aby wykonać zadanie.

Może też oznaczać rzeczywistą sekwencję kroków wykonywanych przez użytkownika w celu wykonania zadania. Schematy Schematy przepływu mogą być przydatne w wizualizacji dróg, które pokonują użytkownicy podczas korzystania z Twojego rozwiązania (np. strony internetowej lub aplikacji).

Takie narzędzia, które pomagają w wizualnym prześledzeniu etapów interakcji pomiędzy działaniami użytkownika a interfejsem programu nazywane są użytkownik diagramami przepływu lub mapami przepływu użytkownika.

Pomagają wypracować logiczną ścieżkę, którą powinien podążać użytkownik podczas interakcji z systemem, a także przedstawiają zależności pomiędzy funkcjonalnością systemu, potencjalnymi działaniami użytkownika i związanymi z nimi konsekwencjami.

Diagramy przepływu użytkownika mogą mieć różny wygląd w zależności od etapu procesu projektowania, na którym się znajdujesz. Jeśli masz już gotowe makiety swojej aplikacji lub strony internetowej, możesz je wykorzystać do stworzenia swojego flowchartu. Takie schematy przepływu nazywane są przepływami przewodowymi.

Diagramy przepływu użytkownika są również określane jako diagramy przepływu interakcji, diagramy przepływu czynności, diagramy przepływu interfejsu użytkownika, diagramy przepływu nawigacji lub diagramy przepływu zadań.

Symbole diagramu przepływu użytkownika są następujące

Symbole diagramu przepływu użytkownika
Symbole diagramu przepływu użytkownika

Zapoznaj się z tym zasobem, aby poznać więcej symboli diagramów przepływu, które mogą być przydatne podczas tworzenia diagramów przepływu użytkowników.

Znaczenie diagramu przepływu użytkownika

  • Diagramy przepływu użytkownika przydają się, gdy chcesz zrozumieć swoje projekty w oparciu o cele użytkowników.
  • Mogą być używane do komunikowania zamierzonego przepływu użytkowników, gdy poruszają się oni po stronach Twojej witryny lub poprzez działania w Twojej aplikacji
  • Inżynierowie, projektanci i architekci mogą używać ich do zrozumienia złożoności, zakresu i ścieżek projektowania systemu, jak również do identyfikacji luk, zależności i braków w nim.

Jak zrobić schemat przepływu użytkownika

Bez dalszych ceregieli omówmy, jak zrobić diagram przepływu użytkownika.

Krok 1: Zrozumieć drogę klienta

Przepływ użytkownika opiera się na tym, co robi użytkownik – dlatego zrozumienie, kim on jest, jakie są jego motywacje, potrzeby i zachowania, jest kluczowe dla stworzenia efektywnego diagramu przepływu użytkownika.

Może się to wydawać dodatkowym krokiem, ale przeprowadzenie odpowiednich badań użytkowników i zaprojektowanie person pomoże Ci stworzyć bardziej płynny przepływ użytkowników.

W jednym z wcześniejszych postów opisaliśmy już, jak tworzyć persony użytkowników. Odnieś się do niego, aby dowiedzieć się, jak stworzyć buyer persona w kilku prostych krokach. A jeśli jesteś już zaznajomiony z tym procesem, oto szablon, od którego możesz zacząć.

Szablon Persony Użytkownika
Szablon Persony Użytkownika (kliknij na szablon, aby edytować go online)

Po stworzeniu profilu klienta, jesteś o krok bliżej do zrozumienia podróży użytkownika.

Możesz wykorzystać mapę podróży klienta, aby właściwie przeanalizować, co robią, czują i czego oczekują Twoi klienci podczas interakcji z Twoją firmą (np. odwiedzając Twoją stronę internetową), różne punkty styku i punkty bólu.

Przedstawiliśmy również proces tworzenia mapy podróży klienta w 6 prostych krokach. Sprawdź to.

Reszta etapów tworzenia przepływu użytkownika będzie łatwiejsza, gdy poznasz jego podróż.

Określ swoje cele i cele użytkownika

Następnym krokiem jest zapoznanie się z celami Twojej firmy, jak również z celami Twoich użytkowników.

Być może znasz już cele swojej firmy, np. zwiększenie konwersji na stronie internetowej, zwiększenie sprzedaży produktu itp. Jest to zazwyczaj końcowy rezultat działań, które chcesz, aby użytkownicy podjęli.

Z drugiej strony, cele Twoich użytkowników obejmują pragnienia i potrzeby, które chcą zaspokoić. Również różni użytkownicy mogą mieć różne cele. To właśnie w tym miejscu pomogą Ci stworzone wcześniej mapy podróży klienta (user personas).

Zidentyfikuj skąd przychodzą Twoi użytkownicy

Jeśli projektujesz stronę internetową, możesz chcieć wiedzieć, skąd przychodzą Twoi klienci lub innymi słowy, jakie są punkty wejścia. Zwykle obejmują one,

  • Ruch bezpośredni
  • Wyszukiwanie organiczne
  • Media społecznościowe
  • Reklama płatna
  • E-mail
  • Strony polecające
  • Artykuły prasowe lub wiadomości

Możesz użyć Google analytics, aby uzyskać procenty dla tych punktów wejścia. Mogą one również wskazywać na różne zachowania użytkowników.

Na przykład, bezpośredni odwiedzający wyszukałby nazwę Twojej marki, podczas gdy odwiedzający z wyszukiwania organicznego najpierw wyszukałby w Google produkt, którego potrzebuje, zanim odkryłby, że jesteś odpowiednim sprzedawcą.

I ważne jest, aby odwzorować te różne przepływy użytkowników w oparciu o różne punkty wejścia. Jest to klucz do tworzenia lepszych doświadczeń dla użytkowników.

Zidentyfikuj informacje, których potrzebuje odwiedzający

Aby zaprojektować najlepszy możliwy przepływ użytkownika, musisz wejść w buty swoich klientów.

Oznacza to zrozumienie ich potrzeb i motywacji na pamięć. Musisz więc wiedzieć, jakie mają problemy, wątpliwości, wahania, jakie mają pytania dotyczące produktu i jakich odpowiedzi szukają.

Ponieważ stworzyłeś już swoje buyer personas i mapę podróży, ten krok jest łatwiejszy do wykonania.

Wizualizacja przepływu użytkowników

Teraz już wiesz, dla jakich użytkowników tworzysz przepływ użytkownika, jakie są ich cele i skąd przychodzą. Kolejnym krokiem jest stworzenie przepływu użytkownika.

Zastanów się, co robią Twoi użytkownicy przed i po wejściu na daną stronę w Twoim serwisie. Co widzą, jakie działania podejmują, aby osiągnąć swój cel. Pomoże Ci to zidentyfikować strony, które musisz stworzyć, jakie informacje/treści musisz dostarczyć i jak powinny być one ze sobą połączone.

Zwróć uwagę na początek i koniec każdego zadania. Może to ulec zmianie w zależności od celów różnych użytkowników.

Po odfiltrowaniu niezbędnych informacji, zwizualizuj je za pomocą diagramu przepływu użytkownika.

Diagram przepływu użytkownika
Diagram przepływu użytkownika (kliknij na szablon, aby edytować go online)

Prototypuj swój przepływ

Możesz użyć prototypów niskiej wierności(wireframes lub UI mockups), aby przetestować przepływ użytkownika nakreślony w poprzednim kroku. Prototyp pomaga dodać więcej szczegółów do przepływu i pomóc zrozumieć przepływ między działaniami użytkownika a treścią.

Pomoże Ci to również zweryfikować, czy Twój produkt został zaprojektowany zgodnie z celami Twoimi i Twoich użytkowników.

Przeglądaj, udoskonalaj i testuj

Możesz podzielić się diagramami przepływu użytkowników z interesariuszami i przedyskutować, gdzie należy wprowadzić poprawki.

A kiedy prototyp jest już gotowy, możesz go przetestować z rzeczywistymi użytkownikami.

W ten sposób możesz zbierać dane na temat każdego kroku przepływu użytkownika i zrozumieć, w jaki sposób użytkownicy poruszają się po Twoim produkcie. Można wtedy zidentyfikować obszary wymagające poprawy i zastosować rozwiązania przed wypuszczeniem produktu końcowego.

Najlepsze praktyki, o których należy pamiętać

Trzymaj się najlepszych praktyk poniżej, aby upewnić się, że diagramy przepływu użytkownika, które tworzysz, są rzeczywiście skuteczne w pomaganiu Ci.

  • Zawsze nadawaj swojemu diagramowi przepływu użytkownika nazwę, która opisuje jego cel. Pomoże to każdemu, kto się na nią powoła, zrozumieć jej podstawy.
  • Podczas rysowania schematu przepływu trzymaj się jednego kierunku. Ponieważ plansza przedstawia historię, pomaga lepiej ją odczytać i zrozumieć, gdy mapa płynie w jednym kierunku.
  • Ogranicz liczbę punktów decyzyjnych, aby nie było bałaganu/ mniej skomplikowane.
  • Upewnij się, że zakres diagramu przepływu użytkownika obejmuje pojedyncze zadanie lub pojedynczy cel Twojego użytkownika. Jeśli przepływ użytkownika obejmuje tylko połowę zadania lub mapuje kroki obejmujące więcej niż jeden cel użytkownika, nie będzie spełniał swojej roli.
  • Upewnij się, że dodajesz tylko niezbędne informacje i unikasz wszelkich innych szczegółów, które nie pomogą Ci opisać przepływu i działań użytkownika.
  • Użyj cyfrowego narzędzia do tworzenia schematów blokowych, takiego jak Creately, aby przyspieszyć proces. Dodatkowo, pozwoli Ci to uzyskać wkład innych i zachować swoją pracę zapisaną w jednym miejscu i w chmurze, co pozwoli Ci odnosić się do niej i pracować nad nią z dowolnego miejsca. Co więcej, pomoże Ci zaoszczędzić miejsce dzięki nieskończonej powierzchni płótna; w przeciwnym razie może zająć kilka ścian Twojej sali konferencyjnej!

Szablony diagramów przepływu użytkownika

Schemat przepływu rejestracji użytkownika
Schemat przepływu rejestracji użytkownika (kliknij na szablon, aby edytować go online)
Przykładowy schemat przepływu
Przykładowy schemat przepływu (kliknij na szablon, aby edytować go online)
Przepływ użytkowników Przepływ przewodów
Wireflow Template (Kliknij na szablon, aby edytować go online)

Gotowy do stworzenia własnego diagramu przepływu użytkownika?

Przepływy użytkownika są potężnym narzędziem w zestawie narzędzi projektanta. Ułatwiają one projektantom dostrzeżenie całościowego obrazu – jakie strony muszą stworzyć i jak powinny być ze sobą połączone. Omówiliśmy już wszystko, co musisz wiedzieć, aby stworzyć diagram przepływu użytkownika – w tym szablony, które możesz wykorzystać, aby zacząć od razu.

Teraz chcielibyśmy poznać Twoją opinię na temat diagramów przepływu użytkownika? Napisz w sekcji komentarzy poniżej.

Leave a comment

*
*

15 − 10 =

Back to top