1

W p r o w a d z e n i e d o U s e r E x p e r i e n c e D e s i g n

2

28.09.2016r.

Warszawa

W p r o w a d z e n i e d o U s e r E x p e r i e n c e D e s i g n

Autor:

Justyna Koc28.09.2016r.

Warszawa

4

User experience to doświadczenie, jakiego

doznaje użytkownik w kontakcie z przedmiotem,

usługą lub firmą.

Określenie najczęściej używane jest w kontekście

stron internetowych i aplikacji.

5

U s e r E x p e r i e n c e p r z e d m i o t ó w c o d z i e n n e g o u ż y t k uW naszym codziennym życiu jesteśmy otoczeni przeróżnymi sprzę-

tami. Pralki, zmywarki, faksy, telefony, rzutniki, skanery, wszystkie

one zostały stworzone po to, by ułatwić nasze życie i uczynić je

przyjemniejszym. Mają sprawić, że będziemy w stanie zrobić więcej

wkładając w to mniej wysiłku.

Mimo tego założenia, często zdarza się, że rzeczywistość wyglą-

da zupełnie inaczej. Roboty kuchenne zalegają gdzieś w kącie, nie

potrafimy korzystać z połowy funkcji na pilocie, czy w kuchence

mikrofalowej, albo musimy przeczytać gruby plik instrukcji obsłu-

gi zanim w ogóle dotkniemy się do sprzętu. W jaki sposób nagrać

film? Podłączyć rzutnik pod laptop? Włączyć funkcję piekarnika

w mikrofali? Albo zmienić godzinę w zegarku elektronicznym? Są to

wszystko pozornie proste czynności, które jednak często sprawiają

kłopoty i przynoszą nam frustrację. Tak nie musi i nie powinno być,

przedmioty zaprojektowane z uwzględnieniem poniższych tema-

tów, mogą być łatwe w obsłudze, przyjazne i intuicyjne.

6

M o d e l k o n c e p c y j n y

Jesteśmy otoczeni wieloma przyrządami codziennego użytku, jest

ich być może tysiące. Różnego rodzaju opakowania, butelki, puszki,

torebki na zip, nożyczki, pojemniki, korki, włączniki, długopisy, kur-

ki. Każde z nich służy do czegoś innego i jest obsługiwane w inny

sposób. Jest to niepojęte, że mimo to jesteśmy w stanie dać sobie

z nimi wszystkimi radę.

Dzieje się tak dlatego, że przedmioty posiadają wskazówki wizual-

ne co do ich przeznaczenia, oraz dlatego, że zostały dobrze zapro-

jektowane. Dobrze, to znaczy w taki sposób, że twórcy udało się

swoim projektem przekazać użytkownikowi właściwą wizję co do

funkcji przedmiotu oraz w jaki sposób z niego korzystać.

Przykładem takiego projektu jest para nożyczek.

Ilość rzeczy, jaką możemy zrobić z nożyczkami jest ograniczona

przez sposób, w jaki zostały zaprojektowane. Dziury w uszach su-

gerują, że należy coś przez nie przełożyć, a jedyne co może paso-

wać, to nasze palce. Rozmiar dziurek ogranicza ilość palców, jakie

mogą się w nich zmieścić. Nawet gdybyśmy nigdy wcześniej nie wi-

dzieli nożyczek, łatwo odgadlibyśmy jak z nich korzystać, ponieważ

model koncepcyjny tego narzędzia jest jasny.

Model koncepcyjny , czyli to, jak uważamy, że przedmiot działa.

Jeśli projektantowi uda się jasno przekazać swój model koncepcyj-

7

ny użytkownikowi, wtedy narzędzie jest łatwe w obsłudze i zrozu-

miałe. Gorzej, jeśli użytkownik zetknąwszy się z przedmiotem ma

inny model koncepcyjny niż zakładał projektant, wtedy użytkownik

nie będzie potrafił go obsłużyć.

W s k a z ó w k i w i z u a l n eChyba każdemu z nas zdarza się mieć problemy z obsługą drzwi,

pchać je, kiedy powinno się ciągnąć i ciągnąć, kiedy powinno się

pchać. Jednak kiedy się nad tym zastanowić, nie ma tak wielu spo-

sobów na otwarcie drzwi. Jeśli staniemy przed nimi, to skąd wiemy

w którą stronę i jak się otworzą? czy trzeba je pchnąć, czy pociągnąć?

a może to suwane drzwi? jeśli tak, to w którą stronę je przesunąć?

Wskazówki wizualne są pomocą dla użytkownika. Już przez samo

spojrzenie na przedmiot powinniśmy być w stanie powiedzieć, co

możemy z nim zrobić i w jaki sposób. W przypadku drzwi, jeśli nie

będą one miały klamki, a tylko płaski panel, jedynie co możemy

z nimi zrobić to pchnąć. Szeroka długa klamka drzwi pożarowych

również zaprasza do pchnięcia, chociaż ten projekt też nie jest ide-

alny. Po samym spojrzeniu nie jesteśmy w stanie powiedzieć, po

której stronie się otworzą.

To właśnie brak wskazówek wizualnych sprawia, że takie przed-

mioty jak zegarek elektroniczny czy odtwarzacze DVD są trudne

w użyciu.

8

Sam wygląd drzwi sugeruje sposób ich otwierania. Wystająca klamka sugeruje, by ją złapać i pociągnąć (A), szeroki panel zaprasza do pchnięcia (B), tak jak płaska pionowa płytka w drzwiach C.

A . B .

9

C .

10

PRZEŁĄCZNIK ŚWIATEŁ zaprojektowany dla Donalda Normana przez Dawida Wargo. Urządzenie odzwierciedla rzeczywiste położenie świateł w pomieszczeniu.

11

M a p p i n g

Mapping to słowo służące do określenia dwóch rzeczy, które mają

ze sobą związek, w tym wypadku chodzi o związek pomiędzy kon-

trolerem a funkcją jaką wywołuje.

Przykładem dobrego mappingu jest kierownica w samochodzie. Je-

śli skręcimy ją w prawo, samochód skręci w prawo, jeśli w lewo,

samochód skręci w lewo. Prawidłowy mapping jest łatwy do na-

uczenia i zapamiętania.

Oświetlenie na suficie często sprawia kłopoty z obsługą, trudno

doszukać się które włączniki kontrolują które żyrandole.

Żeby ułatwić korzystanie z nich, biorąc pod uwagę naturalny map-

ping, moglibyśmy ułożyć włączniki w taki sam sposób, jak światła.

Dodatkową trudnością jest to, że żarówki znajdują się na poziomej

płaszczyźnie sufitu, a włączniki pionowo na ścianie.

F e e d b a c k

Feedback to informacja zwrotna o tym co się wydarzyło, co się

zmieniło, co zostało osiągnięte.

Stare telefony Bell’a były projektowane w taki sposób, żeby dostar-

czyć właściwy feedback użytkownikom. Jeśli został przyciśnięty

12

A.STANDARDOWE UŁOŻENIE KURKÓWBez dodatkowych oznaczeń nie wiadomo który kurek kontroluje który palnik. To ułożenie jest bardzo kłopotliwe.

B.SPAROWANE KURKI To rozwiązanie jest lepsze od poprzedniego, kurki po prawej kontrolują palniki po prawej, kurki po lewej palniki po lewej. W dalszym ciągu zdarzają sie pomyłki co do kontroli palników góra - dół .

C. i D. NATURALNY MAPPING Nie wywołuje konfuzji, nie wymaga dodatkowych instrukcji czy zapamiętywania.

A .

B .

13

C .

D .

14

guzik, można było usłyszeć oraz poczuć odpowiedni „klik”, który

dawał informację, że został dotknięty właściwie. Telefon wydawał

z siebie różne dźwięki by dostarczyć informacji, czy rozmowa jest

łączona itp. Użytkownik mógł nawet usłyszeć w słuchawce własny

głos, po to, żeby mógł ocenić jak głośno powinien mówić.

Projektowanie feedbacku jest ważne, ponieważ pomaga uniknąć

konfuzji. Dzięki niemu użytkownik wie co zrobił. Jeśli go nie do-

starczymy, będzie powtarzał czynność wielokrotnie myśląc, że nie

zadziałała, lub nie zauważy, że osiągnął to co chciał.

W i e d z a w g ł o w i e i w i e d z a w ś w i e c i eInformacja w świecie oznacza, że użytkownik nie musi mieć

wiedzy o przedmiocie z którego korzysta. Większość informacji

których potrzebuje człowiek, znajduje się w świecie.

Przykładem jest klawiatura komputerowa. Każdy klawisz jest w niej

opisany odpowiednim znakiem lub literą i początkujący użytkownik

jest w stanie z niej korzystać już od pierwszej chwili, nie znając

układu klawiszy na pamięć. Ćwicząc regularnie użytkownik może

nauczyć się pisać bez patrzenia na klawiaturę, wtedy informacja ze

świata staje się wiedzą w głowie.

Wymaga to poświęcenia wiele czasu ale w zamian użytkownik

może nauczyć się pisać znacznie szybciej i bez wysiłku.

15

Przestrzeń wokół nas może pełnić też rolę pamięci. Możemy pamię-

tać o określonych rzeczach będąc w konkretnym miejscu czy sytu-

acji, np. przez przyklejanie żółtych karteczek do monitora, lub przez

położenie teczki potrzebnej na następny dzień, na naszych butach.

Wiedza w głowie

Nasza pamięć dzieli się na dwa rodzaje: pamięć krótkotrwałą

i długotrwałą.

Kiedy potrzebuję zachować w pamięci cyfry 6 7 9 3 w ciągu kolej-

nych kilku minut mogę dotworzyć je bez trudu. Co innego, jeśli będę

starać się przypomnieć sobie co zjadłam na obiad 3 dni temu. Wy-

dobycie informacji z pamięci długotrwałej jest znacznie trudniejsze.

Pamięć krótkotrwała ma swoje minusy, wystarczy że cokolwiek

mnie rozproszy i uciekną mi z pamięci powyższe liczby. Ma ona

też małą pojemność, różne badania wskazują na liczbę 5 do 12

obiektów które jesteśmy w stanie przetrzymywać na raz w pamięci

krótkotrwałej. Pojemność pamięci długotrwałej jest niezmierzona,

liczy być może miliardy obiektów, które możemy w niej umieścić. To

nie przestrzeń jest problemem w pamięci długotrwałej, ale sposób

umieszczenia tam informacji oraz jej wydobywania.

Dwa sposoby zapamiętywania są istotne na potrzeby tej pracy.

1. Zapamiętywanie obiektów bez związku (np. ciągu nie po-

wiązanych ze sobą cyfr)

2. Zapamiętywanie związków między obiektami (istnieje

16

relacja między obiektami lub istnieje relacja między obiektem a tym

co już wiemy)

Zapamiętywanie obiektów bez związku jest trudne. Wiąże

się również z tym, że człowiek który uczy się w ten sposób np.

obsługiwać program komputerowy, nie rozumie związków przyczy-

nowo skutkowych i jeśli coś pójdzie inaczej niż zwykle, użytkownik

nie będzie umiał się zachować, znaleźć rozwiązania.

Zapamiętywanie związków między obiektami.

Zapamiętywanie rzeczy które mają ze sobą związek jest łatwiejsze,

ponieważ odwołuje się do wiedzy, którą już posiadamy.

Mogą nam posłużyć do tego odpowiednie modele mentalne.

Przykładem tego niech będzie przełącznik migacza w motocyklu.

Przełącznik jest umieszczony na lewej rączce, przesunięty do przo-

du sygnalizuje skręt w prawo, przesunięty do tyłu, skręt w lewo.

W tej chwili działanie przełącznika wydaje się przypadkowe i bę-

dzie trudne do zapamiętania. Ale jeśli zauważymy, że przesuwając

rączkę w motocyklu do przodu, skręcimy w prawo, a jeśli do tyłu,

to w lewo, zauważymy, związek i działanie przełącznika stanie się

łatwiejsze do zapamiętania.

Zarówno wiedza w świecie jak i wiedza w głowie mają swoje plusy

i minusy.

Wiedza w świecie jest łatwiejsza do wykorzystania, dostępna tu

17

i teraz, wiedza w głowie musi zostać odszukana i wymaga nauki,

czasem wielu godzin. Wiedza w świecie wymaga jej dostępności

i umiejętności interpretacji, w dużej ilości może powodować chaos

oraz być trudna do wykorzystania.

B ł ę d y

„Jestem tylko człowiekiem” - często wypowiadamy to zdanie tłu-

macząc się z tego, że nie jesteśmy idealni. Mamy prawo do popeł-

niania błędów, i dobrze, bo ciężko znaleźć dzień, kiedy jakiegoś nie

popełnimy. Rzadko w ciągu doby wystrzeżemy się jakiegoś potknię-

cia, choćby przejęzyczenia.

Błędy językowe zdarzają się bardzo często, ale nauczyliśmy się je

niwelować. Jeśli nawet powiemy coś niewyraźnie, nasz rozmówca

raczej nas zrozumie wyciągając wnioski z kontekstu.

