W czasie opracowywania kreatywnych koncepcji, np. produktów, wykonujemy różnego rodzaju artefakty pośrednie, m.in. szkice, makiety, prototypy itd. Dla większości z nas jest to oczywiste i naturalne – tak jest po prostu łatwiej pracować. W prototypowaniu jest też coś intuicyjnego, spontanicznego, podobnie jak w doodlowaniu na marginesie zeszytu np. w trakcie wykładu czy rozmowy telefonicznej. Rzadko jednak zastanawiamy się nad celowością takiego działania – po co robić prototypy? Jakie są korzyści z prototypowania? W artykule spróbujemy odpowiedzieć na te pytania, a jednocześnie zastanowimy się nad znacznie ważniejszą i ciekawszą kwestią – czy opracowywanie prototypów, czyli prototypowanie, ma wpływ na kreatywność? Aby odpowiedzieć na to pytanie wyjaśnimy czym jest reprezentacja zewnętrzna i jaki ma wpływ na twórcze poznanie. Opowiemy także krótko o tym czym jest prototyp, o testowaniu prototypów oraz o niektórych wadach i zaletach poszczególnych ich rodzajów – szkieletów, makiet oraz prototypów generowanych za pomocą kodu.

Co to jest prototyp

Prototyp to pierwowzór czegoś (PWN). Prototyp jest formą uzewnętrznienia naszych pomysłów i koncepcji. Z zasady prototypy mają w sobie coś niedoskonałego – to protoidea przeniesiona do świata zmysłów – przelana na papier, gdzie „papierem” może być w zasadzie każde tzw. tworzywo twórczości, w tym dotyk, dźwięk, zapach i smak. Zarówno prototypy, jak i pomysły stanowiące fundament ich powstania mogą podlegać zmianom – modyfikacjom i obróbkom.

Prototypy możemy uporządkować ze względu na stopień ich wierności – na ile dokładnie oddają twórczy zamysł, tj. wizję projektantów produktu. W tym ujęciu wyróżnić możemy m.in. prototypy papierowe i prototypy o niskiej wierności (low fidelity), prototypy o średniej wierności (medium fidelity) oraz prototypy o wysokiej wierności (high-fidelity). Prototyp papierowy to najczęściej po prostu rysunek. Natomiast prototypy o wysokiej wierności mogą być nieodróżnialne od rzeczywistych produktów, a przynajmniej nie na pierwszy rzut oka.

Prototypy można wykonać z każdego twórczego tworzywa, np. z klocków Lego.

Po co tworzyć prototyp produktu? 

Zacznijmy od pierwszego pytania – w jakim celu opracowuje się prototypy. Do najczęściej wspominanych w literaturze naukowej przyczyn prototypowania (prototyping objectives) należą następujące cztery (Bradley i in., 2017):

1. Udoskonalanie projektu (design refinement) – stopniowego ulepszania projektu
2. Komunikacja (communication) – udostępnianie informacji o projekcie produktu i jego potencjalnym zastosowaniu w zespole projektowym i użytkownikom,
3. Eksploracja (exploration) – poszukiwanie nowej koncepcji projektowej,
4. Aktywne uczenie się (active learning) – zdobywanie nowej wiedzy o przestrzeni projektowej (design space) lub związanych z nią zjawiskach.

Chociaż zaproponowany przez naukowców podział jest szczegółowy i użyteczny, my w artykule przyjmiemy perspektywę nieco bliższą praktyce. Najogólniej rzecz ujmując, prototypy tworzone są z przynajmniej dwóch podstawowych przyczyn (rysunek 3).

1. Prototyp jako element procesu twórczości

Po pierwsze, opracowywanie prototypu jest elementem procesu kreatywności – tworzenia konceptu. Tworząc prototyp porządkujemy myśli, konkretyzujemy pomysły i krystalizujemy twórczą wizję produktu. Prototyp jest również instrumentem współpracy i medium komunikacji – dzięki niemu możliwa jest względnie precyzyjna interpretacja pomysłów innych uczestników twórczego działania oraz wypracowanie kolektywnego konsensusu. Ponadto, sam prototyp, jako tworzywo twórczości, może stymulować twórcze myślenie – podpowiadać nowe pomysły, ale jednocześnie ujawniać ukryte ograniczenia kreatywności, np. techniczne czy koncepcyjne. Tym samym, zarówno sporządzony artefakt, jak i sam proces jego opracowywania mogą pobudzać kreatywność – procesy myślenia dywergencyjnego i konwergencyjnego (o których przeczytasz tutaj).

