Na czym polega prototypowanie w UX?
Spis treści:
Czym jest prototyp?
Prototyp to wstępny model produktu, który umożliwia jego testowanie. W kontekście UX, prototypy są używane do zrozumienia i testowania interakcji, struktury oraz ogólnego przepływu aplikacji lub strony internetowej.
Prototypy to sposób na przedstawienie swoich pomysłów współpracownikom, klientom oraz użytkownikom w formie wizualnej.
Mogą przyjmować różne formy – od zwykłych papierowych modeli po bardzo skomplikowane, które mogą zostać użyte na docelowym urządzeniu. Prototypy dają życie pomysłom, przez co pozwalają je przetestować. Zobaczysz, co działa dobrze, a co wymaga poprawy. A wszystko to zrobisz szybko i przy jak najmniejszych nakładach finansowych.
Prototypy tworzy się zarówno dla produktów fizycznych, jak i cyfrowych.
Przykładem produktu fizycznego może być kartonowy model budynku stworzony przez architekta. Dzięki temu projektant może zobaczyć, jak w rzeczywistości wygląda obiekt, czy jest zgodny z założeniami. Produkt otrzymuje kształt, przez co łatwiej jest go zrozumieć i rozwijać. Dla produktu cyfrowego już sam szkielet można uznać za prototyp. W końcu jest to pierwsza fizyczna forma prezentacji produktu. Prototypy produktów cyfrowych mogą przybierać formę od prostych szkiców, po prototypy udostępnione w sieci obsługujące kliknięcia.
Kiedy najlepiej tworzyć prototypy?
O tym, czy musisz tworzyć prototyp decydują dane wyjściowe, jakie musisz przygotować w ramach projektu. Inne prototypy będą potrzebne dla witryn, a inne dla aplikacji mobilnej.
Jest wiele przydatnych narzędzi do tworzenia prototypów. Na ogół nie wymagają one zaawansowanych umiejętności z zakresu programowania i pozwalają w łatwy i szybki sposób tworzyć prototypy. Dzięki temu można je z powodzeniem wykorzystać w testach. Są bardziej realistyczne niż statyczne strony bez działających odnośników.
Rodzaje prototypów
- Papierowe Prototypy: Najprostsza forma, rysunki na papierze pokazujące główne elementy interfejsu.
- Cyfrowe Prototypy: Utworzone za pomocą narzędzi do projektowania, takich jak Sketch, Figma czy Adobe XD.
- Interaktywne Prototypy: Umożliwiają symulację rzeczywistych interakcji, są bliższe końcowemu produktowi.
Wskazówki dla skutecznego prototypowania
- Zacznij od Niskiego Poziomu Wierności: Szkice na papierze mogą być równie efektywne, co cyfrowe prototypy.
- Zaangażuj Użytkowników: Prototypowanie jest najskuteczniejsze, gdy użytkownicy są włączeni w proces.
- Nie Boj Się Błędów: Celem prototypowania jest nauka i iteracja, nie dążenie do perfekcji.
Proces Prototypowania: Krok po Kroku
W erze cyfrowej, tworzenie skutecznego interfejsu użytkownika wymaga nie tylko świetnego projektowania, ale także skrupulatnego testowania. Prototypowanie odgrywa kluczową rolę w tym procesie, pomagając projektantom zobaczyć, jak ich koncepcje będą funkcjonować w praktyce. Zrozumienie procesu prototypowania od początku do końca jest kluczem do sukcesu każdego projektu.
a) Zdefiniuj Cel
Pierwszym krokiem w prototypowaniu jest zrozumienie, co dokładnie chcesz osiągnąć.
- Wizualizacja Idei: Czy chcesz tylko pokazać, jak produkt będzie wyglądał, czy też jak będzie działał?
- Testowanie Interakcji: Czy chcesz sprawdzić, jak użytkownicy będą wchodzić w interakcję z Twoim produktem?
- Sprawdzenie Funkcjonalności: Czy chcesz przetestować określone funkcje produktu?
b) Wybierz Narzędzia
Wybór narzędzia do prototypowania zależy od Twojego celu i poziomu szczegółowości, jakiego potrzebujesz.
- Papierowe Prototypy: Idealne do wstępnych pomysłów i szkiców.
- Narzędzia Cyfrowe: Takie jak Figma, Adobe XD, czy Sketch, które są idealne do tworzenia bardziej zaawansowanych i interaktywnych prototypów.
c) Stworzenie Prototypu
Za pomocą wybranych narzędzi i informacji zebranych podczas badań i fazy projektowania, zacznij tworzyć swój prototyp.
- Zacznij od Struktury: Określ główne elementy i jak będą się ze sobą komunikować.
- Dodaj Detale: Wprowadź kolory, teksty, obrazy i inne elementy, które sprawią, że prototyp będzie wyglądać jak rzeczywisty produkt.
d) Testowanie
Po stworzeniu prototypu nadszedł czas, aby go przetestować.
- Rekrutacja Uczestników: Znajdź osoby, które będą reprezentować Twoją grupę docelową.
- Obserwacja i Zbieranie Danych: Obserwuj, jak uczestnicy korzystają z prototypu, i zbieraj informacje zwrotne.
- Analiza Wyników: Sprawdź, które elementy działają dobrze, a które wymagają poprawy.
e) Iteracja
Bazując na zebranym feedbacku, dokonuj niezbędnych zmian w prototypie.
- Wnioski z Testowania: Określ główne problemy, które użytkownicy mieli z prototypem.
- Dokonaj Korekt: Wprowadź poprawki do prototypu, uwzględniając zebrany feedback.
- Powtórz Proces: Po wprowadzeniu zmian, powtórz testowanie, aby upewnić się, że wszystkie problemy zostały rozwiązane.
Wady i zalety prototypów
Prototypy cieszą się ogromną popularnością wśród specjalistów UX. Prototypy tworzy się tanio, szybko i w ciekawy sposób można przedstawić swoje pomysły, które dzięki nim ożywiają. W zależności od kontekstu projektu, prototypy mogą być proste albo bardzo złożone. Są doskonałym materiałem do wykorzystania w testach użyteczności. Jak każda technika, tak i ta posiada jednak nie tylko zalety, ale również wady.
Zalety prototypów:
- Szybko i łatwo się je przygotowuje – wystarczy Ci kartka papieru i długopis, aby szybko zaprezentować swój pomysł. Do tworzenia prototypów możesz zaangażować użytkowników. Każdy może przekazać swoje uwagi i zaproponować rozwiązania. Jest to etap, w którym pomysł jest rozwijany i każdy może dorzucić swoje sugestie.
- Sprawdzenie, czy pomysł podoba się użytkownikom – tworzenie prototypów to nadawanie pomysłowi konkretnej postaci. Teraz tak naprawdę można się przekonać, czy uzyska się aprobatę użytkowników. Jeśli prototyp nie do końca spodoba się użytkownikom, to uzyskasz informację zwrotną na temat tego, co stanowi problem, co wymaga poprawy. Im wcześniej się tego dowiesz, tym lepiej, a prototypy są najlepszą do tego okazją. Mając do czynienia z prototypem, użytkownik może dokładnie ocenić pomysł, a projektant zobaczyć, czy użytkownik wykonuje pożądane działania.
- Zobaczysz, jakie są problemy projektowe – na etapie samego pomysłu nie dowiesz się tego, a teraz, jeśli się one pojawią, musisz jakoś je rozwiązać.
- Przekonasz się, czy dane rozwiązanie się sprawdzi – załóżmy, że aplikacja będzie posiadała nowatorski interfejs. Taki, jakiego jeszcze nigdzie nie było. Można powiedzieć, że jest to pionierski pomysł. W jaki inny sposób można się przekonać, czy zyska on aprobatę użytkowników i czy sobie z nim poradzą? Najlepiej jest przedstawić go w formie prototypu i poprosić użytkowników o przetestowanie.
- Klient w pełni zrozumie pomysł – w przypadku szkieletów nie zawsze wiadomo, czy klient w pełni zrozumiał to, co projektant miał na myśli. W przypadku prototypów wszystko jest jasne. Prototypy są oczywiste, konkretne, można je używać i eksperymentować. Każdy powinien bez problemu je zrozumieć, dodać swoje uwagi czy zwrócić uwagę na problemy i zaproponować rozwiązania.
- Jakość prototypów zachęca do dzielenie się opiniami – prototypy na ogół nie wyglądają elegancko. I bardzo dobrze. O to w tym chodzi. Mają wyglądać jak projekt, nad którym właśnie trwają pracę. Wtedy łatwiej jest użytkownikom wyrażać swoje opinie, zarówno te dobre, jak i te negatywne. Projektantowi też zależy na szczerej ocenie, żeby wiedział, co jeszcze ma przed sobą do zrobienia.
- Projektowanie dynamicznych interfejsów wymaga prototypów – projektowanie dynamicznych interfejsów to nie tylko ustalenie treści i przedstawienie jej na stronie. Takie interfejsy oddziałują z użytkownikami. Zatem wszystkie interakcje interfejsu z użytkownikami należy wcześniej odpowiednio przetestować. Prototypy nadają się do tego doskonale.
- Dostęp do darmowych narzędzi do tworzenia prototypów – aby stworzyć prototyp nie musisz wydawać na to żadnych pieniędzy. Jest wiele doskonałych narzędzi, dzięki którym szybko i łatwo stworzysz prototypy.
- Dostęp do darmowych szablonów prototypów – gotowe szablony jeszcze bardziej ułatwiają pracę nad prototypami. Nie musisz tracić dużo czasu na ich przygotowanie, tylko możesz wybrać już gotowy szablon. Zaoszczędzony czas możesz w pełni wykorzystać na zaprojektowanie jak najlepszego user experience.
Wady prototypów :
- Rozwijanie prototypów wymaga czasami dużo czasu – przygotowanie prototypów wymaga więcej czasu, niż przygotowanie szkieletów, szczególnie, jeśli prototypy maja zawierać dużo interakcji, a szkielety były tylko statyczne. Samo zaplanowanie prototypów i oszacowanie czasu na ich przygotowanie już jest czasochłonne. Możesz ułatwić sobie całą pracę zaczynając od przygotowania mapy projektowanej witryny. Zastanów się, które strony i interfejsy są najbardziej skomplikowane. Od nich zaczniesz pracę. Miej także na uwadze strony, które są na drodze w głównych ścieżkach użytkownika. Nimi też musisz się zająć w pierwszej kolejności.
- Poprawianie prototypów wymaga czasami dużo czasu – kiedy otrzymasz informacje zwrotne od klientów, użytkowników i współpracowników, możesz zebrać wszystkie dane razem. Zobacz, czy coś się powtarza. Jeśli większość osób wskazała określony obszar jako problematyczny, to znaczy, że musisz coś z tym zrobić. I tutaj mogą pojawić się problemy, bo poprawianie błędów bywa niezwykle uciążliwe. Może się okazać, że jakiś kłopot jest ukryty w zaawansowanej funkcji i rozłożenie jej na czynniki pierwsze, przeanalizowanie i ponowne odtworzenie bywa nie tylko czasochłonne, ale i uciążliwe.
- Prototypy mogą prezentować się nieelegancko – chociaż brak elegancji prototypów został uznany jako ich zaleta, to może być także jednocześnie ich wadą. Jeśli ktoś włożył dużo pracy w przygotowanie prototypów, to chciałby, żeby prezentowały się dobrze. Brak estetyki może być przez niektórych odbierany jako zbyt mały wkład w przygotowanie prototypów. Najprościej mówiąc, możesz zostać posądzony, że nie przyłożyłeś się do pracy i tylko „odwaliłeś” robotę. Szczególnie, jeśli wcześniej prezentowałeś atrakcyjne i dopracowane szkielety. Nie przejmuj się jednak tym za bardzo. Dopracuj merytorycznie prototypy, aby nikt Ci niczego nie zarzucił.
- Trudno oszacować czas projektowania i programowania tylko na podstawie prototypów – wynika to z faktu istnienia wielu ukrytych paneli, warstw i interfejsów, które są widoczne tylko po wystąpieniu określonych zdarzeń. Problem można rozwiązać poprzez dodanie na początku HTML-owego prototypu kompletnego indeksu reagującego na kliknięcia. Wtedy zakres prototypu będzie dla wszystkich zrozumiały i oczywisty.
Tworzenie prototypów
W tworzeniu prototypów piękne jest to, że możesz wszystko. Oczywiście „wszystko” zależy od Twoich umiejętności, rodzaju projektu, czasu oraz dostępnych środków finansowych. Prototypy możesz tworzyć na zwykłej kartce, za pomocą specjalistycznych narzędzi, a jeśli potrafisz programować, to możliwości są nieograniczone.
Sposoby tworzenia prototypów:
- Szkicowanie – niektórym może się to wydać dziwnym pomysłem, ale szkicowanie na zwykłej kartce papieru sprawdza się w wielu przypadkach. Już przecież tworzyłeś szkice i szkielety to dlaczego nie wykorzystać zwykłej kartki i długopisu w tworzeniu prototypów? Jest to najbardziej dostępna metoda, a do tego niezwykle szybka i tania. Szkicowanie prototypów stosuje się na wczesnych etapach projektu, aby analizować pomysły odnośnie interfejsów, ich cech, treści i funkcji. Papierowe wersje prototypów sprawdzają się w trakcie przeprowadzania testów użyteczności – użytkownicy mogą bezpośrednio ich dotykać, symulując kliknięcie i bezpośrednio na papierze mogą być wprowadzane poprawki.
- Generowanie prostych prototypów za pomocą narzędzi – specjalistyczne narzędzia można wykorzystać do szybkiego generowania zarówno prostych, jak i bardziej złożonych prototypów. Wystarczy Ci PowerPoint, ale równie dobrze możesz skorzystać z takich narzędzi jak Keynote czy Balsamiq.
- Generowanie zaawansowanych prototypów za pomocą narzędzi – zaawansowane prototypy można stworzyć za pomocą narzędzia Axure i innych tego typu podobnych. Prototypy stworzone w tych narzędziach są bardzo podobne do ostatecznej wersji produktu. Obchodząc się z nimi użytkownicy maja podobne wrażenia, jak w przypadku korzystania z prawdziwego produktu. Część interakcji w prototypach jest symulowana, ale wynika to tylko z faktu, że prototypy nie są połączone z prawdziwą baza danych. Prototypy są idealne do badań z udziałem użytkowników.
- Generowanie prototypów dla urządzeń mobilnych – w tym przypadku możesz skorzystać z narzędzia Proto.io lub innych podobnych tego typu. Narzędzie umożliwia tworzenie aplikacji na iPhone’y oraz iPady. Proto.io jest narzędziem internetowym i wymaga szybkiego łącza. Dla zwolenników bardziej tradycyjnych programów poleca się Keynote. Natomiast za pomocą LiveView wyświetlisz prototypy na urządzeniach mobilnych.
- Generowanie prototypów za pomocą kodu – jeśli tylko umiesz programować, to możesz skorzystać z tej metody tworzenia prototypów. Uzyskasz w ten sposób materiały, które wykorzystasz później podczas tworzenia frontonu aplikacji lub witryny. Programując, tworzysz prototyp, który naprawdę działa. Tą metodę poleca się doświadczonym programistom. Osoby początkujące mogą mieć jeszcze wiele problemów, a liczy się czas, którego nie należy marnować. Jeśli dopiero zaczynasz przygodę z programowaniem, skorzystaj z innych metod tworzenia prototypów.
Dlaczego prototypowanie jest ważne?
- Iteracja: Dzięki prototypowaniu możemy szybko wprowadzać zmiany i udoskonalenia w projekcie.
- Zrozumienie Użytkownika: Prototypy pozwalają obserwować, jak użytkownicy radzą sobie z danym rozwiązaniem.
- Zmniejszenie Ryzyka: Lepiej jest zidentyfikować problemy na etapie prototypowania niż po wdrożeniu końcowego produktu.