Przedmioty nie mają jednak takiej tolerancji, nie potrafią odczyty-

wać naszych intencji.

Rolą projektanta jest przewidzenie, że błędy mogą nastąpić, spra-

wienie, że będą rzadziej występować, będą łatwe do wyłapania

oraz łatwo odwracalne.

Projektanci samochodów wymyślili dobry system zapobiegania

błędom. Do pojazdu należy wlewać różnego rodzaju substancje, olej,

płyn do szyb, płyn do chłodnicy. Gdyby któraś z nich została wlana

18

PANEL „HISTORIA”z Adobe Photoshop, pozwala na cofnięcie się o ponad dwadzieścia akcji.

19

w nieodpowiednie miejsce, mogłaby spowodować duże zniszczenia.

Projektanci starali się zmniejszyć szansę na pomyłki przez odróż-

nienie otworów od siebie, nadanie im różnych kolorów, kształtów

i rozmiarów, oraz przez dodanie kolorów do płynów.

Ważne, aby błędom nie tylko zapobiegać, ale również niwelować

ich skutek. Wspaniałą funkcją z jakiej mogą korzystać graficy, jest

wielokrotna możliwość cofania w programie Adobe Photoshop.

Użytkownik może w nim cofnąć ponad dwadzieścia zrobionych

przez siebie kroków.

Jednym ze sposobów na zapobieganie błędom jest wymuszenie

określonej funkcji. Na przykład, jeśli spróbujemy otworzyć drzwiczki

w mikrofali w czasie jej działania, urządzenie automatycznie się wy-

łączy. System w ten sposób wymusza zachowanie bezpieczeństwa,

nie pozwala na otwarcie drzwi w czasie kiedy maszyna pracuje.

Innym przykładem w którym system wymusza odpowiednie zacho-

wanie, jest wypłacanie pieniędzy z bankomatu. Kiedy to robimy,

najpierw musimy wyjąć kartę zanim maszyna wyda nam pieniądze.

Dzięki temu jest mniejsza szansa, że zapomnimy karty bankomato-

wej, niż byłaby w przypadku gdybyśmy najpierw dostali pieniądze.

Jest wiele sposobów na zapobieganie i niwelowanie błędów.

Pomocą w tym są wszystkie wcześniej omówione zagadnienia,

jak dostarczenie użytkownikowi odpowiedniej wiedzy w świe-

cie, użycie naturalnych ograniczeń, odpowiednich mappingów,

20

stworzenie prawidłowych konstrukcji mentalnych.

Ważne, aby w procesie projektowania postawić się w roli użytkow-

nika i przyjąć jego punk widzenia.

O g r a n i c z e n i a f i z y c z n e i k u l t u r o w eKiedy rozbierzemy na części jakąś maszynę, np. toster lub pralkę,

zobaczymy z jak wielu składa się części. Gdybyśmy, przykładowo,

mieli do złożenia przedmiot z dziesięciu części, mielibyśmy ponad

3,5 miliona możliwości w jakich moglibyśmy to zrobić. Jednak dzię-

MOTOCYKL LEGOZabawka składa się z 13 części, ale ograniczenia fizycznie i kulturowe sprawiają, że istnieje niewiele możliwości użycia każdego z klocków. Dlatego motocykl łatwo jest złożyć.

21

ki fizycznym ograniczeniom, w praktyce nie ma ich aż tak wiele.

Części muszą pasować do siebie, niektóre trzeba zamontować za-

nim zamontuje się inne. Śruby możemy umieścić tylko w odpowied-

nio grubych i głębokich otworach itd.

Ograniczenia kulturowe pomagają nam wyznaczając, w którą stro-

nę śruby będą się zakręcać a w którą odkręcać.

Ograniczenia fizyczne same w sobie zazwyczaj nie są wystarcza-

jące, żeby samodzielnie poskładać pralkę, ale sprawiają, że jest to

prostszy proces niż byłby bez nich.

22

Tr u d n o ś c i z k o m p u t e r e m

Wszystkie omówione zagadnienia tyczą się tak przedmiotów co-

dziennego użytku, jak i komputera. Kumuluje on wszystkie trud-

ności związane z użytecznością, ponieważ ma bardzo wiele funkcji

i możliwości, a pracuje w sposób elektroniczny, bez widocznych

oznak. Z tego powodu programy komputerowe są szczególnym wy-

zwaniem dla projektantów.

Niestety często aplikacje są zostawiane w rękach programistów, lu-

dzi którzy nie są końcowymi użytkownikami i którzy nie biorą pod

uwagę wygody osób, które będą z tych produktów korzystać. Na

szczęście powoli się to zmienia i na polskim oraz światowym rynku

jest coraz większe zapotrzebowanie na osoby zajmujące się uży-

tecznością, tzn. UX Designerów.

Błędy w projektowaniu programów komputerowych to:

• Brak wskazówek wizualnych co do działania funkcji

• Brak feedback’u

• Brak wskazówek, co robić dalej, jaki jest następny krok.

• Brak spójności w zachowaniu się programu (w jednym miejscu

dana funkcja działa tak, w innym inaczej)

• Niezrozumiały język

• Komunikaty o błędzie bez informacji co oznacza i jak go naprawić

• Brak możliwości popełniania błędów przez użytkownika, poje-

dyncza akcja może wyrządzić duże szkody

23

Czyli dokładne zaprzeczenie wszystkiego, o czym wcześniej pisałam.

U s e r C e n t e r e d D e s i g nUser Centered Design to podejście do projektowania, w którym

stawia się na pierwszym miejscu użytkownika. Przedmioty zapro-

jektowane w ten sposób powinny być łatwe do zrozumienia i przy-

jazne w użytkowaniu. Osoba, która z nich korzysta, powinna sama

potrafić dojść, jaki jest następny krok (co może zrobić dalej) oraz

jaki jest teraz status sytemu (co się teraz dzieje).

Donald Norman w książce „Design of everyday things” opisał sie-

dem zasad, które mają pomóc tworzyć intuicyjne projekty, a są to:

1. Użyj zarówno wiedzy w świecie jak i w głowie

2. Uprość strukturę zadania.

3. Zadbaj o wskazówki wizualne

4. Stwórz właściwe mappingi

5. Wykorzystaj moc ograniczeń naturalnych i sztucznych

6. Projektuj z myślą o błędach

7. Kiedy wszystko inne zawiedzie, korzystaj ze standar-

dowych rozwiązań.

1. Użyj zarówno wiedzy w świecie jak i w głowie

Ludzie uczą się szybciej nowych rzeczy korzystając z wiedzy w świe-

cie. Jednak wiedza w głowie pozwala im na bardziej efektywne

wykonywanie zadań. Projektanci powinni mieć na uwadze zarówno

24

nowych użytkowników, którzy nie znają jeszcze systemu i potrze-

bują wiedzy w świecie, jak i zaawansowanych użytkowników, któ-

rzy posiadają wiedzę w głowie i mogą wykonywać zadania szybciej.

Jeden i drugi sposób korzystania z systemu nie powinien wchodzić

sobie w drogę.

Dobrym przykładem jest program dla grafików Adobe Photoshop.

Początkujący użytkownicy mogą w nim korzystać z ikonek i pane-

li wybierając je kliknięciem myszki. Zaawansowani użytkownicy

mogą korzystać ze skrótów klawiaturowych, które wywołują te

same funkcje co ikony, a znacznie oszczędzają czas. Przy każdej

ikonie znajduje się również mała litera która jest oznaczeniem skró-

tu klawiaturowego, dzięki czemu łatwiej jest się ich uczyć.

2.Uprość strukturę zadania

Projektant powinien zadbać, aby zadania były maksymalnie przej-

rzyste i proste. Żeby to osiągnąć musi mieć na uwadze ograniczenia

ludzkiej pamięci, krótkotrwałej i długotrwałej.

Z tego powodu system nie powinien wymagać od użytkownika pa-

miętania więcej niż 5-ciu rzeczy na raz. Żeby wspierać ograniczenia

pamięci długotrwałej, rzeczy których użytkownik musi się nauczyć,

powinny mieć związek ze sobą lub z tym, co osoba już wie i co zna.

Projektant powinien też korzystać z wiedzy w świecie by przypomi-

nać i podpowiadać, co można zrobić.

25

3.Zadbaj o wskazówki wizualne.

Użytkownik poprzez samo spojrzenie na przedmiot powinien móc

powiedzieć jakie ma możliwości. Widoczny powinien być również

efekt akcji użytkownika, oraz status systemu, który jest informacją

dla użytkownika, co się teraz dzieje i czego się może spodziewać.

Ważne jest zachowanie odpowiedniej hierarchii wizualnej, tzn. aby

najważniejsze rzeczy były najlepiej widoczne (największe, najbar-

dziej kontrastowe).

4.Stwórz właściwe mappingi

Projektant powinien wykorzystać moc naturalnych mappingów.

Sprawić, by kontroler miał jak najbardziej oczywisty związek z rze-

czą, którą obsługuje, wykorzystywał analogie, wykonywał podob-

ne działanie.

5. Wykorzystaj moc ograniczeń

Te ograniczenia powinny „przypilnować”, czy użytkownik zrobił

z obiektem to, co powinien. Projektant może za ich pomocą ułatwić

użytkownikowi wybór, przez jego ograniczenie do maksymalnie

kilku opcji.

6. Projektuj z myślą o błędzie.

„Rzeczy pójdą tak źle, jak to tylko możliwe” - głosi prawo Murphy-

ego. Projektant powinien zawsze mieć to na uwadze i przewidy-

wać wszystkie negatywne scenariusze. Pomagać użytkownikowi

26

w rozwiązywaniu błędów, zapewnić odwracalność akcji oraz utrud-

niać dostęp do akcji niebezpiecznych i nieodwracalnych.

7. Kiedy wszystko inne zawiedzie, korzystaj ze standar-

dowych rozwiązań.

Korzystanie z norm niesie ze sobą wiele plusów. Oznacza, że jeżeli

użytkownik raz nauczy się jakiegoś systemu, będzie umiał korzystać

ze wszystkiego co jest zgodne z jego standardami. Pisanie na klawia-

turze QWERTY będzie tak samo intuicyjne (dla osoby, która jest z nią

zaznajomiona) bez względu na to, czy znajdzie się ona w laptopie, na

tablecie czy parkometrze.

Standardowe rozwiązania są ważną częścią budowania stron interne-

towych. Dzięki nim użytkownicy łatwiej mogą poruszać się w prze-

pastnym internecie, szybko orientują się który z obrazków to logo

witryny, gdzie znajduje się nawigacja strony a gdzie wyszukiwarka.

27

U s e r e x p e r i e n c e a p l i k a c j i i s t r o n i n t e r n e t o w y c h

D l a c z e g o U X j e s t w a ż n y ?User experience dotyczy produktów, serwisów i firm, ale jest szcze-

gólnie ważny przy projektowaniu stron internetowych i aplikacji.

W kontakcie ze skomplikowanym technologicznie sprzętem, jakim

są strony i aplikacje dzieje się coś osobliwego. Jeśli ludzie nie po-

trafią ich obsłużyć, dochodzą do wniosku, że to ich wina, że nie

mają odpowiedniej wiedzy, nie znają się, czują się głupio. Jest to

irracjonalne, ponieważ jeżeli tak się dzieje, to znaczy, że zawiódł

projektant, a nie oni.

Mimo to, jeśli coś będzie niejasne, użytkownik w kontakcie ze stro-

ną internetową będzie obwiniał siebie i czuł się głupio, a jest to

prosta droga do odstraszenia użytkownika od naszego produktu.

Strony internetowe muszą tłumaczyć się same, nie mogą posiadać

instrukcji obsługi do przeczytania zanim zaczniemy ich używać.

Użytkownik powinien być w stanie zrozumieć, o co chodzi, korzy-

stając wyłącznie ze swojej wiedzy i doświadczenia.

28

Nie dość, że użytkownik w internecie jest pozostawiony samemu

sobie i zazwyczaj nie może liczyć na pomoc, właściciele stron inter-

netowych nie zdają sobie sprawy, że osoby odwiedzające ich witry-

nę mogą mieć z czymś problem.

Skoro UX jest tak ważny, to czemu jest często ignorowany?

Kilkanaście lat temu samo posiadanie strony internetowej było suk-

cesem, liczyło się to, kto pierwszy na rynku ją posiada, a nie czy

faktycznie daje ona jakąś wartość dla jej odbiorców.

Z czasem to nie wystarczyło żeby przyciągnąć klientów, i firmy za-

częły dokładać do swoich stron coraz więcej informacji i funkcji.

Robiły to jednak nie zważając na fakt, czy użytkownicy potrafią

jeszcze ich używać, czy umieją z tych wszystkich funkcji korzystać.

Teraz nadszedł czas, w którym biznes zaczyna orientować się, że

dostarczenie pozytywnego doświadczenia użytkownikom jest tym,

co może ich odróżnić od konkurencji. Dobrze zaprojektowany User

Experience może być sposobem na przyciągnięcie klientów oraz

sprawienie, by pozostali.

Nawet w sytuacji, kiedy strona internetowa zawiera unikalne in-