2. Prototyp jako element weryfikacji

Po drugie, opracowany prototyp może być przedmiotem testów i badań. Dzięki prototypom dowiadujemy się na ile nasze pomysły i rozwiązania są wartościowe i użyteczne z technicznego i biznesowego punktu widzenia – czy są wykonalne, opłacalne, a przede wszystkim, czy ktoś będzie chciał z nich korzystać i za nie zapłacić. Wnioski z testów i badań stanowią podstawę dla dalszych udoskonaleń produktu, jak również podpowiadają kolejne kroki w procesie jego rozwoju.

Prototyp jako reprezentacja zewnętrzna

Aby zrozumieć dlaczego prototyp może stanowić integralny element procesu tworzenia i dlaczego sprzyja twórczemu poznaniu, musimy wprowadzić pojęcie zaczerpnięte ze słownika psychologii – pojęcie reprezentacji.

Wyróżnia się dwa rodzaje reprezentacji – reprezentacje wewnętrzne i zewnętrzne.

Reprezentacja poznawcza wewnętrzna definiowana jest jako umysłowy odpowiednik obiektów – zarówno realnie istniejących, jak fikcyjnych lub hipotetycznych (Nęcka i in., 2022). Obiektem reprezentacji może być np. przedmiot, koncepcja, idea, teoria, hipoteza, relacja, osoba, kategoria, zasób wiedzy osobistej itd. Reprezentacja wewnętrzna zastępuje swój obiekt (obiekt, który reprezentuje) w procesach przetwarzania informacji; myśląc o odbijaniu piłki nie manipulujemy w umyśle rzeczywistym przedmiotem, a jedynie pewnym jego przedstawieniem – reprezentacją.

Reprezentacje wewnętrzne uczestniczą w procesach rozwiązywania problemów, także otwartych. Na przykład w toku rozwiązywania problemu w umyśle tworzone są struktury przedtwórcze czy struktury próbne, którymi mogą być np. obrazy umysłowe lub utworzone na próbę pojęcia. Są to struktury ułatwiające twórcze rozwiązanie problemu dzięki przybliżeniu nas do idealnego, na razie nieosiągalnego stanu docelowego (Nęcka i in., 2020) – pisaliśmy na ten temat tutaj.

Natomiast reprezentacja zewnętrzna stanowi uzewnętrznienie (eksternalizację) reprezentacji wewnętrznej – jest to ikoniczna lub symboliczna ekspresja wewnętrznych reprezentacji, która służy przede wszystkim opisowi, wyjaśnieniu i komunikowaniu struktury, działania czy relacji między obiektami (Rybska, 2018). Reprezentacja zewnętrzna to m.in. szkice i rysunki, diagramy, wykresy, animacje, modele (np. akustyczne, kinestetyczne, wizualne) itd. Opracowując diagram przepływu pracy lub szkielet interfejsu użytkownika (wireframe) stwarzasz właśnie reprezentację zewnętrzna – odzwierciedla ona Twoją umysłową reprezentację wewnętrzną procesu przepływu pracy lun – w drugim przykładzie – architektury interfejsu użytkownika.

Reprezentacje zewnętrzne a możliwości poznawcze

Reprezentacje zewnętrzne zwiększają nasze możliwości poznawcze na wiele różnych sposobów, m.in. odciążają pamięć krótko- i długotrwałą, odciążają umysłową aktywność poznawczą przez wyprowadzenie części operacji na zewnątrz, redukują złożoność problemu poznawczego, pozwalają na tworzenie struktur o dowolnej złożoności, ułatwiają proces reprezentowania itp. (Wachowski, 2014; Kirsh, 2014). Innymi słowy, dzięki reprezentacjom zewnętrznym możemy przetwarzać wydajniej i skuteczniej niż w sytuacji, gdy działamy tylko wewnątrz naszych głów.

Reprezentacje zewnętrzne a kreatywność

Jednak z punktu widzenia kreatywności i twórczego poznania na szczególną uwagę zasługują również inne cechy reprezentacji zewnętrznych (Wachowski, 2014; Kirsh, 2014):

Reprezentacje zewnętrzne są często lepszym nośnikiem myśli, idei, pomysłu
Przykładowo, rysunek koncepcyjny produktu jest dalece bardziej dokładny niż ogólne i najczęściej mgliste (niepełne) o nim wyobrażenie.

