Tworzenie diagramów i makiet to część mojej pracy, którą klienci widzą i oceniają. Celem jest zmaterializowanie wizji, którą mam w głowie i pokazanie jej innym. Co najważniejsze, pokazując makietę otrzymuję informację zwrotną czy to nad czym pracujemy przybiera pożądany kształt.
Jedną z wad makiet jest to, że nie mówią nam jak coś będzie działało. Co stanie się jeśli kliknę w ten przycisk? Wyskoczy okienko? Rozwinie się treść? A może powinien wyjść ogromny pająk i pożreć stronę? Z pomocą przychodzi prototypowanie.
Prototypowanie to nic innego jak dodanie szczypty interaktywności do makiet. Nie musisz wiele zmienić w swoim podejściu. Korzystasz z długopisu i kartki? Zostań przy nich — prototyp można zrobić za pomocą większości narzędzi, z których już korzystasz. Generalnie chodzi o to by za pomocą prototypu pokazać co stanie się w konkretnym przypadku: najechaniu kursorem na link, kliknięciu w przycisk formularza, itd.
Kiedy prototypować?
To zależy. Wychodzę z założenia, że prototyp ma pomóc w wyjaśnieniu działania najbardziej skomplikowanych elementów. Głównie tych, które wymagają interakcji z użytkownikiem: formularze, rozwijane listy, wyskakujące okienka, itd. W większości przypadków nie ma sensu tworzyć prototypu całego projektu.
Dlaczego tworzymy prototypy?
- Ponieważ słowami nie da się opisać większości rzeczy w zrozumiały dla drugiej osoby sposób. Przekonałem się o tym wielokrotnie.
- Klient lepiej zrozumie co powstanie. Dzięki temu w 99% przypadków nie ma niespodziewanych zmian w momencie wdrażania projektu.
- Jest nam łatwiej wykryć słabe strony wymyślonego rozwiązania. Nieraz zdarzało mi się zmienić zdanie po obejrzeniu prototypu w akcji. To świetne narzędzie do testowania użyteczności!
Jak prototypować?
Ograniczę się do jednego z wypracowanych rozwiązań.
- W MindMeister tworzę strukturę serwisu. Czasami, przy bardziej skomplikowanych projektach korzystam z innych narzędzi. Ale cel jest zawsze ten sam: mieć widok z góry na projekt.
- Następnie tworzę makiety najważniejszych stron serwisu. Robię to za pomocą tabletu i specjalnie przygotowanego szablonu w Photoshopie. Rozrysowuję wszystkie stany interakcji, które chcę pokazać w prototypie.
- Na bazie wcześniej przygotowanych składników tworzę szablony HTML. Jest ich tyle co stanów, które chcę pokazać. W szablonie umieszczam wyeksportowany z Photoshopa plik JPG i linkuję go do kolejnego szablonu. W ten sposób imituję interaktywność.
- Tak przygotowany prototyp wysyłam na serwer — mogę go otworzyć w przeglądarce na spotkaniu lub przesłać link do niego przed rozmową telefoniczną.
Oczywiście są narzędzia typu Axure, które mają bardziej rozbudowane możliwości. Papier, nożyczki i cienkopisy też są świetnym rozwiązaniem… W książce Prototyping: A Practitioner’s Guide znajduje się solidny opis narzędzi do prototypowania.
Comments 1
Ja obecnie prototypuję na płatnym narzędziu iplotz, chwalę sobie ale chyba można na rynku znaleźć coś ciekawszego, z darmowych rozwiązań polecam Lumzy, bardzo fajne narzędzie. Długi czas i kilka sporych projektów zrealizowałem na gomockingbird i bardzo miło wspominam ten soft, na iplotz zdecydowałem się bo gomockinbird nie miał wersji desktopowej. Ale tak naprawdę to Power Point i czy Excel tez sprawdzają się w roli oprogramowania to prototypowania i zgodzę sie z autorem że takie praktyki bardzo oszczędzają czas pracy z klientem i tłumaczeniem jak to będzie działać