formacje, jej twórcom powinno zależeć, aby była łatwa w obsłudze

i przejrzysta. W przeciwnym razie użytkownicy nie wyciągną z niej

tych informacji, które chcieli.

29

Złe doświadczenia, jakie użytkownicy mają z serwisem, sprawiają,

że nie wrócą do niego już nigdy więcej, neutralne doświadczenia

dają szansę na powrót, o ile konkurencja nie oferuje lepszego UX,

natomiast dobry user experience daje największą szansę na przy-

wiązanie klientów do marki.

Lojalność klientów to nie wszystko, co zyskujemy przed dobry UX.

Biznesmeni chcą znać rzeczywiste efekty swoich działań, do tego

służy ROI, czyli zwrot inwestycji, z angielskiego Return On Invest-

ment. Zazwyczaj ROI dotyczy pieniędzy i mierzy, ile firma zarobiła

na każdą zainwestowaną złotówkę. Nie musi jednak dotyczyć wy-

łącznie finansów.

Sposobem na mierzenie ROI w stronach internetowych może być

współczynnik konwersji. Konwersja to realizacja celu witryny.

Mamy z nią doczynienia za każdym razem, gdy chcemy, żeby użyt-

kownik wykonał krok w kierunku większego zaangażowania w nasz

biznes. Może to oznaczać zapisanie się na newsletter, zakup książki

albo utworzenie konta.

Współczynnik konwersji oblicza się poprzez podzielenie ilości użyt-

kowników, którzy wykonali zamierzony przez nas krok, przez ilość

wszystkich wizyt na stronie. Na przykład, 3 użytkowników kupiło

książki, miało miejsce 36 wizyt na stronie, 3:36=8,33%, współczyn-

nik konwersji jest równy 8,33%.

30

Dzięki mierzeniu współczynnika konwersji możemy dokładnie

wiedzieć, jak efektywni jesteśmy w osiąganiu celów biznesowych.

Działania z zakresu UX design są głównym czynnikiem mogącym

przyczynić się do optymalizacji konwersji, co w przypadku skle-

pów internetowych, bezpośrednio przekłada się na wzrost sprze-

daży i zarobków firmy.

Nawet jeśli klienci nie wydają pieniędzy na naszej stronie interne-

towej lub aplikacji, nadal warto dbać o jej UX.

Jeśli korzystają z niej nasi partnerzy lub pracownicy, stopień UX

aplikacji będzie decydował o tym, czy stanie się ona użytecznym

narzędziem wnoszącym wartość do firmy, czy będzie pochłaniać

czas i nerwy jej użytkowników.

User experience ma na celu poprawienie efektywności. Osiąga to

na dwa sposoby: pomagając ludziom szybciej pracować oraz unikać

popełniania błędów.

Im bardziej efektywne są narzędzia, z jakich korzystają pracownicy

w firmie, tym więcej mogą wykonać w ciągu dnia pracy. Oszczędza-

nie czasu pracowników oszczędza pieniądze firmy.

Efektywność pracy to nie wszystko, co zyskujemy, dając pracowni-

kom dobre narzędzia. Ludzie korzystający z nich są bardziej zado-

woleni z pracy, wykonują ją z mniejszym wysiłkiem i bez frustracji.

Dzięki temu jest mniejsza szansa, że będą chcieli opuścić firmę.

Nasza organizacja zyskuje zadowolonych pracowników z długim sta-

31

żem, znających się na swoich obowiązkach. Firma nie musi też tracić

czasu i pieniędzy na szukanie oraz szkolenie nowych pracowników.

5 e l e m e n t ó wProces User Experience wymaga przewidzenia każdego ruchu użyt-

kownika i dokładnego zaprojektowania każdej interakcji w taki spo-

sób, aby zawsze działo się to, co powinno, czego użytkownik się

spodziewa. Brzmi to jak trudne zadanie, ale można zrozumieć jak

działa w całości, poprzez podzielenie go na elementy.

Wielu z nas dokonywało zakupów przez internet. Proces zazwyczaj

wygląda podobnie: wchodzimy na stronę, wyszukujemy interesu-

jący nas produkt, płacimy i podajemy adres do wysyłki, a strona

potwierdza zakup.

To doświadczenie wygląda w ten sposób ze względu na wiele decy-

zji podjętych po drodze, od użytych kolorów, zdjęć, przez dostęp-

ne na stronie funkcje. Śledząc je krok po kroku, od koncepcji do

finalnego kolorowego projektu interfejsu, możemy zrozumieć jak

zostało stworzone.

Strategia

Pierwszym z elementów jest Strategia. Mówi ona o tym, na jakie

potrzeby użytkownika ma odpowiadać strona, czemu ludzie będą

chcieli z niej korzystać i dlaczego my chcemy ją zakładać, co z tego

32

będziemy mieć. Na przykład, w przypadku sklepów internetowych,

użytkownicy chcą kupować produkty ze strony, my chcemy je

sprzedawać zarabiając na tym pieniądze.

By móc określić potrzeby naszych użytkowników, musimy dowie-

dzieć się o nich jak najwięcej: kim są, czym się interesują, co przy-

nosi im radość, a co ich boli.

Rozpoznanie, kim są nasi użytkownicy i na jakie ich potrzeby ma

odpowiadać nasza strona może być trudne. Najłatwiej jest myśleć,

że wszyscy ludzie będą z niej korzystać, albo że są oni tacy sami

jak my. Jednak ważne, żeby nie wychodzić z takiego założenia, bo

kiedy się temu przyjrzymy, zazwyczaj okaże się, że to nie prawda.

Ludzie korzystają z internetu w różny sposób, rodzic będzie szukał

innych informacji na stronie szkoły, niż uczeń. Również początkują-

cy kucharz będzie potrzebował innej zawartości strony, niż profe-

sjonalny szef kuchni.

Odnalezienie potrzeb użytkowników może być skomplikowane, po-

nieważ z naszego produktu mogą korzystać ludzie, którzy znacząco

się od siebie różnią. Z tego powodu, na potrzeby badania, warto

podzielić użytkowników na segmenty. Jest wiele sposobów na

taki podział, najpopularniejszy to podział według wieku i płci,

ale często nie są to czynniki najważniejsze. Możemy podzie-

lić naszych użytkowników według tego, ile czasu tygodniowo

33

5 ELEMENTÓW USER EXPERIENCEDiagram przedstawia 5 głównych elementów, z podziałem na ich składowe

34

poświęcają na surfowanie w internecie, jak zaznajomieni są z tech-

nologią, jak dobrze znają branżę, w której jest nasz produkt. Potrze-

by początkujących i zaawansowanych osób mogą być bardzo różne.

Informacje o użytkownikach powinny być oparte o fakty, badania,

np. ankiety, wywiady z osobami, które są potencjalnymi klientami

strony. Nieocenionym źródłem informacji o użytkownikach mogą

być pracownicy naszej firmy, którzy się z nimi stykają, np. pracow-

nicy pomocy lub sprzedawcy.

Na etapie Strategii powinniśmy też konkretnie wyznaczyć nasze

cele. Takim celem biznesowym może być np. to, że chcemy mieć

1 mln złotych obrotu ze sprzedaży rocznie. Tylko w ten sposób bę-

dziemy potrafili po czasie rozpoznać, czy odnieśliśmy sukces, czy

ponieśliśmy porażkę.

Cele biznesowe nie powinny być wyznaczane kosztem wygody

użytkowników, w innym razie w dłuższej perspektywie czasu, odbi-

je się to negatywnie na naszym biznesie.

Należy pamiętać, aby cele, jakie sobie wyznaczamy, były realne

i mogły zostać osiągnięte przez skuteczny projekt UX. Na przy-

kład, dobrym projektem strony internetowej nie jesteśmy w sta-

nie sprawić, aby więcej klientów dowiedziało się o naszej firmie,

to zadanie marketingu, ale do dobrego UX należy, aby użytkowni-

cy byli zadowoleni i spędzali na stronie więcej czasu.

35

Mierząc sukces należy pamiętać, że w tym samym czasie dzieje się

wiele rzeczy, np. jeśli właśnie została rozpoczęta duża kampania

w mediach, to z jej powodów obserwujemy duży ruch na stronie,

a nie dzięki ulepszonej właśnie użyteczności nawigacji.

Dlatego mierząc wyniki trzeba mieć na względzie wszystkie czynni-

ki, które mają miejsce.

Wyznaczenie Strategii jest pierwszym krokiem w procesie i należy

o niej pamiętać na każdym kolejnym etapie tworzenia projektu.

Zakres

Zadaniem Zakresu jest określenie jakie w ogóle funkcje na stronie

są dostępne, co użytkownik będzie mógł na niej zrobić. W praktyce

oznacza to stworzenie specyfikacji, dokumentu z wykazem wyma-

ganych funkcji.

Zakres możliwości naszej strony wydaje się być oczywistą sprawą,

jednak bez jego ustalenia może wkraść się chaos. Jeśli nad projek-

tem pracuje więcej niż jedna osoba, spisanie funkcji pomaga w ko-

munikacji. Dzięki nakreśleniu zakresu prac każdy w zespole wie co

budujemy, nad jaką funkcją pracujemy w danym momencie, oraz

kiedy projekt możemy uznać za skończony.

Bez ustalonego Zakresu nowe funkcje pojawiałyby się ilekroć

nowy pomysł wpadł by komuś do głowy, a projekt nie miałby koń-

ca, ponieważ nie można go zdefiniować, a zawsze będzie jeszcze

coś do dodania. Trudniej byłoby również o zrozumienie między

36

poszczególnymi członkami zespołu co do ostatecznego kształtu

projektu, do jakiego dążymy.

Na etapie tworzenia Zakresu powinniśmy podjąć decyzję nie tylko

na temat funkcjonalności strony, ale również zdecydować o zakre-

sie jej zawartości, tzn. jakie informacje ma przedstawiać, jakie tek-

sty, zdjęcia, materiały video i audio.

Zazwyczaj zakres funkcji i zawartości strony będzie determinowa-

na przez pracowników firmy, członków zespołu tworzących pro-

jekt oraz wszystkich pośrednio w niego zaangażowanych. Dobrym

pomysłem jest zapytanie naszych użytkowników co chcieliby zo-

baczyć na stronie. Zapoznanie się z konkurencją, która posiada te

same grupy klientów co my, również może być owocne i przynieść

wiele inspiracji.

Jeżeli nasza strona internetowa posiada odbiorców o różnych po-

trzebach, powinniśmy zawsze wiedzieć, do kogo kierujemy daną

zawartość (np. zawartość strony dla uczniów powinna wyglądać

inaczej, niż dla rodziców).

Na początku projektu może pojawić się wiele pomysłów co do funk-

cji i zawartości strony. Decyzja, które z nich są najważniejsze, może

być trudnym zadaniem. Ważne, żeby każdy z nich pasował do Stra-

tegii, jeżeli tak nie jest, automatycznie powinien zostać odrzucony.

37

Pomysły należy rozważyć również pod kątem ograniczeń

technicznych oraz nakładu pracy jaki trzeba będzie włożyć

w ich wykonanie.

Struktura

Zadaniem Struktury jest określenie w jaki sposób funkcje oraz za-

wartość strony zostaną ze sobą zgrupowane oraz zorganizowane.

Jest to etap projektowania interakcji (czyli projektowania w jaki

sposób system będzie się zachowywał w interakcji z człowiekiem)

oraz architektury informacji (czyli organizowania informacji w taki

sposób, aby służyło to użyteczności).

Niegdyś systemy komputerowe były projektowane, aby były jak

najbardziej wydajne. Było to istotne ze względu na ograniczenia

techniczne. Człowiekowi było ciężko korzystać z tych programów,

wydawało się, że ludzie muszą nauczyć się więcej o komputerach,

żeby móc korzystać z nich z większą łatwością. Z czasem okazało

się, że jest inna droga, że można projektować systemy tak, żeby

były przyjazne dla ludzi. Dziedzinę, która się tym zajmuje, określana

jest mianem projektowania interakcji.

Ważną jej częścią jest projektowanie błędów. Jeżeli to możliwe, nasz

projekt powinien sprawiać, żeby błędy nie występowały lub były

trudne do popełnienia. Jeżeli nastąpią, system powinien podać infor-

mację jak je naprawić lub sam to uczynić bez ingerencji użytkownika.

Ważne jest również niwelowanie strat wynikających z błędów, np.

38

przez tworzenie kopii zapasowych lub umożliwienie opcji cofania.

Wszędzie, gdzie użytkownik styka się z informacjami, które musi

potrafić zrozumieć i użyć, jest istotna architektura informacji.

Jako dziedzina jest ona stosunkowo nowa, jednak w rzeczywisto-

ści, odkąd człowiek komunikuje się z innymi, musiał znaleźć sposób

na grupowanie i priorytetyzowanie informacji.

W stronach internetowych architektura informacji szereguje ich za-

wartość w taki sposób, aby odpowiadała celom biznesowym oraz

potrzebom użytkownika. Osiąga to naśladując sposób, w jaki użyt-