Reprezentacje zewnętrzne są pozwalają̨ myśleć o rzeczach nie do pomyślenia
Wykorzystując reprezentacje zewnętrzne możemy zaprojektować model funkcjonalny produktu o złożoności przekraczającej możliwości operacyjne naszego umysłu (czysto mentalnie).

Reprezentacje zewnętrzne lepiej służą kreatywnemu bodźcowaniu niż wewnętrzne
Proces opracowywania reprezentacji jest interaktywny, przyrostowy i bogaty w podpowiedzi, wskazówki, widoczne możliwości oraz niemożliwości, które prymują całe konstelacje nowych możliwości. Innymi słowy, wchodząc w interakcję z reprezentacją zewnętrzną, np. modelem wizualnym, w trakcie jego opracowywania, dostrzegamy zupełnie nowe możliwości działania, a sam model może stanowić obfite źródło nowych pomysłów.

Reprezentacje zewnętrzne ułatwiają lub wręcz umożliwiają pracę zespołową
Wszyscy uczestnicy zespołu mają przed sobą ten sam obiekt, np. diagram przepływu danych, a nie różne o nim wyobrażenia. Reprezentacja zewnętrzna ułatwia także integrowanie wiedzy z różnych dziedzin i stymuluje kreatywność kolektywną, o której pisaliśmy tutaj.

Reprezentacje zewnętrzne wyznaczają kierunki eksperymentowania
Opracowując prototypy wyznaczmy jednocześnie dalsze kierunki eksperymentowania i budujemy nowe przestrzenie badawcze – definiujemy nowe tereny dziedzin badawczych (Zahorodna, 2015).

Podsumowując, prototyp, rozumiany jako forma reprezentacji zewnętrznej, wpływa korzystnie na nasz system poznawczy, np. odciąża pamięć i obliczenia, ale jednocześnie pozytywnie stymuluje kreatywność, w tym kreatywność kolektywną. Warto podkreślić, że korzystny wpływ ma zarówno sam artefakt (obiekt), jak i proces jego opracowywania (działanie).

Prototyp a testy i badania

Zastanówmy się teraz nad drugą przyczyną tworzenia prototypów – testy i badania. W jaki sposób należy tworzyć prototyp, aby nadawał się on do testów. Oczywiście, każda sytuacja jest wyjątkowa a stopień dokładności i charakter prototypu zależy od potrzeb i kontekstu. Jednak można wskazać tutaj kilka przydatnych zasad (Knapp i in., 2016).

Prototypy muszą odpowiadać celom poznawczym

Musisz dokładnie określić cele poznawcze, czyli to czego chcesz się dowidzieć przeprowadzając testy z użyciem prototypu. Charakter prototypu, materiał z którego zostanie wykonany i stopień jego wierności będą ukierunkowywać odpowiedzi (informacje zwrotne) użytkowników. Całkiem inny efekt uzyskasz budując prototyp z klocków Lego, inny drukując na drukarce 3D, a inny wykonując go z docelowych materiałów.

Stwórz tylko tyle, by się czegoś nauczyć, nie więcej

Większość metodyk zwinnych (Lean UX, Design Sprint) zaleca włączenie etapu testów i badań w strukturę każdej iteracji. Oznacza to, że prototyp musi być raczej niskiej wierności, tj. sfałszowany – zazwyczaj nie ma czasu ani zasobów na tworzenie bardzo realistycznych artefaktów.

Masz pomysł na wspaniałe rozwiązanie. Zamiast poświęcać tygodnie, miesiące czy nawet lata na tworzenie tego rozwiązania, musisz je sfałszować. Niezależnie od tego, czy podejmujesz ryzyko ze śmiałym pomysłem, czy po prostu nie jesteś go pewien, lepiej dowiedzieć się o tym wcześniej. Tracenie czasu na złe pomysły to koszmarna sprawa (Knapp i in., 2016).

Ja nazywam to zalecenie Lean UX zasadą oszczędności: jak możemy się dowiedzieć tego, czego chcemy się dowiedzieć, bez zbytniego wysiłku.

Prototypy są jednorazowe

Rysunki powstają szybko, raczej nie przywiązujemy się do nich. Do wypracowanych prototypów, już tak. Niestety, te emocje sprawiają, że znacznie trudniej jest zrezygnować z pewnych rozwiązań lub dokonać ich gruntownej modyfikacji. Nie rób prototypu, jeżeli nie jesteś gotów go wyrzucić!