kownik myśli o informacji, po to aby mógł je łatwo odnaleźć.

Nie ma większego znaczenia, jak wiele kategorii będzie miała nasza

strona intenetowa, ile będzie mieć poziomów i jak wiele użytkow-

nik będzie musiał zrobić kroków, aby znaleźć się u celu, tak długo,

jak długo każdy z kroków będzie dla użytkownika oczywisty.

Stworzenie przejrzystej architektury informacji nie zda się na wiele,

jeśli użyjemy na stronie niezrozumiałych określeń.

Wyspecjalizowany żargon, skróty, nazwy funkcjonujące wewnątrz

organizacji, mogą być niezrozumiałe dla naszych klientów. Dlate-

go również na tym etapie ważne są badania z użytkownikami, po-

znanie ich języka. Istotna jest konsekwencja w korzystaniu z tych

określeń, dzięki niej pozbędziemy się nieporozumień i konfuzji, tak

wśród użytkowników jak i wewnątrz naszej organizacji.

Bez względu na to, czy to zaplanujemy, czy nie, każda strona in-

ternetowa posiada jakąś architekturę informacji. Dlatego warto się

39

nad nią zastanowić i zaprojektować tak, by pomagała w realizacji

celów biznesowych i przynosiła zadowolenie użytkownikom.

Szkielet

Szkielet strony określa gdzie i jakie elementy mają się znajdować.

Zadaniem dobrego szkieletu jest rozmieścić je tak, by było to jak

najbardziej zrozumiałe dla użytkownika.

Szkielet jest reprezentacją architektury informacji, odzwierciedla

jej założenia. Zawiera też elementy interfejsu, określa ułożenie

guzików, zdjęć, tekstów w taki sposób, aby użytkownik mógł naj-

wygodniej korzystać z możliwości witryny. W szkielecie znajduje

się również nawigacja, która daje użytkownikowi możliwość po-

ruszania się po architekturze informacji, przez przechodzenie do

kolejnych części serwisu. W tym miejscu architektura informacji,

projektowanie interfejsu oraz interakcji przenikają się między sobą,

łącząc wszystko, co zrobiliśmy do tej pory.

Kluczem do stworzenia dobrego interfejsu jest właściwy dobór

jego elementów, ich ułożenie powinno tworzyć sensowną całość

i pozwalać użytkownikowi na łatwe z nich korzystanie. Wszystko to

ma na celu wspieranie zadań i celów użytkownika.

Projektując layout interfejsu warto korzystać z przyjętych konwencji.

Tak jak opisywałam w rozdziale „User Experience przedmiotów

codziennego użytku”, raz nauczona konwencja co do rozkładu

40

klawiatury QWERTY, pozwala użytkownikom szybko i bez wysiłku

pisać zarówno na komputerze, telefonie jak i parkometrze. Niepo-

trzebnie odchodząc od utartej ścieżki, np. szeregując klawisze alfa-

betycznie, przynieślibyśmy ludziom wyłącznie frustracje. Dlatego

tam, gdzie to możliwe, warto korzystać z przyjętych rozwiązań, któ-

re użytkownik już zna i nie będzie miał problemów z ich obsługą. Ta

rada tyczy się również projektowania wewnątrz naszego serwisu.

Jeżeli tylko możemy, korzystajmy konsekwentnie z tych samych

rozwiązań tak, aby podobne funkcje zachowywały się w taki sam

sposób. Dzięki temu, jeśli użytkownik nauczy się ich w jednym

miejscy, będzie potrafił ich używać we wszystkich pozostałych.

Najlepsze interfejsy to takie, w których na pierwszy rzut oka widać,

co jest najważniejsze. Najbardziej widoczne i dostępne powinny

być funkcje, które są najczęściej wykonywane przez użytkowników.

Zadaniem projektanta jest dowiedzieć się, które z elementów inter-

fejsu powinien wyróżnić, a które należy ukryć.

Częścią interfejsu jest również nawigacja. Za jej pomocą użytkow-

nik może poruszać się po całym serwisie. Rolą nawigacji jest też

komunikowanie struktury serwisu. Jej budowa powinna sugerować

związek elementów nawigacji między sobą, oraz tłumaczyć relację

między resztą serwisu a miejscem w którym się znajdujemy.

W internecie nie ma tradycyjnego pojęcia przestrzeni, to nawigacja

stanowi rodzaj mapy, pomaga użytkownikowi zorientować się gdzie

41

się teraz znajduje oraz dokąd może dotrzeć.

Layout strony przedstawia zawsze jakieś informacje, ich grupowa-

nie i kategoryzowanie oraz sposób prezentacji należy do projek-

towania informacji (information design). Struktura przedstawienia

informacji powinna naśladować sposób, w jaki myślą o niej użyt-

kownicy, wspierając ich w osiąganiu celów oraz prezentować infor-

macje w najbardziej zrozumiały i sensowny sposób.

Projekt layout’u jest złożony, musi zawierać nawigację, wszyst-

kie elementy strony potrzebne do korzystania z funkcjonalności

oraz całą zawartość, którą zajmuje się projektowanie informacji.

Wszystkie te elementy Szkieletu przybierają fizyczną formę w pro-

jekcie wireframu.

Wireframe jest to surowy, schematyczny rysunek layout’u, na któ-

rym możemy zobaczyć gdzie, co i w jaki sposób powinno zostać

umieszczone. Często wireframy są opatrzone notatkami, objaśnie-

niami, które mogą odwoływać się np. do specyfikacji technicznych.

Wireframy mogą wyglądać różnie w zależności od projektu, jeśli

serwis jest mały czasami wystarczy, aby był to szkic ołówkiem na

papierze z przyklejonymi karteczkami, innym razem trzeba wyko-

nać wiele szczegółowych rysunków ekranów.

Wireframe jest obiektem, w którym spotyka się projektowanie in-

formacji oraz projektowanie wizualne.

42

Powierzchnia

Powierzchnia strony internetowej to zestaw kolorowych kształtów,

zdjęć i tekstów. Niektóre z nich można kliknąć, żeby wywołać jakieś

akcje, inne to tylko ilustracje.

Na etapie szkieletu ustaliliśmy w jaki sposób poszczególne elemen-

ty layout’u zostaną rozmieszczone. W tym momencie będziemy

pracować nad ich prezentacją.

Powierzchnia jest ostatnim z 5 elementów, jednak dla użytkowni-

ka pierwszym z jakim się zetnie. Projektując powierzchnię mamy

doczynienia z sensory design - projektowaniem sensorycznym.

Użytkownik stykając się z obiektem, firmą czy usługą, odbiera je

zmysłami. Projektowanie sensoryczne dotyczy smaku, zapachu, do-

tyku, dźwięku i wzorku, jednak w projektowaniu interfejsu stron in-

ternetowych i aplikacji najistotniejszy jest obraz, więc tego będzie

tyczył ten tekst.

Częścią projektowania wizualnego jest estetyka, ale to nie wszyst-

ko. Projekt graficzny, użyte kolory i fonty mogą być przedłużeniem

wszystkiego, co zrobiliśmy w 4 pozostałych panelach np. komuni-

kować architekturę informacji lub mówić o strategii firmy.

Graficy znajdują triki, aby swoim projektem przyciągnąć i prowa-

dzić wzrok użytkowników w miejsca, które chcą. Niezawodnym

43

WIREFRAMESchematyczny rysunek layout’u

44

sposobem, by to uczynić, jest użycie kontrastu. Dzięki niemu mo-

żemy komunikować projekt informacji, pokazać, które elementy są

zgrupowane razem, oraz oddzielać je między sobą, przeprowadzać

wzrok użytkownika przez zadania krok po kroku. W ten sposób

użytkownik czuje, że wie dokąd iść, a elementy layout’u wydają mu

się być bardziej uporządkowane.

Jak zawsze, użycie kontrastu powinno wspierać cele i zadania użyt-

kownika. Należy go używać z rozmysłem. Korzystanie z tego zabie-

gu wizualnego bez powodu może wywołać konfuzję u użytkownika

oraz wprowadzić chaos do projektu strony.

Aby wszystkie layout’y naszego serwisu posiadały jednolity cha-

rakter, dobrym sposobem jest korzystanie z siatek (grid). Jest to

technika zapożyczona z projektowania drukowanych gazet.

Siatka pozwala na zachowanie porządku i ujednolica wszystkie pro-

jekty, jednocześnie dając grafikowi dużo wolności co do kompozycji

poszczególnych elementów layout’u.

Wizualny projekt strony internetowej powinien tworzyć jedną

spójną całość, zarówno wewnątrz siebie jak i na zewnątrz. Elemen-

ty strony należy wykorzystywać konsekwentnie, jeżeli np. jeden

komunikat pojawia się w wielu miejscach, to powinien on wyglądać

tak samo w każdym z nich.

Projekt graficzny strony internetowej powinien być spójny również

z resztą mediów, w jakich pojawia się nasza firma. Dzięki temu mo-

45

żemy stworzyć u naszych klientów jednolity obraz naszej marki.

Ważnym aspektem budowania identyfikacji wizualnej firmy jest

użycie koloru. Dzięki konsekwentnemu jego wykorzystaniu, orga-

nizacjom z całego świata udaje się wytworzyć w głowach konsu-

mentów klarowny obraz firmy. Przykładem jest Facebook i kolor

niebieski lub Coca Cola i czerwień.

Identyfikacje tych marek posiadają kolor przewodni, ale korzysta-

ją również z palety uzupełniających się kolorów, które umożliwia-

ją właściwy dobór barwy w zależności od potrzeby użycia. Dzięki

temu możliwe jest zachowanie spójności wizualnej we wszystkich

potrzebnych materiałach.

Innym sposobem na stworzenie tożsamości marki jest typogra-

fia. Niektóre firmy zamawiają dla siebie własne kroje pisma, aby

wzmocnić oryginalność identyfikacji wizualnej.

Typografia rządzi się takimi samymi prawami jak inne aspekty sztu-

ki wizualnej. Może tworzyć kontrast, prowadzić wzrok użytkowni-

ka. Powinna być używana w sposób spójny i służyć użyteczności.

Do długich bloków tekstów powinny być używane proste kroje,

które sprzyjają czytelności. Do krótszych tekstów, nagłówków,

nazw, można używać bardziej charakterystycznych krojów, o ile nie

zaszkodzi to użyteczności.

Ostatecznym produktem Szkieletu był wireframe, na etapie Po-

wierzchni jest nim mock up.

46

Mock up jest to wizualizacja skończonej strony internetowej, zbu-

dowanej na podstawie wireframe. Przyjmuje kształt kolorowej gra-

fiki, skomponowanej z wybranych elementów, tekstów, guzików,

zdjęć i ilustracji. Mock up jest czymś więcej niż pokolorowanym

wireframe, może się nieco od niego różnić, jednak jest kontynuacją

głównych założeń zawartych w Szkielecie, szczególnie tych doty-

czących projektowania informacji.

Powierzchnia jest ostatnim elementem w rozłożonym na 5 części

User Experience.

47

P r o j e k t a n t U s e r E x p e r i e n c eC z y m z a j m u j e s i ę U X D e s i g n e r ?Rola projektanta UX nie jest jeszcze przez wszystkich dobrze ro-

zumiana. Często można napotkać oferty pracy lub opowieści osób,

które mówią o tym, że oczekuje się od nich wyłącznie szkicowania

tzw. „makiet” (inaczej wireframów, czyli szkiców, szkieletów stron in-

ternetowych, które potem grafik lub UI opracowuje wizualnie, a pro-

gramista programuje), bez żadnego kontaktu z klientem albo badań.

W prawidłowym procesie projektowym makiety są końcowym

efektem pracy User Experience Designera, poprzedzonym wieloma

badaniami i analizami.

Rolą projektanta UX jest zrozumienie dlaczego projekt ma powstać,

na jakich założeniach się opiera, jakie problemy ma rozwiązywać,

kim są ludzie, którzy będą z niego korzystać, jakie są ich potrzeby,

zachowania, przyzwyczajenia, upodobania oraz w jakim kontekście

będą tego produktu używać. UX designer jest osobą, która pełni

rolę adwokata użytkownika. Jego zadaniem jest sprawienie, aby

potrzeby biznesowe (czyli zarobienie pieniędzy na produkcie) spo-

tkały się z potrzebami użytkownika (żeby ludzie chętnie wracali do

48

strony czy aplikacji). Osiąga ten cel poprzez przejście długiego pro-

cesu projektowego.

K t o z o s t a j e U X D e s i g n e r e m ?

Projektantami UX zostają w Polsce osoby z bardzo różnych branż

i z różnym wykształceniem. Jest tak z powodu tego, że nie ma

w naszym kraju jeszcze studiów bezpośrednio dedykowanych dla

User Experience (prócz podyplomowych UXD na SWPS), ale może

również dlatego, że sama dziedzina jest interdyscyplinarna. Łączy

w sobie zagadnienia z psychologii, marketingu, programowania

oraz grafiki.

Dobry UX Designer musi umieć zadawać odpowiednie pytania,

żeby dowiedzieć się od klienta wszystkich potrzebnych informa-

cji - jak dziennikarz. Musi chłonąć nowe trendy w projektowaniu,

mieć poczucie estetyczne i rozumieć działanie barw i kształtów -

jak grafik. Musi wykazywać się empatią w stosunku do użytkowni-

ków, dla których projektuje. Umieć schować ego do kieszeni i mieć

dystans do swoich pomysłów, odrzucając je i wciąż poprawiając.

Powinien potrafić słuchać, żeby móc zrozumieć potrzeby swoich

klientów i użytkowników. Interesować się technologią i rozumieć

zasady programowania. Niezbędna jest również umiejętność pracy

w grupie, gdyż UX Designerzy są zazwyczaj częścią zespołu. Na

koniec, projektant UX musi umieć sprzedać swój pomysł klientowi,

potrzebuje więc umiejętności marketingowych.

49

Według badania „Specjaliści User Experience 2015” przeprowa-

dzonego przez Joannę Kwiatkowską, Tomasza Skórskiego i Michała

Aleksandra, UX-ami zostają w Polsce najczęściej osoby które ukoń-

czyły studia związane z psychologią, informatyką lub socjologią, ale

często również po kognitywistyce i Akademii Sztuk Pięknych na

wydziale Wzornictwa Przemysłowego.

Najwięcej osób w tej branży pracuje w Warszawie, Trójmieście,

Wrocławiu, Poznaniu i Krakowie, co nie jest zaskoczeniem, ponie-

waż są to największe ośrodki miejskie w Polsce.

Z uwagi na to, że sama dziedzina jest stosunkowo młoda, średnia

wieku ludzi wykonujących ten zawód jest również niska i wynosi

około 30 lat (najwięcej projektantów jest w wieku 25 - 30 lat).

C z y m r ó ż n i s i ę U X o d U I D e s i g n e r a ?Role User Experience i User Interface Designera są ze sobą ściśle

powiązane i dlatego często mylone.

W kompetencji UX Designera jest sprawienie, żeby użytkownik

w kontakcie z produktem czuł przyjemność i satysfakcję, by produkt

był łatwy w obsłudze i użyteczny.

Natomiast UI Designer jest bliżej sztuki wizualnej, jego rolą jest spra-

wienie, by zawartość i layout strony czy aplikacji, były atrakcyjnym

50

i angażującym doświadczeniem dla użytkownika.

Do zadania UX Designera będzie należało zaprojektowanie, co

i w którym miejscu interfejsu ma się pojawić, a do UI Designera,

jak będzie to wyglądać.

Różnicę między UX a UI najlepiej obrazuje zdanie wypowiedziane

przez Helga Moreno:

„Jeśli coś wygląda świetnie, ale jest trudne w obsłudze, to znaczy że

ma świetne UI i słaby UX, jeśli coś jest bardzo intuicyjne, ale wyglą-

da okropnie, to znaczy że ma świetny UX i kiepski UI.”

U n i c o r n

Mianem „Unicorn” (ang. „jednorożec”) określa się osobę, która ma

w swojej kompetencji łączyć umiejętności UX Designera, badacza,

grafika/UI Designera, marketingowca oraz programisty. Nazwa

pochodzi stąd, że są to osoby niezwykle rzadkie a ich istnienie

jest niemal mityczne.

Pracodawcy bardzo chętnie piszą ogłoszenia z wymaganiami na

Unicorn’a, wymagając znajomości programów graficznych: Photo-

shop, Illustrator, pixel perfect, umiejętności przeprowadzania badań

z użytkownikami, technik User Centered Design, tworzenia makiet,

Axure (program do tworzenia makiet), HTML, CSS i Java Script.

W rzeczywistości bardzo trudno spotkać osobę która łączy te

wszystkie kompetencje na wysokim poziomie, dlatego tak i ogło-

51

szenia jak i pojęcie Unicorn’a są traktowane przez środowisko User

Experience Designerów z przymrużeniem oka.

U X / U I D e s i g n e r

UX/UI Designer jest to osoba łącząca w sobie obowiązki User

Experience oraz User Interface Designera.

Z tego powodu pracodawcy chętnie zatrudniają ludzi na to stano-

wisko, oszczędzając pieniądze.

Plusem posiadania UX/UI Designera, zamiast 2 oddzielnych stano-

wisk, jest to, że UX/UI w jednej osobie będzie rozumiał obowiązki

zarówno UX jak i UI. Na etapie projektowania UX, będzie znał moż-

liwości i ograniczenia związane z grafiką, a komponując ostateczny

wygląd interfejsu, dobierając kolory itp. na pewno będzie pamiętał

o zachowaniu odpowiedniej architektury informacji.

Z drugiej strony jednak, osoba zajmująca się dwoma rzeczami na

raz nie jest w stanie żadnej z nich poświęcić wystarczająco dużo

uwagi, co odbija się na jakości rozwiązań.

Poza tym, rzadko można spotkać kogoś, kto będzie ekspertem

w wielu dziedzinach. Jest to po prostu mało prawdopodobne, że

dobry UX Designer będzie dobrze projektował UI i odwrotnie.

52

P r o c e s p r o j e k t o w y

I d e a l n y p r o c e s p r o j e k t o w yPraca UX designera jest procesem, który można podzielić na 4 kroki:

1. Anal iza potrzeb kl ientów i rozpoznanie rynku

2. Poznanie możl iwości i ograniczeń technicznych

3. Projektowanie i testy

4. Wdrożenie

1. Anal iza potrzeb kl ientów i rozpoznanie rynku

Każdy proces projektowy powinien rozpocząć się analizą potrzeb

klientów oraz rozpoznaniem rynku. Sprawdzeniem, czy jest zapo-

trzebowanie na dany produkt, czy istnieją już podobne i rozwiąza-

nia i jak się sprawują.

Przykładem mogą być mężczyźni posiadający w domu kwiaty. W cza-

sie obserwacji okazuje się, że w natłoku innych obowiązków, mają

oni problem z pamiętaniem o ich podlewaniu. Tak powstaje pomysł

na stworzenie aplikacji mobilnej. Program ma pomagać użytkow-

nikom, będzie rozpoznawać rośliny i określać ile wody potrzebują,

a potem przypominać o podlewaniu przez wysyłanie notyfikacji.

53

Założeniem biznesowym jest to, że aplikacja będzie zarabiała na

siebie dzięki temu, że będzie miała nie tylko darmową wersję pod-

stawową, ale też będzie zachęcać do wykupienia płatnej wersji

rozszerzonej.

Po analizie rynku stwierdzono, że projekt ma szansę sukcesu, jeżeli

faktycznie aplikacja będzie potrafiła prawidłowo rozpoznać rośliny

i określać ich zapotrzebowanie na wodę.

2. Poznanie możl iwości i ograniczeń technicznych

Mamy już istotne informacje o klientach oraz ogólny zarys aplikacji

wynikający z wymagań biznesowych. Już w tym momencie mogą

przychodzić nam do głowy sposoby działania aplikacji, zanim jed-

nak zaczniemy projektować, powinniśmy skonfrontować nasze po-

mysły z możliwościami ich zrealizowania.

Nasza aplikacja ma rozpoznawać rośliny i do odpowiedniego ga-

tunku dobierać ilość wody potrzebnej w ciągu dnia. To oznacza,

że musi uwzględniać nie tylko działania uruchamiane przez użyt-

kownika, ale przede wszystkim dane, które musi dostarczać apli-

kacja. To, w jaki sposób zaprojektujemy aplikację, wpłynie na jej

realizację techniczną, dlatego musimy sobie zdawać sprawę z ogra-

niczeń technologicznych. Dzięki temu będziemy mogli zrozumieć,

jak mniej więcej nasza aplikacja miałaby działać i skąd czerpać po-

trzebne informacje (np. czy mogłaby rozpoznawać roślinę już po

zrobieniu zdjęcia?).

54

3. Projektowanie i testy

Wiemy już wystarczająco dużo, żeby zacząć projektować. Zdaje-

my sobie sprawę z wymagań biznesowych, potrzeb użytkowników

oraz możliwości technicznych. Warto w tej chwili zaznajomić się

z podobnymi produktami na rynku. Być może rozwiązanie nad któ-

rym pracujemy, funkcjonuje już i nie warto wymyślać wszystkiego

od początku. Dobrze jest również zapoznać się z obowiązującymi

standardowo rozwiązaniami.

Możemy zacząć projektowanie. Każdy nasz pomysł powinien zo-

stać skonfrontowany z realnym użytkownikiem podczas testów

użyteczności. Tylko dzięki temu będziemy mieć pewność, że nasze

rozwiązanie jest zrozumiałe i użyteczne dla innych.

Testy użyteczności polegają na pokazaniu użytkownikowi naszego

projektu strony i obserwacji w jaki sposób użytkownik wykonuje

zlecone mu zadania. Test ma na celu odkrycie błędów, miejsc które

są niezrozumiałe i które można ulepszyć. Po każdej poprawce na-

niesionej po takim teście, trzeba ponownie wykonać badanie, żeby

upewnić się, że tego chcą użytkownicy.

Celem badań użyteczności nie jest tylko sprawdzenie czy koncep-

cja aplikacji jest zrozumiała, ale też czy interfejs jest łatwy do na-

uczenia się i obsługi.

Musimy pamiętać w jakim kontekście użytkownicy korzystają z apli-

kacji, są cały czas narażeni na wiele różnych dystrakcji, np przejeż-

dżające tramwaje, dzwoniący telefon czy rozmowa ze współloka-

55

torem. Aplikacja musi być możliwa do obsługi w naszym szybkim,

pełnym bodźców świecie.

W przypadku urządzeń mobilnych w grę wchodzą również takie czyn-

niki jak szybkość i stabilność internetu. To również trzeba brać pod

uwagę przeprowadzając testy użyteczności (np. w naszym budynku

z szybkim łączem internetowym aplikacja będzie działać świetnie,

natomiast może się okazać, że zupełnie inaczej radzi sobie na ulicy,

co w znaczny sposób wpłynie na jej rzeczywistą użyteczność).

4. Wdrożenie

Zaprojektowanie aplikacji nie powinno być końcem pracy UX Desi-

gnera. W tej chwili projekt zaczyna wchodzić w życie, być wdrażany.

To ważne, żeby uczestniczyć również w tym etapie, a nie tylko od-

dać skończone makiety. W przeciwnym razie projekt będzie zmie-

niany za każdym razem, kiedy napotka jakiś problem techniczny

i może zabraknąć osoby, która będzie bronić interesów użytkow-

nika, a końcowa wersja aplikacji będzie wyglądać inaczej niż to, co

zaprojektowaliśmy, nie będzie tak użyteczna i praca UX Designera

pójdzie na marne.

Po wdrożeniu pojawia się pytanie o to, czy udało nam się osią-

gnąć zakładany na początku cel. Żeby to określić, używa się Key

Performance Idnicator, jest to miara osiągnięcia celów organizacji.

Np. jeśli naszym celem było sprzedanie płatnej wersji aplikacji,

56

sprawdzamy ilu użytkowników ściągnęło płatną wersję i porównu-

jemy zakładany na początku wynik z tym, jaki faktycznie osiągnę-

liśmy. Jeśli projekt polegał na usprawnieniu jakiejś funkcji aplikacji

(np. na zwiększeniu konwersji), wtedy porównujemy dane sprzed

i po wprowadzeniu zmian.

P r o c e s p r o j e k t o w y w p r a k t y c eW grudniu 2016 firma Efigence, zajmująca się tworzeniem aplikacji

bankowych, zorganizowała warsztaty UX o nazwie Efigence Camp

2016. Miałam okazję w nich uczestniczyć i prześledzić proces bu-

dowania aplikacji krok po kroku, na własnej skórze.

Warsztaty składały się z 8 zajęć i zostały podzielone na etapy:

1. Brief i debrief

2. Badanie potrzeb użytkowników

3. Design opportunit ies

4. Bench marking i anal iza konkurencj i

5. Projektowanie wizj i rozwiązania

6. Badania użyteczności

7. Sprzedaż wizj i rozwiązania

8. Prezentacja projektów

1. Brief i debrief

UX Designer w firmie Efigence jest osobą, która zostaje wynaję-

57

ta przez zewnętrzną firmę do zrealizowania jakiegoś jej projektu,

w tym przypadku mobilnej aplikacji bankowej.

Zazwyczaj projekt rozpoczyna się, kiedy klient wysyła projektanto-

wi dokument (np. e-mail), w którym nakreśla swoją wizję, opisuje

czego potrzebuje i jak chce to osiągnąć, nosi on nazwę brief .

Na warsztatach zostaliśmy uprzedzeni, że klienci nie wiedzą do-

kładnie czego potrzebują, w briefie zawierają swoje intencje do-

tyczące projektu oraz informacje, które uznają, że są potrzebne

projektantowi, co nie oznacza, że faktycznie piszą tam wszystko, co

musimy wiedzieć przed rozpoczęciem pracy.

Ważnym zadaniem projektanta jest zrozumienie co klient chce

osiągnąć, co będzie uważał za sukces, w jaki sposób będzie go mie-

rzył, dlaczego w ogóle zleca powstanie tej aplikacji, dla kogo ona

powstaje (kim jest jej końcowy użytkownik, jakie są jego potrzeby,

jakie cele użytkownika ma zaspokajać?), jak wygląda konkurencja

klienta (z kim będzie konkurować nasza aplikacja? jakie benefity

dają użytkownikowi aplikacje konkurencji? kim jest główny konku-

rent? czy na rynku jest jakaś luka?).

Dobrze jest również zapytać, o jakich aplikacjach mówi się w firmie

klienta, oraz które z nich najbardziej lubi, ponieważ, nawet pod-

świadomie, będzie do nich porównywał nasz projekt.

Ustalenie tych wszystkich rzeczy jest niezwykle istotne, ponieważ

58

klient będzie nas na końcu rozliczał. Jeśli w tym momencie nie zro-

zumiemy wszystkich wymagań i nie wyciągniemy wszystkich po-

trzebnych nam potem informacji, nie zdołamy spełnić tego, czego

się od nas oczekuje.

Naszym pierwszym zadaniem było podkreślenie na wydrukowa-

nym dokumencie tych wiadomości, które są celami biznesowymi

klienta i z których będziemy rozliczani na koniec projektu. Stara-

liśmy się je oddzielić od hipotez i intencji jakie klient posiada (np.

klient powiedział, że użytkownicy potrzebują edukacji dotyczącej

oszczędzania - to do nas jako projektantów należy sprawdzenie,

czy faktycznie tak jest).

W grupie sześciu osób przygotowaliśmy serię pytań, które miały

nam pomóc w zrozumieniu, czego klient oczekuje od projektu, co

chciałby osiągnąć.

Zazwyczaj na analizę briefu projektant ma kilka dni, jest to ważny

moment. To bardzo istotne, żeby projektant od początku rozumiał

o co chodzi klientowi, bo tylko wtedy będzie mógł to dostarczyć.

Następnie przychodzi czas na debriefing .

Debriefing jest to spotkanie UX Designera z klientem, na którym

projektant ma szanse zadać wszystkie nurtujące pytania i rozwiać

wątpliwości dotyczące briefu, zanim zabierze się do pracy.

59

Dowiedzieliśmy się, że celami naszej aplikacji mobilnej są:

• zbudowanie trwałej i silnej relacji użytkownika z bankiem po-

przez zaspokojenie najważniejszych potrzeb finansowych użyt-

kownika oraz przez częste korzystanie z aplikacji.

• zdobycie istotnej komunikacyjnie przewagi konkurencyjnej na

rynku polskim i dzięki temu przejęcie potencjalnych klientów

• zwiększenie sprzedaży kredytów gotówkowych

2. Badania potrzeb użytkowników, wywiady pogłębione

Sercem projektowania UX są jego użytkownicy. Na drugim spotka-

niu zajęliśmy się badaniem ich potrzeb. Istnieje wiele metod badań

przeprowadzanych z użytkownikami, w tym wypadku prowadzący

zdecydowali się na tzw. wywiady pogłębione .

Wywiady pogłębione dzielą się na ustrukturyzowane i swobodne.

Wywiady swobodne przebiegają podobnie jak normalna rozmowa

na jakiś określony temat. Badacz w trakcie wywiadu formułuje py-

tania i ustala ich kolejność.

W wywiadzie ustrukturyzowanym badacz zadaje użytkowniko-

wi pytania, których treść i kolejność została wcześniej ustalona.

Przypomina to wypełnianie ankiety z pomocą badacza. Ten rodzaj

wywiadu jest łatwiejszy w interpretacji, ponieważ łatwiej porównać

ze sobą wyniki kilku badań.

W czasie warsztatów przeprowadziliśmy wywiady, które czerpią

60

z jednej i drugiej metody (wywiady semi-ustrukturyzowane). Przy-

gotowaliśmy listę pytań, które zadawaliśmy w różnej kolejności

w trakcie rozmowy.

Zanim przeprowadzimy jakiekolwiek badanie z użytkownikami, bar-

dzo ważne jest zadbanie o to, z kim mamy je przeprowadzić (tzw.

dobór próby). Wyniki będą wartościowe wyłącznie, jeśli wykorzy-

stamy do badań osoby, które pasują do profilu naszych potencjal-

nych użytkowników, czyli w tym przypadku, są to:

• obecni klienci banku korzystający z istniejącej aplikacji: osoby

w wieku 18-45 lat, świadome technologicznie, preferujące rozli-

czenia bezgotówkowe

• obecni klienci banku niekorzystający z aplikacji

• studencie ostatnich lat oraz absolwenci po raz pierwszy samo-

dzielnie zakładający konto bankowe

• mikroprzedsiębiorcy rozpoczynający działalność gospodarzą

• klienci innych banków niezadowoleni z poziomu świadczonych

usług.

Ponieważ w tym przypadku osoby uczestniczące w warsztacie od-

powiadały profilowi użytkowników, przeprowadziliśmy wywiady

między sobą.

Zależało nam na określeniu celów i trudności związanych z go-

spodarowaniem finansami, poznaniu metod z pomocą których

użytkownicy odnajdują się w swoich finansach w tym momencie,

określeniu potencjału do zwiększenia sprzedaży kredytów gotów-

61

kowych w kanale mobilnym (ważny cel biznesowy klienta), zrozu-

mieniu oczekiwań i barier użytkowników wobec bankowych apli-

kacji mobilnych.

Porównując wspólnie zebrane dane zauważyliśmy wzorce zachowań

i wyodrębniliśmy 3 typy użytkowników naszej aplikacji, jest to Cho-

mik (odkłada pieniądze na później), Control-freak (mocno kontroluje

każdy swój wydatek) i Beztroski (nie przejmuje się wydatkami).

Na tej podstawie stworzyliśmy 3 persony.

Persona jest to wymyślony profil użytkownika, nie przedstawia

ona konkretnej osoby a raczej pewien zbiór. Jest „typowym” użyt-

kownikiem stworzonym z danych o wielu potencjalnych użytkow-

nikach aplikacji.

Persona ma za zadanie pomóc projektantowi wyobrazić sobie dla

kogo projektuje, pobudzić jego empatię. Użytkownicy aplikacji czę-

sto różnią się od osób które je tworzą, mają inne przyzwyczajenia,

używają innego słownictwa. Stworzenie persony ma przypominać

projektantowi że nie projektuje on dla siebie.

Każda nowa funkcjonalność musi być „skonsultowana” z personą

i odpowiadać na jej potrzeby.

Persona przybiera formę dokumentu, który składa się zazwyczaj ze

zdjęcia, imienia i nazwiska, zawodu, wieku, hobby , ulubionych apli-

kacji, poziomu znajomości technologii, skróconego opisu charakte-

ru oraz stylu życia. W naszej pojawił się również poziom zaufania

do banków oraz wysokość dochodów.

62

WAŻNE WSKAŹNIKI:Zaufanie do banków 8/10Otwartość na nowości 5/10Znajomość technologii 7/10

Karol - CONTROL FREAK

PERSONAKompozycja informacji o wielu użytkownikach, przedstawiona w formie profilu jednej osoby.

Muszę nad tym usiąść i jeszcze przemyśleć.

WIEK: 35 latWYKSZTAŁCENIE: WyższeZAWÓD: Administrator nieruchomościDOCHODY: Powyżej 3000zł

“„

63

HISTORIA:Karol jest szczęśliwym mężem i ojcem. Na pierwszym miejscu stawia rodzinę. Jako jej głowa czuje się odpowiedzialny za jej bezpieczeństwo i stabilizację. Pracuje na pełny etat w jednej z warszawskich spółdzielni. Nie zarabia wiele, ale stawia sobie za priorytet, żeby za to co ma zapewnić każdemu z członków swojej rodziny wszystko czego ten potrzebuje. Co miesiąc musi wystarczyć na prywatną opiekę zdrowotną, fitness dla żony, wyjścia do teatru i restauracji, językowe przedszkole i zabawki dla ukochanego synka.

CECHY CHARAKTERU:• skrupulatny • dokładny • wyważony

CELE:• Posiadanie zawsze 100% kontroli• Zapewnienie “pełnego” życia swojej rodzinie• Posiadanie poczucia bezpieczeństwa, zarówno teraz jak w

przyszłości

FRUSTRACJE:• Trudno trzymać rękę na pulsie przy wielu codziennych

wydatkach i wspólnym koncie• Strach przed niewystarczającą ilością pieniędzy• Brak jednego dobrego narzędzia do kontrolowania

wydatków (korzysta z notatek, aplikacji, Excela)

WARTOŚCI:• Rodzina• Bezpieczeństwo

• Stabilizacja• Kontrola

64

Ważne, aby persona była jak najbardziej wiarygodna, ponieważ

wtedy najlepiej działa na wyobraźnię i wzbudza empatię.

3. Design opportunit ies

Na trzecim spotkaniu zajęliśmy się wyszukiwaniem bolączek naszych

użytkowników oraz sposobów, w jakie możemy je rozwiązać. W tym

celu wykonaliśmy ćwiczenie mapowanie ekosystemu usługi .

Jest to narzędzie, które ma pomóc projektantowi lepiej zrozumieć

cały ekosystem w jakim porusza się na codzień nasza persona.

W pierwszej fazie ćwiczenia wypisaliśmy na karteczkach wszystko,

co o personie wiemy (np. to gdzie mieszka, gdzie pracuje), oraz wy-

myślaliśmy rzeczy, które pasują do niej i do jej stylu życia (np. w jaki

sposób lubi spędzać czas ze znajomymi, co kupować, gdzie wyjeż-

dżać na wakacje).

Bolączki (pain-points)

W drugiej fazie ćwiczenia, staraliśmy się wyszukać bolączki jakie

nasza persona może napotykać w obszarach życia, które właśnie

znaleźliśmy (np. jeśli spędza wakacje poza Polską, to być może

napotyka problemy z ubezpieczeniem zdrowotnym albo wypłace-

niem pieniędzy za granicą).

Dowiedzieliśmy się, że nasza persona prowadzi konsumpcyjny tryb

życia. Ma marzenie, jakim jest wyjazd w podróż poślubną na Bali,

ale ciężko jest jej regularnie oszczędzać w obliczu tylu innych pokus.

65

MAPOWANIE EKOSYSTEMU USŁUGIW rzeczywistości robiliśmy ćwiczenie na wydruku ok. 100/140 cm przyklejając na niego karteczki z napisami.

66

Rozwiązania

W trzeciej fazie staraliśmy się znaleźć możliwie najlepsze rozwią-

zania bolączek które odkryliśmy poprzednio. Wymyśliliśmy m.in, że

przydałoby się naszej personie coś w rodzaju świnki skarbonki, do

której łatwo odkładałaby pieniądze.

Wybór funkcjonalności

Z wszystkich naszych pomysłów wybraliśmy te, które najlepiej od-

powiadają celom biznesowym klienta a jednocześnie są ważne dla

persony. Podzieliliśmy się na grupy i ja wraz z drugą koleżanką już

do końca trwania warsztatów pracowałyśmy nad funkcjonalnością

„Świnka skarbonka”.

Mapowanie doświadczeń użytkownika

W poprzednim ćwiczeniu daliśmy upust swojej wyobraźni i kre-

atywności. Teraz przyszedł czas, żeby zastanowić się jak nasza

aplikacja będzie funkcjonowała w rzeczywistości, w jaki sposób

użytkownik będzie wchodził z nią w interakcję i jakich zasobów bę-

dzie potrzebowała aplikacja, żeby sprawnie funkcjonować.

4. Bench marking i anal iza konkurencj i .

Na tym etapie jesteśmy już prawie gotowi do rozpoczęcia szkico-

wania ekranów. Zanim jednak to nastąpi możemy sprawdzić, jak

wyglądają rozwiązania konkurencji oraz podobne aplikacje na ryn-

ku zagranicznym.

67

Bench marking jest to szukanie inspiracji. Ma ono na celu czerpanie

z gotowych rozwiązań, które już funkcjonują. Upewnienie się, że

nie staramy się „wymyślić koła na nowo”.

Inspiracje mogą płynąć z aplikacji o podobnej tematyce, lub zu-

pełnie innej np. przy projektowaniu aplikacji „Świnka skarbonka”

inspirowaliśmy się Endomondo, która jest aplikacją monitorującą

treningi biegowe.

Analiza konkurencji pozwala poznać rynek na którym funkcjonuje

nasz klient. Dzięki niej możemy sprawdzić, czy nasze rozwiązanie

już funkcjonuje i jak się sprawdza. Być może konkurencja ma jakieś

rozwiązania, o których my nie pomyśleliśmy. Ponieważ analiza ca-

łych stron czy aplikacji to zbyt obszerny materiał, wybieramy mały,

interesujący nas zakres.

Na zajęciach dokładnie spisywaliśmy, jakie funkcjonalności po-

siadają wszystkie najważniejsze aplikacje bankowe w Polsce, pa-

trzyliśmy które z nich są dostępne na pierwszym ekranie przed

zalogowaniem, które po, a które wyświetlają się dopiero głębiej,

w kolejnych krokach i na kolejnych ekranach.

5. Projektowanie wizj i rozwiązania

W tym momencie mamy już wystarczająco dużą wiedzę aby zacząć

szkicować ekrany naszej aplikacji.

Dzięki analizie konkurencji wiemy, jak wyglądają inne aplikacje

bankowe, a dzięki benchmarkingowi mamy głowę pełną inspiracji.

68

ZAŁOŻENIE NOWEGO CELU

ZAOSZCZĘDZENIE NA PODRÓŻ POŚLUBNĄ

ZAŁOŻENIE NOWEGO CELU

INFORMACJA O TYM ILE, JAK CZĘSTO UŻYTKOWNIK CHCE OSZCZĘDZAĆ

OKREŚLENIE CELU: 15000 TYSI CZASU 12 MIESIĘCY,

Wąptpl iwośc i persony:czy będę o tym paiętać?czy mi s ię uda?czy mogę wydać aż ty le?

WYLICZENIE RATYpowiadomienia (motywujące ,informacje o tym czy b iorąc pod uwagę h istor ię rachunku ida s ię os ięgnąć ce l -> w c iągu ostatn iego pół roku wydałaś X ns restaurac je , X na spożywcze, X ,X na kosmetyk i . . . . )

OSZCZEDZANIE WG PLANU

OTRZYMANIE WYPŁATY

PRZELANIE DO SKARBONKI

WYGOSPODAROWANIEPIENIĘDZY

czy mi starczy na inne przy jemnośc i?czy zd jążę uzb ierać na czas?

WYSŁANIE POWIADOMIENIA(PODZIĘKOWANIE ZA WPŁATE)

UAKTUALNIENIE ŚCIEŻKI OSZCZĘDZANIA

informacja o prognoz ie i le uzb ierajeś l i utrzyma tempo

STAN KONTA

bezpieczeństwo,motywacja

wizual izac ja śc ieżk i( jak postępuje oszczędzanie)

Potrzeba użytkownika

MAPOWANIE DOŚWIADCZEŃUŻYTKOWNIKA

Początek oszczędzania

Zachowanie aplikacji

Potrzebne zasoby

Zdarzenie

W trakcie oszczędzania

69

NADWYŻKA PIENIĘDZY

OTRZYMANIE WYPŁATY+ DODATKOWA KWOTA ZA ZLECENIE

MOTYWACJA, PAMIĘTANIE O CELU

WYSŁANIE POWIADOMIENIA(HEJ, DOSTAŁAŚ DODATKOWEPIENIĄDZE, MOŻE CHCESZ JE WPŁACIC NA TEN CEL?)ap l ikac ja na początku będz ie zachęcać do costumal izac j i ,wgrania zd jęć , napisania k i lku zdań (oszczędzanie bywa trudne, naapisz d laczego ten ce l jest ważny

NIEDOBÓR PIENIĘDZY

NIESPODZIEWANE WYDATKI

NIEDOBÓR PIENIĘDZY

BRAKUJE 3 TYSIĄCE ZŁOTYCH, A WYJAZD ZA CHWILE!

BEZPIECZEŃSTWO, MARTWI SIE ZE NIE STARCZYPIENIĘDZY

PROPOZYCJA KREDYTU GOTÓWKOWEGO(NA LEPSZYCH WARUNKACH JEŚLI OSZCZĘDZAŁEŚZGODNIE Z PLANEM)

DOSTĘP DO OFERTY KREDYTOWEJ

WYSŁANIE PRZYPOMNIENIA,ZE W TYM MIESIACU NIE ODŁOZYLES PIENIEDZY

POKAZANIE ILE JUZ ZAOSZCZEDZILES(UAKTUALNIENIE ŚCIEŻKI )

STAN KONTA

W trakcie oszczędzania Koniec oszczędzania

70

Podstawą do rysowania ekranów jest mapa doświadczeń użytkow-

nika, na której dokładnie wypisaliśmy krok po kroku co robi użyt-

kownik w naszej aplikacji i w jaki sposób ona na to reaguje.

Ważne, żeby na tym etapie nie przejmować się szczegółami, rysować

grubym flamastrem, nie poprawiać i nie nadużywać kolorów. Jedyne

o czym musimy pamiętać to fakt, że elementy aplikacji będą w przy-

szłości obsługiwane palcem, muszą być więc „klikalne”, czyli odpo-

wiednio duże, żeby można było w nie łatwo kliknąć opuszkiem palca.

Te pierwsze, szybkie szkice, które w kolejnych krokach zmienią się

w gotowe ekrany aplikacji, noszą nazwę makiety low-fidelity.

6. Badania użyteczności

Następnym krokiem w projektowaniu aplikacji były badania uży-

teczności na papierowych prototypach.

Dzięki nim mogliśmy zweryfikować, czy to co do tej pory zrobiliśmy

jest zrozumiałe, gdzie popełniliśmy błąd, co sprawia problem i jak

możemy ulepszyć swój projekt.

W czasie badania użyteczności użytkownik proszony jest, aby za-

chowywał się tak, jakby papierowy rysunek był prawdziwą aplikacją

(tzn. klikał w przyciski, ikony itp.). Test odbywa się według wcze-

śniej przygotowanego scenariusza zadań (w naszym przypadku te-

stowany dowiedział się, że ma założyć nową „Świnkę skarbonkę” na

określoną kwotę).

Badania użyteczności powinno się przeprowadzać wielokrotnie, na

71

różnych etapach projektu, można je robić zarówno na papierowych

szkicach jak i gotowej stronie internetowej.

W tym wypadku testowaliśmy aplikację na papierowych proto-

typach. Musieliśmy w tym celu dokładniej przerysować każdy

z wcześniej naszkicowanych ekranów, wymyślić treść tekstów oraz

stworzyć każdy z elementów, który może być potrzebny do przej-

ścia całego procesu założonego w scenariuszu (np. klawiaturę).

Badanie zostało przeprowadzone w 3 osoby, jedna pełniła rolę in-

terfejsu (komputera), to znaczy reagowała na wszystkie działania

użytkownika (kiedy badany kliknął w klawiaturę wpisując 48, kom-

puter podstawiał karteczkę z napisem 48 w miejscu gdzie liczba

miała się wyświetlać, kiedy badany kliknął ok, komputer podstawiał

następny ekran itd.).

Druga osoba zajmowała się notowaniem obserwacji, zapisywała

wszystkie istotne wypowiedzi badanego, oraz jego reakcje. Trzecia

osoba była moderatorem, zadawała badanemu pytania i pilnowała,

aby wszystko szło założonym torem.

Badany był proszony o tzw. „myślenie na głos” (tzw. „protokół gło-

śnego myślenia”), dzięki czemu mogliśmy wiedzieć kiedy użytkow-

nik się waha, co robi, kiedy jest zaskoczony, a kiedy ma wątpliwości.

Był to ostatni etap projektowania w czasie warsztatów Efigence

Camp 2016 UX.

W prawidłowym procesie projektowym powinniśmy przeprowadzić

72

PAPIEROWY PROTOTYPSzkic wykorzystywanyw badaniach użyteczności

73

badanie użyteczności z minimum 3-5 użytkownikami, wprowadzić

poprawki i ponownie zrobić cykl badań.

7. Sprzedaż wizj i rozwiązania

Będąc UX Designerem nie wystarczy mieć świetne pomysły oparte

na realnych problemach użytkownika.

Trzeba jeszcze umieć do nich przekonać swojego klienta, w prze-

ciwnym razie wylądują w szufladzie i nie zostaną zaimplementowa-

ne, lub od razu zostaną odrzucone.

Żeby sprzedać swoją wizję, trzeba umieć opowiadać ciekawe histo-

rie, takie które wzbudzają emocje, które są wiarygodne, opowiadają

o ludziach i ich codziennych problemach.

Klient musi uwierzyć, że konsumenci będą korzystać z aplikacji i to

się przełoży na jego zysk.

Do opowiadania takiej historii możemy wykorzystać wiele środków,

np. zrobić animacje, nagrać film, odegrać scenkę z podziałem na

role, czy zrobić zabawną prezentację w Power-point.

Jednym z narzędzi, jakie możemy wykorzystać, jest storyboard.

Storybord, to komiks, którego głównym bohaterem jest użytkownik

aplikacji. Unika się w nim pokazywania ekranów i funkcji aplikacji,

zamiast tego pokazuje się w jaki sposób i w jakich sytuacjach użyt-

kownik wchodzi z nią w interakcję. Jakie jego potrzeby zaspokaja,

jakie problemy rozwiązuje, jak pomaga. Ważne, żeby historia była

wiarygodna i angażująca.

74

STORYBOARDObrazkowa historia opowiadająca, w jaki sposób nasz produkt odpowiada na potrzeby użytkowników.

75

76

77

78

Soryboard tworzy się często na wcześniejszym etapie projektowa-

nia, zanim jeszcze rozpoczniemy szkicowanie pierwszych ekranów.

Pozwala to projektantom łatwiej wyobrazić sobie jakie cele mają do

osiągnięcia użytkownicy aplikacji, a więc pomaga zrozumieć, jakie

funkcje aplikacja powinna posiadać.

8. Prezentacja projektów

Ostatnim krokiem warsztatów była prezentacja projektów przed

klientem oraz grupą.

79

R o z w ó j k a r i e r y p r o j e k t a n t a U XUX Design jest ściśle powiązany z technologią, która jak dobrze

wiadomo, bardzo szybko się zmienia. Dlatego każdy projektant UX

powinien nieustannie się rozwijać.

Społeczność

Zainteresowanie UX rośnie w tempie geometrycznym. Rok temu,

kiedy pierwszy raz usłyszałam o UX Design, w Warszawie odbywa-

ły się tylko jedne cykliczne spotkanie projektantów UX, a było to

UX Book Club, prowadzone przez Michała Dobrowolskiego.

Dziś w samej Warszawie odbywa się wiele cyklicznych spotkań,

jest to Service Design Drinks, Ladies that UX, Design Practise oraz

wspomniany już UX Book Club, od niedawna z nowymi prowadzą-

cymi. Wszystkie odbywają się co około miesiąc, jest więc wiele

okazji do zdobywania nowych znajomości.

Obecność wśród ludzi zainteresowanych UX daje możliwość dzie-

lenia się swoimi doświadczeniami, uczenia się od innych oraz zdo-

bywania kontaktów, które być może zaowocują w dalszej karierze.

Na każdym ze spotkań omawiany jest inny temat z zakresu User

Experience Design, więc nawet jeśli nie uda nam się z nikim zaprzy-

jaźnić, czas nie będzie stracony.

80

Społeczność internetowa

Prawdopodobnie najbardziej aktywnym miejscem w internecie,

w którym spotykają się polscy UX Designerzy, jest Facebook, a do-

kładniej grupa Usability PL. Jest to miejsce nieformalnych rozmów,

projektanci chętnie dzielą się tam między sobą śmiesznymi linkami

w temacie UX, krytyką źle zaprojektowanych serwisów lub dają so-

bie nawzajem wyzwania projektowe. W tym miejscu pojawiają się

informacje o wszystkich nowych wydarzeniach związanych z tema-

tyką, czasem oferty pracy lub prośby o pomoc od mniej zaawanso-

wanych projektantów.

Ludzie są tu zawsze bardzo otwarci i chętni do komentowania, żad-

ne pytanie nie pozostanie bez odpowiedzi.

Grupa Usability PL jest zdecydowanie miejscem do którego trzeba

zaglądać, jeżeli chce się trzymać rękę na pulsie.

M a g a z y n y i n t e r n e t o w e

Jest wiele wartościowych, świetnie napisanych magazynów interne-

towych o tematyce UX. Oferują one regularny zastrzyk nowej dawki

wiedzy od osób, które zajmują się UX Designem w codziennej pracy.

Jedne z bardziej popularnych, to:

• UX Booth: www.uxbooth.com

• A List Apart: www.alistapart.com

• Boxes and Arrows: www.boxesandarrows.com

81

• Snashing Magazine: www.smashingmagazine.com

• UX Matters: www.uxmatters.com

P o r t a l e e - l e a r n i n g o w e

Inną opcją na samodzielną naukę w zaciszu własnego domu są

portale e-learningowe. Oferują one kursy w formie filmów on-line,

które można oglądać w dowolnej chwili. Plusem tego rozwiązania

jest niewątpliwie wygoda. Kursy posiadają zebrany i przygotowa-

ny przez profesjonalistów materiał, dzięki temu mamy doczynienia

z uporządkowaną wiedzą.

Kursów oraz wykładów możemy szukać na:

• User Interface Engineering Virtual Seminars: www.uie.com/

events/virtual_seminars/

• Rosenfeld Media Virtual Seminars: http://rosenfeldmedia.com/

seminars

• Lynda.com: www.lynda.com

• TreeHouse: http://teamtreehouse.com

• Coursera: www.coursera.org

Ciekawym, moim zdaniem, kursem, jest Design Kit: The Course

for Human-Centered Design by +Accumen, Ideo. Jest to kurs on-

-line o nietypowej formule. W przeciwieństwie do innych platform,

z których korzysta się przez oglądanie filmów siedząc wygodnie

w fotelu, kurs Design Kit Human-Centered Design wymaga wyjścia

z domu, spotkań z ludźmi i własnoręcznej pracy.

82

Zajęcia odbywają się w grupie 2-6 osób, uczestnicy mogą stwo-

rzyć własne zespoły wraz ze znajomymi, lub wyszukać partnerów

przez platformę. Kurs podzielony jest na 5 lekcji - kroków w proce-

sie HCD, które wykonuje się razem ze swoim zespołem przez ok.

siedem tygodni. W tym czasie rozwiązuje się jeden problem projek-

towy za pomocą zasad Design Thinking (Human-Centered Design).

Pierwszą część każdej lekcji stanowi czytanka, tekst tłumaczy na-

turę zadania oraz podaje przykłady inspirujących rozwiązań. Drugi

etap lekcji to praca w grupie według zeszytu ćwiczeń.

Efekty pracy naszego zespołu poddane są ocenie innych uczest-

ników kursu. Jako część zaliczenia, my również mamy obowią-

zek sprawdzać dokonania innych. Jest to ciekawy etap, ponieważ

w Design Kit HCD biorą udział ludzie z całego świata.

Kurs jako jeden z nielicznych jest darmowy, więc wszystko czego

potrzebujemy by wziąć w nim udział, to dostęp do internetu oraz 4

godziny tygodniowo wolnego czasu.

K s i ą ż k iCzytanie książek jest moim zdaniem najlepszym źródłem wiedzy

o UX. Oferują kompleksowe i dogłębne omówienie różnych pro-

blemów i zagadnień.

W internecie można znaleźć wiele list tytułów wartych przeczyta-

nia, tworzonych przez profesjonalnych UX Designerów.

83

Przykładowa lista 10 książek, które trzeba przeczytać, to:

• Steve Krug „Don’t Make Me Think”

• Steve Krug „Rocket Surgery Made Easy”

• Eric Reiss „Usable Usability: Simple Steps for Making Stuff

Better”

• Jesmond J. Allen, James J. Chudley „Smashing UX Design: Foun-

dations for Designing Online User Experiences”

• Jeff Sauro, James R Lewis „Quantifying the User Experience:

Practical Statistics for User Research”

• Andy Polaine, Lavrans Løvlie, Ben Reason „Service Design: From

Insight to Implementation”

• Leah Buley „The User Experience Team of One: A Research and

Design Survival Guide”

• Jeff Gothelf, Josh Seiden „Lean UX: Applying Lean Principles to

Improve User Experience”

• Jakob Nielsen, Raluca Budiu „Mobile Usability”

• Susan Weinschenk „100 Things Every Designer

Needs to Know About People (Voices That Matter)”

Leah Buley, autorka „The User Experience Team of One” poleca

przeglądanie katalogów wydawnictw, które specjalizują się w książ-

kach dla specjalistów UX, są to:

• Rosenfeld Media

• New riders

• O’Reilly

• A Book Apart

84

K o n f e r e n c j e

Konferencje gwarantują zastrzyk inspiracji, wiedzy i nowych znajo-

mości, a wszystko to w bardzo krótkim czasie. Warto na nie chodzić

przynajmniej raz w roku. Najlepiej wybrać jedną na którą będzie-

my uczęszczać regularnie, wtedy możemy utrzymywać znajomości

z osobami które też odwiedzają tą konferencję co roku. Ułatwi nam

to też obserwacje zmieniających się trendów w poruszanych na

konferencji zagadnieniach.

Kompleksowa lista konferencji znajduje się na www.interaction-de-

sign.org oraz www.lanyrd.com.

W Polsce co roku organizowana jest konferencja UX Poland, któ-

ry ma miejsce w Warszawie. Jest to jedyna tak duża konferencja

w kraju, w której prelegenci są profesjonalistami z całego świata.

Mniejsza konferencja, na którą jednak warto się wybrać, to World

Usability Day, organizowany w kilku dużych miastach w Polsce,

m.in. na warszawskiej Pradze.

W 2016 roku odbyła się po raz pierwszy UX Conference, i mam

nadzieję że od tej pory zacznie być organizowana cyklicznie.

Wiele wykładów na konferencjach z całego świata jest nagrywa-

nych i publikowanych za darmo on-line, można je obejrzeć np. na

youtube.com.

Ważną częścią konferencji jest poznawanie innych ludzi z branży.

85

Warto budować nowe kontakty, być otwartym i przyjaznym, wycho-

dzić na przerwy i wspólne posiłki, przedstawić się osobie siedzącej

obok. Nigdy nie wiadomo kiedy nowe znajomości się przydadzą.

Konferencje potrafią być bardzo kosztowne, dlatego warto spytać

swojego pracodawcy, czy nie zgodzi się na pokrycie kosztów wstę-

pu oraz podróży. Wielu dostrzega w tym sposób na rozwój swoich

pracowników.

Jeśli jednak tak się nie stanie, można spróbować zaproponować

organizatorom konferencji wolontariat. W zamian za pomoc przy

organizacji czasem pozwala się obsłudze na nieodpłatne wzięcie

udziału w wykładach.

Wa r s z t a t yWarsztaty to forma nauki przez praktykę. Są sposobem na zdobycie

doświadczenia i budowanie pewności co do swoich możliwości.

Z tego co mi wiadomo, w Polsce nie ma na razie instytucji, któ-

ra regularnie zajmowałaby się ich organizowaniem. Jednak w cią-

gu ostatnich lat bardzo zmienia się sytuacja, dlatego trzeba stale

trzymać rękę na pulsie i często odwiedzać grupę Usability PL na

Facebooku, w poszukiwaniu nowych warsztatów.

W Warszawie kilkakrotnie organizowane były zajęcia Service Jam,

86

weekendowe warsztaty z service design.

Ladies that UX również czasami przyjmują formę warsztatową, za-

leżnie od tematu omawianego na spotkaniu.

Większość konferencji organizuje warsztaty przed lub po wykła-

dach. Zarówno UX Poland jak i WUD oferują takie zajęcia.

S t u d i a

UX Design to dziedzina, w której najważniejsze są umiejętności

oraz doświadczenie, które można zdobyć samemu z czasem. Wy-

kształcenie kierunkowe nie jest wymagane. W Polsce nie istnieją

jeszcze studia dedykowane wyłącznie UX. Jeżeli ktoś chciałby wy-

bierać szkołę wyższą z myślą by zostać UX Designerem, prawdopo-

dobnie najlepszą opcją byłyby studia o profilu informatycznym lub

psychologicznym, gdyż wg. badania „Specjaliści User Experience

2015” najwięcej osób które je ukończyło, pracuje teraz w roli UX

Designera.

Jeżeli posiadamy już wyższe wykształcenie, mamy możliwość zapi-

sać się na podyplomowe studia User Experience Design na SWPS.

Z pewnością ukończenie ich pomaga uporządkować wiedzę oraz

wypełnić luki w samodzielnej nauce. Według badania „Specjaliści

User Experience 2015” aż 1/4 badanych praktyków User Experien-

ce Design już je ukończyło.

W 2016 roku rusza pierwsza tura studiów podyplomowych User

87

Experience & Product Design, Wydział Humanistyczny AGH,

w Krakowie.

M e n t o rW innych krajach oferowane są plany mentorskie, w których osoba

którą uczy się UX Design zostaje prowadzona przez kogoś bardziej

doświadczonego. Tego rodzaju relacja jest na pewno nieoceniona

w czasie stawiania pierwszych kroków. Młody adept może szu-

kać u mentora mądrości oraz wsparcia. Główną trudnością w sa-

modzielnej nauce nie jest zdobycie wiedzy, która aż „wylewa się”

z internetu, lecz jej porządkowanie i stawianie sobie priorytetów.

Posiadanie obok osoby która ma tą podróż za sobą i może nas po-

prowadzić, uchroni nas przed zagubieniem się w morzu możliwości

lub zapędzeniem się w ślepą uliczkę.

Mentor korzysta na relacji ćwicząc umiejętności interpersonalne,

przydatne w pracy w czasie kontaktów z klientem.

Niestety w Polsce nie istnieją tego typu plany mentorskie. Na tą

chwilę osoby chcące się rozwijać w kierunku UX są zdane na samo-

dzielne poszukiwanie nauczyciela do pomocy.

F i r m aDla niektórych osób, to firma może być miejscem gdzie mogą się

rozwijać w karierze UX. Niektóre organizacje posiadają mechani-

88

zmy wspierające rozwój swoich pracowników, jeśli tylko może się

to przyczynić do osiągania przez firmę lepszych wyników.

Być może pracodawca będzie zainteresowany udostępnieniem cza-

su lub pieniędzy na naukę.

Jeśli pracujemy w dużej firmie, być może jest więcej osób zaintere-

sowanych UX. Stwarza to możliwość zorganizowania zespołu lub

społeczności, która może się uczyć od siebie nawzajem i wspierać

w osiąganiu celów.

Jeżeli firma zajmuje się np. produkcją oprogramowania, ale nie ma

działu User Experience, stwarza to możliwość aby zostać samo-

zwańczym projektantem UX i zacząć propagować UX w firmie.

Dobry UX bezpośrednio przekłada się na zadowolenie klientów

i wzrost sprzedaży, a to jest zawsze przekonujący argument dla dy-

rektorów organizacji.

W ł a s n e p r o j e k t y

Tworzenie własnych projektów jest dobrym pomysłem na różnych

etapach kariery. Jest świetnym ćwiczeniem umiejętności zarówno

dla początkujących jak i zaawansowanych projektantów.

Daje też możliwość tworzenia port folio, które jest niezbędne przy

szukaniu pracy, a którego nawet osoby z wieloletnim doświadcze-

niem mogą nie posiadać z powodu, że większość projektów User

Experience jest tajna.

89

Jest nieskończona ilość opcji, co do tego jak taki projekt miałby wy-

glądać, a zależy wyłącznie od tego ile sami chcemy włożyć w niego

czasu i energii. Może to być tylko jedna strona np. formularz lub

cennik, ale możemy też przejść przez cały proces projektowy two-

rząc aplikację.

Takie ćwiczenie może być okazją by zrobić dobry uczynek, np. za-

projektować stronę fundacji lub organizacji działającej w dobrej

sprawie. Jeżeli któryś z naszych znajomych ma stronę lub sklep in-

ternetowy, prawdopodobnie chętnie przyjmie naszą pomoc.

Projekty wdrożone, czyli zrealizowane w rzeczywistości, są bar-

dziej wartościowe, ponieważ projektant w trakcie pracy nad nimi

musi się zmierzyć z rzeczywistymi ograniczeniami. Jeżeli jednak

nie mamy możliwości pracy nad prawdziwymi projektami, wciąż

zostają inne opcje.

90

S p i s t r e ś c i :

User Experience przedmiotów codziennego użytku 5

Model koncepcyjny 6

Wskazówki wizualne 7

Mapping 11

Feedback 11

Wiedza w głowie i wiedza w świecie 14

Błędy 17

Ograniczenia fizyczne i kulturowe 20

Trudności z komputerem 22

User Centered Design 23

User experience aplikacji i stron internetowych  27

Dlaczego UX jest ważny? 27

5 elementów 31

Projektant User Experience 47

Czym zajmuje się UX Designer? 47

Kto zostaje UX Designerem? 48

Czym różni się UX od UI Designera? 49

Unicorn 50

UX/UI Designer 51

Proces projektowy 52

Idealny proces projektowy 52

Proces projektowy w praktyce 56

Rozwój kariery projektanta UX 79

Społeczność 79

91

Społeczność internetowa 80

Magazyny internetowe 80

Portale e-learningowe 81

Książki 82

Konferencje 84

Warsztaty 85

Studia 86

Mentor 87

Firma 87

Własne projekty 88

92

B i b l i o g r a f i a :

• Donald Norman „Design of Everyday Things”

• Jesse James Garrett „Elements of User Experience”

• Michał Aleksander „Jak stać się lepszym projektantem UX”

• http://blog.careerfoundry.com/ui-design/the-difference-

between-ux-and-ui-design-a-laymans-guide/

• Iga Mościchowska, Barbara Rogoś-Turek „Badania jako podsta-

wa projektowania User Experience”

• Leah Buley „The User Experience Team of One”

• Materiały szkoleniowe z Efigence Camp UX 2016

• http://uxwatch.pl/jak-stworzyc-dobra-makiete/

• http://takaoto.pro/ux-design-cro-ecommerce/

• Tomasz Skórski, Igor Farafonow http://nietylko.design/008-

jak-przygotowac-sie-do-rozmowy-na-stanowisko-ux/

• Badanie „Specjaliści User Experience 2015” przeprowadzo-

ne przez Joanne Kwiatkowską, Tomasza Skórskiego i Michała

Alekstandra: http://raport2015.hci.org.pl/

• https://creativemarket.com/blog/2015/01/13/10-must-read-

-ux-books

• https://www.usertesting.com/blog/2014/11/10/dont-hire-ui-

-ux-designer/

• http://uxunicorn.com/