Im więcej pracy czemuś poświęcasz — niezależnie od tego, czy to prototyp, czy prawdziwy produkt — tym bardziej się do tego przywiązujesz i tym mniejsza szansa, że weźmiesz pod uwagę negatywne wyniki testu. Po jednym dniu będziesz otwarty na krytykę. Po trzech miesiącach staniesz się zaangażowany (Knapp i in., 2016).

Prototyp musi się wydawać prawdziwy

Na potrzeby testów z użytkownikami prototyp musi się wydawać prawdziwy. Jeżeli pokażesz badanym papierowy prototyp, zrozumieją, że to tylko – jak określa to Jake Knapp – iluzja. A chodzi o wywołanie autentycznych reakcji, nie beznamiętnych komentarzy. Jaki stopień realizmu jest wystarczający? Chodzi o znalezienie złotego środka między jakością artefaktu a wysiłkiem jaki musi zostać włożony w opracowanie prototypu:

Jeśli jakość będzie zbyt niska, ludzie nie uwierzą w to, że prototyp jest rzeczywistym produktem. Jeśli jakość będzie zbyt wysoka, nie skończycie prototypu, nawet pracując całą noc. Potrzebujecie jakości Złotowłosej. Nie za dużo, nie za mało, w sam raz (Knapp i in., 2016).

Pamiętaj także, że można wykonać prototyp wszystkiego – to kwestia kreatywności!

Jak tworzyć prototyp?  

Przejdźmy teraz do bardziej praktycznego zagadnienia – jak wykonać prototyp? Duże możliwości w zakresie opracowywania prototypów daje projektowanie produktów cyfrowych, a przede wszystkim UX (user experience) i UI (user interface). W tym obszarze wyróżniamy kilka doskonale znanych artefaktów pełniących funkcję prototypu: tzw. szkielet – wireframe, makietę – mockup oraz prototyp zasadniczy – prototype. Artefakty te reprezentują różne etapy procesu projektowania. Różnica między nimi jest dobrze opisana w literaturze i w Internecie (np. Adobe, Moqups, Alphalogicinc). Dla przypomnienia:

→ Szkielet to zarys struktury produktu. Przedstawia on ogólny układ interfejsu, wykorzystując przy tym skalę szarości i podstawowe kształty geometryczne (pola tekstowe i ramki zastępcze, tzw. placeholdery). Wireframes nie umożliwiają złożonych interakcji z produktem, są najczęściej także nieklikane. Ich celem jest zebranie pomysłów i opracowanie koncepcji, zdefiniowanie wymagań, a następnie wypracowanie konsensusu.

→ Makieta to statyczna wersja produktu, która precyzuje w jaki sposób ostateczny produkt będzie wyglądał. Makieta jest artefaktem o średniej wierności, dopracowanym pod względem graficznym i tekstowym. Mockupy rzadko są interaktywne, niekiedy mogą zapewniać pewne podstawowe funkcjonalności – elementy symulujące rzeczywiste działanie produktu (np. pola formularzy, menu) czy funkcje umożliwiające wykonywanie podstawowych operacji na danych. Ich celem jest zazwyczaj pozyskanie wparcia interesariuszy projektu, zanim projekt zostanie sfinalizowany.

→ Prototyp zasadniczy jest najbardziej zbliżony do ostatecznego produktu – to bardzo dokładna symulacja ostatecznego produktu – o wysokiej wierności. Prototyp zasadniczy jest klikalny i w pełni interaktywny. Trudno odróżnić go od produktu końcowego. W przypadku, gdy jest prototypem generowanym za pomocą kodu (coded prototype), może również funkcjonować w natywnym środowisku (np. w przeglądarce, systemie operacyjnym i na urządzeniu). Prototyp zasadniczy może służyć do celów biznesowych oraz badawczych – zapewnia bowiem wysoki poziom realizmu doświadczeń.  

Różnica między szkieletem, makietą i prototypem jest następująca:

Wireframe

Mockup

Prototyp

Prototypy papierowe

Do wykonania prototypu papierowego wystarczą typowe przybory biurowe – papier, długopis lub flamastry i taśma samoprzylepna. Przy ich użyciu można zasymulować podstawowe wrażenia UX.

Mój ulubiony prototyp wykonany z papieru to gra: