background image
background image

Spis treści

Rozdział 1. 

Przykra prawda o fi rmowych stronach internetowych 

1

Potrzebujesz odrębnego działu zajmującego się stroną WWW 

2

Zarządzanie stroną WWW jest zajęciem na pełny etat 

3

Nie chodzi o to, aby budować od zera 

3

Twoja strona WWW nie musi podobać się wszystkim 

4

Marnujesz pieniądze na serwisy społecznościowe

5

Twoja strona WWW nie jest tylko dla Ciebie 

6

Powinieneś doceniać swój zespół WWW 

6

Projekt WWW utworzony przez komitety jest samobójstwem 

7

CMS nie jest cudownym rozwiązaniem 

7

Za dużo treści 

8

Podsumowanie 

9

Rozdział 2. 

Studium projektowe „Portfolio” 
— wzorce oraz najnowsze trendy 

11

Jasny czy ciemny projekt

12

Ile kolumn?

12

Blok wprowadzający

13

Wyrównanie układu

14

Położenie nawigacji

15

Pole wyszukiwania

16

Elementy Flash

16

Gdzie umieścić dane kontaktowe

17

Podstrona  „O nas”

18

Podstrona „Klienci”

19

Podstrona „Usługi”

19

Podstrona „Realizacje”

19

Podstrona „Jak pracujemy” 

20

Podstrona „Kontakt” 

20

Specjały i dodatki 

21

Inne odkrycia 

21

Podsumowanie 

22

background image

SPIS TREŚCI

viii

Rozdział 3.  

Tworzenie efektywnego portfolio online 

23

Pułapka 1. Przegadanie 

24

Pułapka 2. Za dużo informacji naraz 

24

Pułapka 3. Co za dużo, to niezdrowo 

25

Pułapka 4. Nietypowa nawigacja 

25

Pułapka 5. Bałagan wizualny 

26

Reguły efektywnego projektu portfolio 

26

Zdefi niuj swoje kryteria i strategie sukcesu 

26

Rozważ stworzenie kilku portfolio 

27

Zdefi niuj swojego odbiorcę 

28

Ustal priorytet na użyteczność 

30

Użyj właściwej technologii 

30

Zaplanuj projekt 

31

Ogranicz zakres i typ promowanych projektów 

32

Informacje, dokumentacje i objaśnienia 

32

Zaprezentuj swoją pracę w kontekście ustalonych celów 

34

Zawrzyj w projekcie swoją osobowość  

34

Promuj swoją pracę 

35

Opracuj cele długofalowe 

36

Rozdział 4.  

Uzyskanie lepszego user experience za pomocą opowieści 

37

Wszystko zaczyna się od opowieści 

38

Opisywanie projektu w opowieściach 

38

Siła emocji 

39

Podstawy wykorzystania opowieści do udoskonalania 

user experience 

41

Scalanie zespołów 

41

Orientacja na użytkownika 

42

Defi niowanie użytkownika 

43

Zalety 

43

„I żyli długo i szczęśliwie” a rzeczywistość 

44

Kilku gawędziarzy ery internetu 

45

Dorelle Rabinowitz 

45

Curt Cloninger 

46

Christian Saylor 

48

Cindy Chastain

50

Doświadczenia oparte na opowieściach wokół nas

51

Opakowanie: Apple

51

Marketing: Perfumy Six Scents

51

Architektura: Sklep HBO

52

Dane: Taxi 07: Roads Forward

53

Koniec jest początkiem tej opowieści

53

background image

SPIS TREŚCI

ix

Rozdział 5.  

Projektowanie interfejsu użytkownika 
na potrzeby biznesowych aplikacji WWW 

55

Serwisy a aplikacje WWW

56

Różne typy aplikacji WWW

56

Poznaj swoich użytkowników

57

Jak zidentyfi kować użytkowników

57

Proces projektowania

58

Szkicowanie

59

Prototypowanie 

60

Testowanie 

60

Reguły projektowania 

60

Nikt nie lubi niespodzianek 

60

Użytkownicy powinni mieć możliwość 

efektywnej pracy 

61

Pomocy! 

63

Brak satysfakcji 

63

Kluczowe elementy aplikacji WWW 

64

Formularze 

64

Widok ogólny i szczegółowy 

64

Deski rozdzielcze 

64

Tabele 

65

Raporty 

65

Nie zapominaj o wzorcach projektowych 

65

Studium przypadku: aplikacja banku online 

67

Podsumowanie 

67

Rozdział 6.  

Stopniowe udoskonalanie i standardy WWW 
nie ograniczają projektów 

69

Nowiutkie technologie a stare dobre praktyki 

70

Bałagan zwany WWW 

70

Tworzenie celebrytów i miejsc, 

w których chcielibyśmy być 

70

Hollywood i reklamy niczego nas nie nauczą 

71

Mit innowacji przez rozwój technologii 

72

W innowacji nie chodzi o nowe zabawki 

72

Korporacyjne wypaczenie innowacji i jego konsekwencje 

73

Syndrom sztokholmski złych interfejsów 

74

Nie chodzi o technologię albo projekt 

74

Gdzie jest piękno sieci WWW? 

75

Jeszcze raz: nasze problemy 

76

background image

SPIS TREŚCI

x

Dlaczego standardy mają znaczenie i co oznacza 

„przestrzeganie standardów” 

77

Stopniowe udoskonalanie działa 

77

Najlepsze praktyki biorą się z zastosowań i ciągłego udoskonalania 

79

Razem możemy tego dokonać 

79

Rozdział 7.  

Teoria kolorów dla profesjonalnych projektantów 

81

Ciepłe kolory 

82

Czerwony (kolor podstawowy) 

83

Pomarańczowy (kolor pośredni) 

83

Żółty (kolor podstawowy) 

84

Zimne kolory 

85

Zielony (kolor pośredni) 

85

Niebieski (kolor podstawowy) 

86

Fioletowy (kolor pośredni) 

86

Kolory neutralne 

87

Czarny 

87

Biały 

88

Szary 

88

Brązowy 

89

Beżowy i jasnobrązowy 

89

Kremowy i kość słoniowa 

90

W skrócie 

90

Tradycyjne palety barw 

91

Monochromatyczna 

92

Analogiczna 

93

Dopełniająca 

94

Rozszerzona dopełniająca 

94

Triady 

95

Podwójnie dopełniające (tetradic) 

95

Niestandardowe 

96

Tworzenie palet barw 

97

Dlaczego odcienie są tak istotne 

99

Dodawanie kolorów neutralnych

100

Najłatwiejsze w użyciu palety barw

100

Ilu kolorów użyć? 102

Podsumowanie

102

background image

SPIS TREŚCI

xi

Rozdział 8.  

Czy Twój klient jest tępy, 
czy też problem leży po Twojej stronie? 

103

Wyjaśnij, dlaczego pytasz o pieniądze

104

Uzasadnij swoje zalecenia językiem, który zrozumie klient

104

Włącz klienta w proces

105

Edukuj klienta w zakresie projektowania

105

Regularnie komunikuj się z klientem

106

Wytłumacz klientowi jego rolę

107

Morał 107

Rozdział 9.  

W jaki sposób radzić sobie z różnymi typami klientów 

109

Typ pasywno-agresywny

110

Identyfi kacja

110

Jak sobie radzić

110

Przyjaciel rodziny

110

Identyfi kacja

111

Jak sobie radzić

111

Zaniżacz wartości

111

Identyfi kacja

111

Jak sobie radzić

112

Pedant

112

Identyfi kacja

112

Jak sobie radzić

112

Sknera

113

Identyfi kacja

113

Jak sobie radzić

113

Złota rączka

113

Identyfi kacja

114

Jak sobie radzić

114

Kontroler

114

Identyfi kacja

114

Jak sobie radzić

115

Wymarzony klient

115

Identyfi kacja

115

Jak sobie radzić

115

Podsumowanie

115

Rozdział 10.   Jak skutecznie radzić sobie z krytyką 

117

Miej odpowiednie nastawienie

119

Określ cel 119
Sprawdź swoją pierwszą reakcję

120

Oddziel ziarno od plew

121

background image

SPIS TREŚCI

xii

Ucz się z tego

121

Szukaj nowych pomysłów

122

Pogłęb informacje

122

Podziękuj krytykowi

123

Rozdział 11.   Jak wykorzystać sieci znajomości 

125

Dlaczego warto tworzyć powiązania?

126

Referencje

126

Współpraca

126

Rozwiązywanie problemów

126

Szukanie okazji

127

Pomoc innym

127

Przyjaźń

128

Wskazówki dla projektantów

128

Bądź dostępny

128

Szukaj wspólnych korzyści

128

Prowadź bloga

128

Skupiaj się na głębi znajomości

129

Bądź proaktywny

129

Wiedz, czego szukasz

129

Wiedz, co masz do zaoferowania

130

Wykorzystaj znajomości niebezpośrednie

130

Nie czekaj do momentu, gdy będziesz czegoś potrzebował 130
Pomagaj, gdy tylko jesteś w stanie

131

Nie wyzyskuj innych

131

Nie pozwól, by sieci społecznościowe szkodziły 

Twojej produktywności

131

Nie oceniaj ludzi pochopnie

131

Nie staraj się być wszędzie naraz

132

Bierz udział w rzeczywistych spotkaniach

132

Pilnuj lokalnych okazji

132

Rozdział 12.   Wywiad grupowy: porady ekspertów dla studentów 

i początkujących projektantów WWW 

133

Skorowidz

152

background image

Wstęp

Pozycja Smashing Magazine znacznie wzrosła w ciągu ostatnich kilku lat. Nasz cały 
zespół ciężko pracował, żeby przekształcić niewielki blog w profesjonalne wydawnictwo 
internetowe, które publikuje dużą liczbę starannie opracowanych, specjalistycznych 
artykułów. Jesteśmy w pełni świadomi odpowiedzialności, jaka na nas spoczywa. Robimy 
wszystko, co w naszej mocy, aby promować najlepsze praktyki i pomagać projektantom 
lepiej zrozumieć podstawy profesjonalizmu w naszej branży.

Ta książka to jedna z naszych skromnych prób wsparcia społeczności projektantów, 
zawierająca specjalistyczne i wartościowe wskazówki, porady oraz praktyczne spostrzeżenia. 
Książka składa się z najlepszych artykułów na temat profesjonalnego projektowania, jakie 
zostały opublikowane na Smashing Magazine w latach 2009 i 2010. Artykuły zostały 
starannie opracowane i przygotowane do wydania drukowanego.

Ta książka prezentuje zalecenia dla profesjonalnych twórców stron WWW, dotyczące 
między innymi komunikacji z klientami, tworzenia efektywnego portfolio, reguł 
profesjonalnego wykorzystania technologii sieciowych, oraz wskazówki na temat 
projektowania interfejsów użytkownika dla biznesowych aplikacji WWW. Znajdziesz 
tu porady ekspertów dla studentów i młodych projektantów WWW. Książka pomaga 
też nauczyć się, w jaki sposób efektywnie reagować na krytykę projektu, wykorzystywać 
technikę opowieści do budowania lepszego user experience oraz stosować teorię kolorów 
do tworzenia profesjonalnych projektów.

Daj nam znać, co myślisz o tej książce, w swoich recenzjach i komentarzach. 
Dziękujemy za zaufanie i wsparcie, jakie przez te wszystkie lata otrzymaliśmy.

— Vitaly Friedman, Sven Lennartz oraz Zespół

background image
background image

R

O

ZDZIAŁ

 1

1

PRZYKRA PRAWDA 

O FIRMOWYCH 

STRONACH 

INTERNETOWYCH

WSZYSCY POPEŁNIAMY

 błędy przy zarządzaniu stronami WWW. Jednakże charakter 

tych błędów zależy od wielkości fi rmy. Wraz ze wzrostem organizacji również i one ulegają 
zmianie. W tym artykule omówiono typowe błędy popełniane przez duże organizacje.

Większość klientów, z którymi pracuję, to wielkie organizacje: uniwersytety, organizacje 
charytatywne, instytucje sektora publicznego oraz duże przedsiębiorstwa. W ciągu ostatnich 
siedmiu lat zauważyłem pewne powtarzające się błędy w tych organizacjach. Ten artykuł ma 
na celu rozwiać iluzje i zachęcić ludzi do stawienia czoła trudnej rzeczywistości.

Problem polega na tym, że jeśli czytasz ten artykuł, prawdopodobnie zdajesz już sobie sprawę 
z zagrożenia. Mam jednak nadzieję, że ta analiza pomoże Ci przekonać innych pracowników 
w Twojej organizacji. W każdym razie przedstawiam niektóre z trudnych prawd o stronach 
internetowych w dużych organizacjach
.

Paul Boag

background image

ROZDZIAŁ 1

2

POTRZEBUJESZ ODRĘBNEGO DZIAŁU 
ZAJMUJĄCEGO SIĘ STRONĄ WWW

W wielu organizacjach strona WWW jest zarządzana przez dział marketingu albo dział IT. 
Taki układ nieuchronnie prowadzi do wojny, w której strona WWW staje się ofi arą polityki 
wewnętrznej fi rmy.

W rzeczywistości realizacja polityki webowej nie jest domeną żadnej z tych grup. Dział 
IT sprawdzi się doskonale podczas wdrożenia złożonego systemu, ale nie nadaje się do 
tworzenia przyjaznego interfejsu użytkownika lub wypromowania internetowej marki.

Marketing, z drugiej strony, jest niewiele lepszy. Jeff rey Zeldman sugeruje w swoim artykule 
Let Th

  ere Be Web Divisions (Niech staną się działy WWW):

Strona internetowa jest rozmową. Marketing, przeciwnie, jest monologiem… 
A do tego dochodzi jeszcze całe to zamieszanie ze znacznikami semantycznymi, 
CSS-ami, skryptami, badaniami opartymi na metodzie sortowania kart i dostępności 
oraz cała reszta umiejętności i doświadczeń, które nie wchodzą w zakres kompetencji 
działu marketingu.

Rysunek 1.1. Jeff rey Zeldman wzywa organizacje do utworzenia niezależnego działu WWW.

Copyright © 1995 – 2010 L. Jeff rey Zeldman

background image

PRZYKRA PRAWDA O FIRMOWYCH STRONACH INTERNETOWYCH

3

Rozwiązanie polega na tym, aby strona internetowa była zarządzana przez odrębny zespół 
pracowników. Zeldman podsumowuje, pisząc:

Powierz rozwój strony WWW działowi, który uzna, że witryna WWW nie jest bękartem 
folderów reklamowych ani naturalnym efektem ewolucji kalendarza grupowego. Pozwól 
na powstanie działu WWW.

http://www.zeldman.com/2007/07/02/let-there-be-web-divisions/

ZARZĄDZANIE STRONĄ WWW 
JEST ZAJĘCIEM NA PEŁNY ETAT

Rozdarcie pomiędzy działy marketingu oraz IT nie jest jedynym problemem stron WWW, 
niemniej istotny jest fakt, że to dziedzina często traktowana po macoszemu. Zamiast 
pracować w odrębnym zespole dedykowanym rozwojowi strony WWW, pracownicy muszą 
równolegle wykonywać swoje „codzienne obowiązki”. W przypadku kiedy w fi rmie istnieje 
dedykowany zespół do spraw WWW, jest on najczęściej zbyt rozproszony. Większość czasu 
poświęca się na codzienne zarządzanie stroną, nie na długoterminowe, strategiczne plany 
rozwoju serwisu.

Tę sytuację dodatkowo pogarsza fakt, że pracownicy zatrudnieni do „utrzymania” 
strony internetowej to zazwyczaj młodsi członkowie personelu. Nie mają wymaganego 
doświadczenia ani autorytetu, żeby strona WWW stała się ważnym elementem organizacji. 
Nadszedł już czas, żeby fi rmy przesunęły swoje priorytety i poważnie zajęły się tematem 
swoich stron WWW, decydując się na zatrudnienie doświadczonych menedżerów 
zajmujących się tym zadaniem w pełnym wymiarze godzin.

NIE CHODZI O TO, ABY BUDOWAĆ OD ZERA

Ponieważ fi rmowe strony internetowe są niedoinwestowane, często bywają zaniedbywane 
w dłuższej perspektywie czasowej. Ich zawartość, jak również wygląd i technologia powoli 
stają się nieaktualne. Ostatecznie problem narasta do tego stopnia, że zarząd fi rmy żąda 
podjęcia zdecydowanych kroków w celu jego rozwiązania. To nieuchronnie prowadzi do 
poniesienia znacznych kosztów na całkowite przeprojektowanie strony. Takie podejście 
jest niewłaściwe. Jest to marnowanie pieniędzy, ponieważ w sytuacji, gdy stara strona 
zostaje zastąpiona zupełnie nową, środki zainwestowane w poprzednią wersję zostają 
utracone. Konieczność ponoszenia takiego wydatku co kilka lat rzutuje w znacznym 
stopniu na fi nanse fi rmy.

background image

ROZDZIAŁ 1

4

Lepszym sposobem jest nieustanne inwestowanie w stronę internetową. Takie podejście 
jest nie tylko bardziej oszczędne, jest również lepsze dla użytkowników, jak podkreśla 
Cameron Moll w swoim artykule Good Designers Redesign, Great Designers Realign (Dobrzy 
projektanci projektują od nowa, doskonali projektanci udoskonalają, http://www.alistapart.com/
articles/redesignrealign
).

TWOJA STRONA WWW 
NIE MUSI PODOBAĆ SIĘ WSZYSTKIM

Pierwszym pytaniem, jakie zadaję moim klientom, jest: „Kto jest twoją grupą docelową?”. 
Jestem zaskoczony, jak długą listę otrzymuję w odpowiedzi. Zbyt często lista ta zawiera 
zupełnie odmienne grupy osób. Nieuchronnie moim następnym pytaniem jest: „Która z tych 
wielu grup demografi cznych jest najbardziej istotna?”. Niestety, w odpowiedzi otrzymuję 
informację, że wszystkie one są równie ważne.

Przykrą prawdą jest to, że jeśli budujesz swoją stronę internetową dla wszystkich, nie 
trafi  ona do nikogo. Bardzo ważne jest, aby koncentrować się na odbiorcach i do nich 
przystosowywać wygląd oraz zawartość strony. Czy to oznacza, że powinieneś ignorować 
pozostałych użytkowników? Absolutnie nie. Twoja strona powinna być dostępna dla 
wszystkich i nie obrażać ani nie wykluczać nikogo. Jednakże musi być skierowana przede 
wszystkim do ściśle określonych odbiorców.

Rysunek 1.2. Cameron Moll zachęca projektantów stron WWW, aby je zmieniać, a nie tworzyć od nowa

background image

PRZYKRA PRAWDA O FIRMOWYCH STRONACH INTERNETOWYCH

5

MARNUJESZ PIENIĄDZE 
NA SERWISY SPOŁECZNOŚCIOWE

Menedżerowie witryn coraz częściej zdają sobie sprawę, że strategia internetowa wymaga 
czegoś więcej niż prowadzenia strony internetowej. Zaczynają używać takich narzędzi, 
jak Twitter, Facebook oraz YouTube, aby zwiększyć zasięg i pozyskać nowych odbiorców. 
Problem w tym, że używają tych narzędzi w sposób nieskuteczny. Publikowanie informacji 
na fi rmowym koncie Twitter lub udostępnianie demonstracji z wyników sprzedaży 
na YouTube mijają się z istotą sieci społecznościowych (ang. social networking).

Istotą sieci społecznościowych są ludzie interesujący się innymi ludźmi. Osoby nie chcą 
budować relacji z markami lub korporacjami. Chcą rozmawiać z innymi ludźmi. Zamiast 
wydawać miliony na aplikacje na Facebooku czy wirusowe wideo, lepiej przeznaczyć 
te środki na nawiązywanie kontaktów z ludźmi w sposób przejrzysty i otwarty.

Zamiast tworzyć fi rmowe konto Twitter, a nawet rozwijać fi rmowy blog, zachęć 
poszczególnych pracowników do założenia swojego własnego konta na serwisie 
społecznościowym oraz blogu. Opracuj wytyczne dopuszczalnych zachowań oraz używania 
narzędzi potrzebnych do rozpoczęcia bezpośredniej komunikacji z klientami, odnosząc 
się do Twoich produktów i usług. Dzięki temu pokażesz nie tylko swoje zaangażowanie 
w budowanie relacji, ale również ludzką stronę swojej fi rmy.

Rysunek 1.3. Microsoft znacząco poprawił swój wizerunek wśród programistów, pozwalając pracownikom 
wypowiadać się na stronie internetowej Channel 9

background image

ROZDZIAŁ 1

6

TWOJA STRONA WWW 
NIE JEST TYLKO DLA CIEBIE

Podczas gdy jedni menedżerowie stron WWW chcą przypodobać się wszystkim, inni 
myślą tylko o sobie i swoich kolegach. Zadziwiająca liczba fi rm całkowicie ignoruje swoich 
użytkowników i tworzy strony internetowe zgodne z organizacyjnym porządkiem fi rmy. 
Zazwyczaj objawia się to nieprawidłową konstrukcją strony, która zaspokaja osobiste 
preferencje dyrektora zarządzającego, a jej treść jest pełna fi rmowego żargonu.

Strona internetowa powinna przede wszystkim zaspokajać potrzeby swoich użytkowników, 
a nie pracowników fi rmy. Za dużo projektów jest odrzucanych, ponieważ szef „nie lubi 
zielonego”. Podobnie za dużo stron zawiera slogany i terminologię używaną jedynie 
w obrębie organizacji.

POWINIENEŚ DOCENIAĆ SWÓJ ZESPÓŁ WWW

Niezależnie, czy fi rma posiada własny zespół zarządzający stroną internetową, czy 
współpracuje z zewnętrzną agencją, projektanci stron internetowych najczęściej nie są 
dobrze wykorzystywani. Projektanci to nie tylko grafi cy komputerowi, bardzo często są kimś 
więcej. Mają bogatą wiedzę na temat funkcjonowania internetu oraz jego użytkowników. 
Znają się na technikach projektowania opartych na siatkach, odstępach, teorii kolorów 
i wielu innych rzeczach.

Marnowaniem czasu jest proszenie ich o „zwiększenie logo” lub „przesunięcie obrazka o trzy 
piksele w lewo”. W takim przypadku marnuje się bogactwo ich doświadczenia i redukuje ich 
rolę do operatora oprogramowania.

Rysunek 1.4. Traktowanie projektantów WWW jak grafi ków to marnowanie 
ich doświadczenia — projektant wylewa swoje żale na Twitterze

background image

PRZYKRA PRAWDA O FIRMOWYCH STRONACH INTERNETOWYCH

7

Jeśli chcesz uzyskać maksymalny zwrot z inwestycji w zespół zarządzający stroną WWW, 
przedstaw mu problemy, a nie rozwiązania. Dla przykładu, jeśli kierujesz swoją stronę do 
nastolatek, a projektant proponuje Ci korporacyjny kolor niebieski, zasugeruj mu, że Twoi 
odbiorcy mogą niewłaściwie reagować na ten kolor. Nie mów, żeby zmienić kolor na różowy. 
W takim przypadku projektant będzie miał swobodę w wybraniu najlepszego rozwiązania, 
które może okazać się nawet lepsze od Twojego. Dzięki takiemu podejściu pozwolisz mu 
wykazać się inwencją w znalezieniu rozwiązania przedstawionych problemów.

PROJEKT WWW UTWORZONY 
PRZEZ KOMITETY JEST SAMOBÓJSTWEM

Kolejnym pomysłem, jaki można spotkać w dużej organizacji, jest powołanie komitetu 
do zarządzania stroną WWW fi rmy. Takie rozwiązanie jest stosowane w przypadku, gdy 
wewnętrzna polityka fi rmy wymusza konieczność wzięcia pod uwagę pomysłu każdego 
pracownika.

To wcale nie znaczy, że wszystkie komitety są złem wcielonym. Nie powinno się tworzyć 
dużego korporacyjnego serwisu WWW bez konsultacji z pracownikami. Ale jeśli chodzi 
o projekt strony, komitety są samobójstwem.

Wygląd jest rzeczą subiektywną. To, w jaki sposób reagujemy na projekt, zależy od wielu 
czynników, między innymi: kultury, płci, wieku, doświadczenia, a nawet warunków 
fi zycznych (np. daltonizm). Ten sam projekt dla jednej osoby może być wspaniały, dla 
innej zupełnie nie do przyjęcia. Dlatego tak ważne jest, aby na decyzje projektowe miały 
wpływ wyniki testów użytkowników, a nie osobiste preferencje. Niestety, w przypadku 
zaangażowania w sprawę komitetu testy użytkowników są rzadko stosowaną metodologią 
projektową.

Projektowanie przez komitet jest zawsze związane z kompromisem. Członkowie komitetu 
mają różne opinie na temat projektu i muszą wypracować wspólny grunt. Dla przykładu 
jedna osoba może nie znosić niebieskiego schematu kolorów, a druga wręcz przeciwnie. 
Prowadzi to do projektowania w tzw. biegu, gdzie podczas burzy mózgów padają zdania 
typu: „Wypróbuj inny niebieski” — w nadziei na znalezienie wspólnego mianownika. 
Niestety, wypracowany efekt jest bezbarwny i nie zachwyca już nikogo.

CMS NIE JEST CUDOWNYM ROZWIĄZANIEM

Wielu klientów, z którymi pracuję, ma zadziwiająco nierealistyczne oczekiwania odnośnie 
do systemu zarządzania treścią CMS (ang. content management systems). Wszyscy, którzy 
go nie mają, są przekonani, że rozwiąże ich wszystkie problemy, a ci, którzy już go mają, 
narzekają, że tak się nie stało!

background image

ROZDZIAŁ 1

8

Prawdą jest, że CMS może przynieść wiele korzyści, na przykład:



zmniejszenie barier technicznych związanych z dodawaniem treści;



udostępnienie większej liczbie ludzi możliwości dodawania i edycji treści;



uproszczenie mechanizmów dokonywania szybkich aktualizacji;



lepsza kontrola.

Niestety, wiele CMS-ów jest mniej elastycznych, niż ich właściciele by sobie tego życzyli. 
Nie spełniają oczekiwań związanych z efektywnością dokonywania zmian. Menedżerowie 
stron internetowych również narzekają, że ich systemy są trudne w obsłudze. W wielu 
przypadkach dzieje się tak dlatego, że osoby do tego oddelegowane nie przeszły 
odpowiedniego przeszkolenia lub używają systemu nieregularnie.

Podsumowując, systemy CMS mogą ułatwić aktualizację zawartości strony. Nie są jednak 
gwarancją, że zawartość ta będzie aktualizowana, jak również że będzie na akceptowalnym 
poziomie pod względem jakości. Duża liczba serwisów internetowych pracujących na 
CMS wciąż zawiera nieaktualne, niskiej jakości treści. Dzieje się tak, ponieważ nie zostały 
wdrożone wewnętrzne procesy wsparcia dystrybucji treści.

Jeśli oczekujesz, że CMS rozwiąże Twoje problemy z utrzymaniem stron internetowych, 
będziesz rozczarowany.

ZA DUŻO TREŚCI

Jednym z problemów związanych z utrzymaniem stron internetowych dużych korporacji 
jest to, że znajduje się na nich zbyt dużo treści. Większość tych stron „ewoluowała” przez 
lata, treści były dodawane, ale nikt ich nigdy nie przeglądał ani nie edytował.

Na stronach internetowych znajduje się skopiowana treść, której nikt nie czyta. 
Dzieje się tak z następujących powodów:



obawy, że coś zostanie pominięte: administratorzy stron internetowych uważają, 
że jeżeli wrzucą wszystko online, użytkownicy będą mieli szansę znaleźć to, czego 
szukają. Niestety, zbyt duża ilość informacji powoduje, że trudno jest cokolwiek 
znaleźć;



obawy, że coś zostanie niezrozumiane: z powodu braku wiary w czytelność strony 
lub umiejętności odbiorców administratorzy stron internetowych umieszczają 
mnóstwo instrukcji dla użytkowników. Problem w tym, że użytkownicy nigdy 
tego nie czytają;



desperackiej chęci przekonania: twórcy stron chcą sprzedać swój produkt lub 
przekazać swój komunikat, dlatego zaśmiecają treść kopią przekazu marketingowego, 
który nie zawiera wartościowej informacji.

background image

PRZYKRA PRAWDA O FIRMOWYCH STRONACH INTERNETOWYCH

9

Steve Krug w swojej książce Don’t Make Me Th

  ink zachęca menedżerów witryn do „pozbycia 

się połowy słów na każdej stronie, a następnie jeszcze połowy tego, co pozostało”. Dzięki 
temu zabiegowi poprawi się czytelność strony i wartościowe treści będą bardziej czytelne.

PODSUMOWANIE

Duże organizacje wykonują dobrą robotę, utrzymując swoje strony internetowe. 
Jednocześnie narażone są na pewne wyjątkowe wyzwania, które mogą je doprowadzić do 
bolesnych pomyłek. Rozwiązywanie tych problemów oznacza ich akceptację, sforsowanie 
polityki wewnętrznej i zmianę sposobu kontrolowania swojej marki. Takie podejście do 
tematu daje znaczącą przewagę konkurencyjną i powoduje, że strategia internetowa staje się 
bardziej efektywna w perspektywie długoterminowej.

Paul Boag jest założycielem UK Headscape, internetowej agencji projektowej, autorem Website 
Owner’s Manual oraz właścicielem nagradzanego podcastu o projektowaniu stron WWW.

background image
background image

R

O

ZDZIAŁ

 2

2

STUDIUM 

PROJEKTOWE 

„PORTFOLIO” 

— WZORCE ORAZ 

NAJNOWSZE TRENDY

Vitaly Friedman

ZGODNIE Z PROŚBĄ

 naszych czytelników na Smashing Magazine starannie wybraliśmy 

dziesiątki agencji interaktywnych, przeanalizowaliśmy ich portfolio i na tej podstawie 
zidentyfi kowaliśmy popularne wzorce projektowe. Głównym celem tego badania było 
dostarczenie freelancerom oraz agencjom reklamowym użytecznych wskazówek dotyczących 
projektu własnego portfolio.

Zrobiliśmy burzę mózgów na temat ważniejszych zagadnień projektowych oraz wypytaliśmy 
projektantów z całego świata, jakie decyzje muszą zwykle podejmować, projektując stronę 
z portfolio. Zapytaliśmy ich również o to, odpowiedzi na jakie pytania i analizę jakich 
problemów chcieliby znaleźć w naszym badaniu.

Skończyło się na czterdziestu solidnych pytaniach dotyczących portfolio — uporządkowanych, 
pogrupowanych i ułożonych według ważności. Chodziło nam o stworzenie reprezentatywnej 
mieszanki uznanych agencji interaktywnych z dobrze zaprojektowanymi stronami portfolio 
małych i dużych fi rm.

Na końcu ułożyliśmy ankietę składającą się z czterdziestu pytań. Następnie przeanalizowaliśmy 
strony internetowe wszystkich wybranych agencji interaktywnych, zwracając uwagę na ich 
projekt, i wypełniliśmy nasze dość długie formularze. Podsumowując, przygotowanie naszego 
studium trwało ponad 75 godzin.

background image

ROZDZIAŁ 2

12

W tym artykule przedstawiamy wstępne wyniki naszego wielkiego studium projektowego 
poświęconego portfolio. Na następnych stronach znajdziecie dyskusje na temat wyglądu, 
struktury, układu oraz nawigacji na stronach internetowych portfolio. Dotrzemy również 
do szczegółów konstrukcyjnych każdej podstrony, w tym: O nasKlienciUsługiPortfolio
Jak pracujemy (inaczej: Workfl ow) oraz Kontakt. Oczywiście nie musisz przestrzegać 
sugestii zaprezentowanych w naszej analizie, proponujemy raczej zapoznać się z ogólną ideą 
budowy różnych stron portfolio, a potem wymyślić coś własnego, coś, co będzie użyteczne, 
charakterystyczne i niezapomniane. Dziękujemy Markowi Nutterowi za pomoc w zebraniu 
danych do tego studium.

JASNY CZY CIEMNY PROJEKT

Dość często pojawia się pytanie: czy lepiej tworzyć stronę w ciemnych barwach 
(czyli duża, śmiała typografi a oraz żywe kolory, dostarczające użytkownikowi barwnych 
i niezapomnianych wrażeń), czy w łagodniejszych i jasnych (czyli prosta struktura i czysta 
typografi a).

Co zaskakujące, nasze studium wykazało następujące wyniki:



82% stron portfolio posiadało lekki projekt z neutralnymi, stonowanymi kolorami. 
Tła na tych stronach stanowiły przeważnie lżejsze odcienie jasnoszarego lub żółtego 
zamiast białego.



29% stron portfolio posiadało żywe, mocne kolory.



Ciemne strony najczęściej wykorzystywały duże czcionki i dostarczały mocnych 
wrażeń wizualnych.

Oczywiście wybór ciemnego albo jasnego projektu mocno zależy od osobistego podejścia 
projektanta i indywidualnych celów, jakie ma spełniać portfolio. Kierowanie się stwierdzeniem, 
że trendem są jasne projekty, byłoby niewłaściwe, ponieważ każdy projekt spełnia swoje 
zadanie w ściśle określonym kontekście.

ILE KOLUMN?

Co ciekawe, wiele ze stron internetowych, które analizowaliśmy, posiadało różną 
liczbę kolumn w zależności od podstrony. Strony Klienci oraz O nas miały zazwyczaj 
dwie kolumny, podczas gdy strona startowa często trzy lub cztery oraz dodatkowo, 
w kompaktowej formie, przegląd najważniejszych sekcji. W rzeczywistości istnieje tendencja 
do zwiększania liczby kolumn na stronach: co szósta strona portfolio, którą widzieliśmy, 
miała co najmniej jedną podstronę z czterema kolumnami.

Podczas naszego badania natknęliśmy się na kilka ryzykownych eksperymentów z tzw. 
układami pływającymi (ang. out-of-the-box layouts), z przewijaną nawigacją w JavaScripcie 

background image

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

13

Ponadto większość stron portfolio zawierała podstrony o różnych poziomach szczegółowości. 
Minimalistyczne, jednostronicowe portfolio było rzadko spotykane — tylko 5,4% stron miało 
prosty i minimalistyczny układ.

BLOK WPROWADZAJĄCY

Strony portfolio najczęściej posiadały duży blok wprowadzający umieszczony 
w nagłówku strony, najczęściej w formie krótkiej, przyjaznej informacji o ofercie agencji 
oraz korzyściach, jakich mogą spodziewać się klienci, wybierając jej usługi. Taki blok 
jest najczęściej połączeniem żywych kolorów oraz dużych czcionek, na podstawie 
czego użytkownicy mogą się zorientować zarówno w ogólnym wizerunku fi rmy, jak 
i w indywidualnym guście pracowników agencji. Dzięki takiemu połączeniu blok ten jest 
najczęściej równie profesjonalny, co przyjazny. Takie bloki umieszcza się zwykle na głównej 
stronie, zaraz pod logo fi rmy.

1 kolumna

(5%)

4 kolumny

(16%)

3 kolumny

(52%)

2 kolumny

(27%)

Rysunek 2.1. Liczba kolumn

oraz zastosowaniem innych form oryginalnych projektów. Większość stron portfolio miała 
tradycyjny układ blokowy, z dwoma do trzech wyraźnie oddzielonych kolumn oraz prostą, 
wygodną nawigacją w formie menu.

background image

ROZDZIAŁ 2

14

Według naszego studium 79% stron portfolio posiadało swego rodzaju blok wprowadzający 
w górnym obszarze strony. Zauważyliśmy jednak, że projektanci niektórych stron 
zrezygnowali z bloku wprowadzającego na rzecz prezentacji najnowszych projektów. 
Przy takich rozwiązaniach najczęściej stosuje się mały blok O nas, umieszczony w różnych 
miejscach na stronie, często pod linią zgięcia (ang. fold).

WYRÓWNANIE UKŁADU

W latach dziewięćdziesiątych układy witryn (ang.

 

layouts) były w większości przypadków 

wyrównane do lewej oraz posiadały pionowy pasek nawigacji z lewej części strony 
lub poziomy pasek nawigacji w okolicach nagłówka strony. Z chwilą pojawienia się 
panoramicznych wyświetlaczy to się zmieniło. Coraz więcej projektantów zaczęło stosować 
układy stron wyśrodkowane w poziomie, tak aby pozostający margines białej przestrzeni 
wokół strony równoważył wizualnie układ.

Niedawno zauważyliśmy lekki trend w kierunku bardziej oryginalnych układów 
z wyrównaniem do prawej, jednak w opisywanym badaniu taki układ nie pojawił się ani razu.

Tak 79%

Nie 21%

Rysunek 2.2. Blok wprowadzający na górze strony

background image

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

15

Nasze studium wykazało następujące wyniki:



Żadna strona portfolio nie była wyrównana do prawej.



89% stron portfolio nie było wyśrodkowanych w poziomie.



Pozostałe posiadały albo oryginalne układy adaptacyjne, albo barwne tła wypełniające 
pozostałą przestrzeń ekranu lub po prostu pustą białą przestrzeń (oczywiście widoczne 
tylko wtedy, gdy wyświetlacz ma panoramiczną rozdzielczość).

POŁOŻENIE NAWIGACJI

Gdzie umieścić główną nawigację na stronie? To pytanie wcale nie jest takie trywialne 
i dość często pojawia się podczas dyskusji projektantów. Co zaskakujące, nasze badanie 
wykazało, że większość projektantów stron portfolio umieszcza główną nawigację 
w prawym górnym rogu:



80% stron portfolio posiadało dużą poziomą nawigację.



51% stron portfolio posiadało dużą poziomą nawigację wyrównaną do prawej.

Rysunek 2.3. Wyrównanie układu strony

Wyrównany do lewej

(11%)

Wyśrodkowany

(89%)

background image

ROZDZIAŁ 2

16



16,4% stron portfolio posiadało dużą poziomą nawigację wyrównaną do lewej.



11% stron portfolio posiadało poziomą nawigację wypełniającą całą szerokość strony, 
z dużymi klikalnymi elementami.

Pionowych nawigacji używa się sporadycznie. Inne rozwiązania (np. pozioma nawigacja 
na dole strony) spotykane są niezbyt często i tylko na oryginalnych układach

 

out-of-the-box.

POLE WYSZUKIWANIA

Wiele stron portfolio jest dość małych. Znajdują się na nich przeważnie podstawowe 
informacje o agencji i zasadach stosowanych podczas projektowania. Czasami zdarzają 
się obszerniejsze strony zawierające kilka studiów przypadku (ang. case study), blogi 
oraz szczegółowe dane o każdym większym projekcie.

Jeśli strona zawiera dużą ilość informacji, funkcja wyszukiwania może stanowić rzeczywistą 
korzyść dla użytkowników. Jak się okazuje, niewiele fi rm wdraża funkcjonalność 
wyszukiwania na swojej stronie internetowej.



89% stron portfolio, które analizowaliśmy, nie zawierało funkcji wyszukiwania.



 Tylko 11% stron portfolio posiadało pole wyszukiwania — najczęściej było ono proste. 
Większość z właścicieli takich stron posiadała regularnie aktualizowany blog.

ELEMENTY FLASH

Flash, nieodzowne narzędzie bogatych, interaktywnych projektów, wydaje się już tracić 
na popularności wśród projektantów stron WWW — przynajmniej projektantów stron 
portfolio. Powodem jest zapewne to, że niektóre efekty Flasha mogą być obecnie zastąpione 
przez zaawansowane techniki JavaScript, często dostępne w formie łatwych w użyciu, 
popularnych bibliotek.

Rysunek 2.4. Typy nawigacji poziomych

0

Inne

Pionowy wyrównany do prawej

Pionowy wyrównany do lewej

Poziomy wyśrodkowany

Pasek poziomy (pełna szerokość)

Poziomy wyrównany do lewej

Poziomy wyrównany do prawej

5

10

15

20

25

30

Liczba wystąpień

Po

łożeni

e o

dn

ośnik

a

background image

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

17

Pokazy slajdów, animacje i efekty przejścia mogą być tworzone za pomocą rozwiązań 
JavaScriptu, które są lżejsze, szybsze i znacznie łatwiejsze w użyciu niż Flash. Wspaniałe 
animacje Flash i efekty wideo są zastępowane prostszymi, subtelniejszymi technikami 
JavaScript.

W naszym badaniu tylko 3,7% stron portfolio wykorzystywało animacje Flash w sposób 
istotny, a nawet wówczas zwykle jedynie do realizacji pokazów slajdów oraz prezentacji. 
Prawdopodobnie uzyskaliśmy taki wynik, ponieważ w naszym badaniu nie uwzględniliśmy 
żadnych agencji interaktywnych oraz studiów animacji, fi rm specjalizujących się 
w tworzeniu projektów Flash ani studiów produkcji wideo.

GDZIE UMIEŚCIĆ DANE KONTAKTOWE

Jednym z ważnych celów naszej analizy było zrozumienie, jak projektanci rozmieszczają 
dane kontaktowe na stronach WWW. Czy odwiedzający powinni kliknąć przycisk Kontakt
aby dowiedzieć się, jak mogą skontaktować się ze studiem projektowym? A może dane 
kontaktowe powinny być umieszczone w widocznym miejscu w górnej części strony? 
Czy większość projektantów umieszcza je w stopce strony — albo inaczej: gdzie użytkownicy 
najczęściej spodziewają się znaleźć dane kontaktowe?

Na stronach WWW, które analizowaliśmy, dane kontaktowe pojawiały się dosłownie 
w każdym możliwym miejscu strony: u góry, po prawej, po lewej, na dole, a nawet pośrodku. 
Ale zauważyliśmy również kilka ciekawych tendencji. Byliśmy zainteresowani, po pierwsze, 
w którym miejscu strony znajdował się odnośnik Kontakt, a po drugie, w którym miejscu 
strony znajdowały się rzeczywiste dane kontaktowe.

Rysunek 2.5. Gdzie na stronie znajduje się odnośnik do danych kontaktowych

Okazało się, że:

 



Tylko 12,7% stron internetowych zawierało numer telefonu w nagłówku strony.

 



Tylko 9,1% stron internetowych zawierało adres e-mail w nagłówku strony.

0

W prawym pasku

W lewym pasku

W lewym górnym rogu

Brak strony z danymi kontaktowymi

W stopce

W prawym górnym rogu

10

20

30

40

Na środku strony

Liczba wystąpień

Po

łożeni

e o

dn

ośnik

a

background image

ROZDZIAŁ 2

18



Adres pocztowy zazwyczaj nie był podany (54,5%) albo był umieszczony w stopce 
(40%) lub w górnej części strony (5,4%).



Odnośnik Kontakt umieszczony był w prawym górnym rogu strony (71%) 
lub w stopce (45,4%).





Kontakt (ang. Contact, 59,7%) albo Skontaktuj się z nami (ang. Contact us, 21%) 
były najczęściej używanymi hasłami w odnośniku do danych kontaktowych

1

.

Rysunek 2.6. Warianty nazwy odnośnika do strony kontaktowej

1

  Statystyki procentowe dotyczą terminów angielskich — przyp. red.

PODSTRONA  „O NAS”

Podstrona O nas (ang. About) jest używana do przedstawienia członków zespołu, 
wyjaśnienia fi lozofi i agencji, podkreślenia doświadczenia i profesjonalizmu. Przybliża ona 
studio projektowe użytkownikowi oraz — jeśli została dobrze zaprojektowana — budzi 
zaufanie potencjalnych klientów.

Podstrona O nas jest bardzo ważna w przypadku stron portfolio — 89% stron, które 
analizowaliśmy, posiadało odnośnik do niej w głównej nawigacji.

To, jaki poziom szczegółowości zastosujesz w opisie swojej agencji, oczywiście zależy tylko 
od Ciebie. 59,1% stron, które analizowaliśmy, stosowało w przypadku podstrony O nas 
kompaktowy opis fi rmy bez dalszego podziału na podstrony. Często na takich stronach 
pojawiały się zdjęcia członków zespołu, ich dane osobowe oraz informacje o procesie 
projektowania. Najczęściej w nieformalnej i przyjaznej, a czasem nawet zabawnej formie. 
Najbardziej popularne sformułowania w odniesieniu do odnośnika do tej podstrony były 
następujące: My (ang. About, 43,6%), O nas (ang. About us, 27,3%) oraz Kim jesteśmy 
(ang. Who we are, 7,2%).

Kontakt (59,7%)

Skontaktuj się z nami (21%)

Skontaktuj się (8,1%)

O nas (4,7%)

Inne (6,5%)

background image

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

19

PODSTRONA „KLIENCI”

Jednym z mocnych dowodów profesjonalizmu i dobrej reputacji w branży jest solidna lista 
klientów, z którymi dana agencja współpracowała. Oczywiście im bardziej znane fi rmy na 
liście, tym większe prawdopodobieństwo przyciągnięcia uwagi potencjalnych klientów. 
Z naszego doświadczenia wynika, że listy kontrahentów, studia przypadków, referencje są 
bardzo często odwiedzane przez klientów szukających studia projektowego. Tym bardziej 
dziwi nas, że znaleźliśmy tylko kilka stron, na których znajdowały się oddzielne podstrony 
zwierające listę klientów.

Według naszej analizy 47,2% stron portfolio posiadało sekcję poświęconą klientom, 
która była oddzielną podstroną Klienci (ang. Client) albo wchodziła w skład podstrony 
Portfolio. W większości przypadków każdy klient był reprezentowany poprzez logo, 
które było odnośnikiem do studium przypadku opisującego zrealizowany projekt oraz 
zawierającego referencje danego klienta. Najbardziej popularne sformułowania pojawiające 
się w odnośniku do takiej podstrony były następujące: Nasi klienci (ang. Our clients, 46,1%), 
Klienci (ang. Clients, 39,6%) oraz Lista klientów (ang. Client list, 15,4%).

PODSTRONA „USŁUGI”

Biorąc pod uwagę, że użytkownicy zazwyczaj odwiedzają strony WWW w poszukiwaniu 
konkretnych usług, bardzo rozsądnym rozwiązaniem jest umieszczenie klarownego tekstu 
wprowadzającego na pierwszej stronie lub osobnej podstronie Usługi (ang. Services). 
Umieszczenie ważniejszych pozycji z oferty na takiej podstronie jest również dobrym 
pomysłem, ponieważ potencjalni klienci zwykle dobrze wiedzą, czego szukają: 
projektowania animacji (ang. motion design), projektowania do druku, projektowania stron 
WWW, projektowania okładek CD/DVD itp.

67,2% stron analizowanych portfolio miało oddzielną podstronę Usługi. Pozostała część 
zawierała informacje o ofercie na podstronie O nas lub na stronie głównej. Czasami 
podstrona Usługi zawierała dalszy podział na podstrony (35,1%). W większości przypadków 
miała ona postać dość długiej i szczegółowej pojedynczej strony.

Umieszczenie podstrony Usługi na stronie portfolio jest zdecydowanie dobrym pomysłem. 
Takie rozwiązanie jest swoistym połączeniem teorii z praktyką i pokazuje, do czego jest 
zdolne biuro projektowe. Najpopularniejszymi wyrażeniami używanymi w odnośniku 
do tej podstrony były: Usługi lub Nasze usługi (ang. Services lub Our Services, 75,7%) 
oraz Co robimy (ang. What we do, 10,8%).

PODSTRONA „REALIZACJE”

Oczywiście potencjalni klienci chcą wiedzieć, co potrafi  biuro projektowe. Czy mają 
podobne wyczucie stylu? Jaki rodzaj estetyki jest wrażony przez projekt wizualny, typografi ę 
oraz użyteczność? Czy projekt jest intuicyjny i wygląda atrakcyjnie? To są pytania, na które 
potencjalni klienci chcą znaleźć odpowiedź, gdy są zainteresowani współpracą z biurem 

background image

ROZDZIAŁ 2

20

projektowym. Zaprezentowanie zrealizowanych projektów może przypieczętować sprawę 
i przekonać ich, aby skontaktowali się z biurem.

Warto uzupełnić taki pokaz o możliwość sortowania i fi ltrowania zrealizowanych projektów 
według stylu, branży oraz roku, dodać kilka informacji na temat każdego projektu, a nawet 
szczegółową analizę przypadku wraz z referencjami i wglądem w metodykę pracy. Niestety, 
tylko kilka stron portfolio miało coś takiego. 

Nasze studium wykazało następujące wyniki:



7,2% stron nie miało wcale podstrony z prezentacją wykonanych projektów.



12,7% miało tylko logo fi rmy lub zrzuty ekranu projektu, bez opisu i analizy przypadku.



16,4% zawierało krótki opis każdego projektu obok logo fi rmy oraz (lub) zrzutu ekranu.



63,6% zawierało bardzo szczegółową podstronę dla każdego projektu, w tym 
studium przypadku, referencje, pokaz slajdów ze zrzutów ekranu oraz projekty wersji 
roboczych i szkice.





Co zaskakujące, najpopularniejszymi wyrażeniami używanymi w odnośniku do takiej 
podstrony były: Prace lub Nasze prace (ang. Work lub Our work, 47,2%), następnie 
Portfolio (27,2%).

PODSTRONA „JAK  PRACUJEMY”

Faktycznie podstrona Jak pracujemy (ang. Workfl ow) lepiej pasuje jako podstrona sekcji 
O nas niż samodzielna

 

strona. Jednakże niektórym projektantom zależy na tym, aby opis 

poszczególnych etapów pracy nad projektem był bardziej widoczny. Podczas gdy 74,5% 
stron, które analizowaliśmy, w ogóle nie miało podstrony Jak pracujemy, reszta w sposób 
dość szczegółowy wyjaśniała potencjalnym klientom, jak wygląda ich proces tworzenia 
i jakie mogą mieć w związku z tym oczekiwania.

Udostępnienie potencjalnym klientom możliwości lepszego zrozumienia, w jaki sposób 
będą uczestniczyć w całym procesie projektowania, jest z pewnością dobrym pomysłem. 
Najbardziej popularne sformułowania w odnośniku do takiej podstrony są następujące: 
Jak pracujemy lub Współpraca z nami (ang. How we work lub Working with us, 42,8%), 
Metodologia lub Nasza metodologia (ang. Process lub Our process, 35,7%) albo Nasze 
podejście
 (ang. Approach, 7,1%).

PODSTRONA „KONTAKT”

Jeśli wszystko pójdzie dobrze, Twoja strona zyska popularność użytkowników, a wtedy 
podstrona Kontakt będzie ich najczęstszym miejscem docelowym. Zrób wszystko, aby 
kontakt z Tobą był tak prosty, jak to możliwe. Upewnij się, że użytkownicy mogą przekazać 
wszelkie istotne informacje dotyczące ich projektu w prostym, przyjaznym formularzu. 
Możesz również umieścić swój numer telefonu, adres pocztowy, adres e-mail — im więcej, 
tym lepiej. Wskazówki dojazdu, odnośniki do profi li społecznościowych, vCard są również 
dobrym pomysłem.

background image

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

21

Nasze studium wykazało następujące wyniki:



9% stron nie zawierało podstrony Kontakt (dane kontaktowe były umieszczone 
w stopce każdej podstrony).



45,5% stron udostępniało wskazówki dojazdu (często wraz z interaktywną mapą Google).



83,6% stron prezentowało na podstronie Kontakt numer telefonu oraz adres e-mail.





76,7% stron posiadało na podstronie Kontakt adres pocztowy.





69% stron udostępniało formularz kontaktowy.





14,5% stron dawało możliwość pobrania wizytówki vCard, zazwyczaj obok adresu 
e-mail.





Linki do portali społecznościowych, takich jak Facebook, Twitter i LinkedIn, są często 
używane (14,5%).

SPECJAŁY I DODATKI

Zauważyliśmy również, że niektóre agencje projektowe oferowały swoim potencjalnym 
klientom kilka specyfi cznych elementów. Jednym z bardziej popularnych był formularz 
zamówienia projektu lub oferty, który potencjalni klienci mogli wysłać ze strony. Niektóre 
agencje projektowe oferowały możliwość zaplanowania projektu, oszacowania kosztów oraz 
wysłania zapytania o bardziej szczegółowy kosztorys.

Wśród innych interesujących dodatków wyróżniliśmy: okno czatu na stronie Kontakt 
(np. „Stress-o-meter” fi rmy Agami Creative, który wyświetla aktualną dostępność 
pracowników fi rmy), kalkulator kosztów (ang. quote calculator) oraz prezentację referencji 
(zazwyczaj w formacie PDF).

INNE ODKRYCIA

Odkryliśmy również, że:

 



Żadna strona portfolio nie zawierała podstrony Pytania i odpowiedzi (ang. FAQ).





76,3% stron internetowych zawierało przynajmniej jeden blog, a wiele z nich dwa, 
a nawet i więcej blogów.





14,55% posiadało newsletter lub listę wysyłkową (ang. mailing list).





9% zawierało szczegółową mapę strony.

background image

ROZDZIAŁ 2

22

PODSUMOWANIE

Najważniejsze ustalenia naszego studium są następujące:

 



82% stron portfolio, które analizowaliśmy, posiadało lekki projekt z neutralnymi, 
stonowanymi kolorami.





79% posiadało tradycyjny układ blokowy, z dwoma lub trzema wyraźnie oddzielonymi 
kolumnami oraz z prostą, wygodną nawigacją.





79% stron WWW w różnej formie posiadało blok wprowadzający w górnej części strony.





89% stron miało układ wyśrodkowany w poziomie.





80% posiadało dużą poziomą nawigację.





51% posiadało dużą poziomą nawigację z elementami wyrównanymi do lewej.





89% nie posiadało mechanizmu wyszukiwania.





Tylko 3,7% znacząco używało animacji Flash w obrębie całego serwisu.





Odnośnik do podstrony z danymi kontaktowymi znajdował się albo w prawym 
górnym rogu strony (71%), albo w stopce strony (45,4%).





89% stron posiadało odnośnik do podstrony O nas (ang. About) w głównej nawigacji.





Tylko 47,2% stron portfolio posiadało podstronę Klienci (ang. Client).





67,2% stron portfolio posiadało odrębną podstronę Usługi (ang. Services).





63,6% stron portfolio posiadało szczegółową podstronę dla każdego projektu, w tym 
studium przypadku, referencje, pokaz slajdów ze zrzutów ekranu, projekty wersji 
roboczych oraz szkice.





74,5% stron portfolio nie posiadało podstrony Schemat pracy (ang. Workfl ow).





Strona kontaktowa powinna zawierać wskazówki dojazdu, numer telefonu, adres 
e-mail, kod pocztowy, vCard oraz formularz online.

Vitaly Friedman pracuje na stanowisku Editor-In-Chief w Smashing Magazine.

background image

R

O

ZDZIAŁ

 3

3

TWORZENIE 

EFEKTYWNEGO 

PORTFOLIO ONLINE

Sean Hodge

TWOJE PORTFOLIO

 

JEST

 prezentacją Twojej pracy, umiejętności i potencjału dla przyszłych 

pracodawców. Im więcej czasu i wysiłku poświęcisz stworzeniu użytecznego i dobrze 
wyglądającego projektu, tym większe będziesz mieć szanse na dodatni bilans na koncie pod 
koniec miesiąca. W jaki sposób upewnić się, że Twoje portfolio będzie lepsze od konkurencji? 
Jak przyciągnąć uwagę pracodawców do Twojej pracy?

Stworzenie efektywnego portfolio jest łatwiejsze, niż myślisz. Spraw, żeby było proste i łatwe 
w użyciu, żeby realizowało postawione przed nim cele — tak się robi efektywne portfolio. 
W tym artykule omówimy pięć najważniejszych pułapek, w jakie wpadają twórcy portfolio. 
Następnie przedstawię kilka porad, których skuteczna realizacja przyniesie wysokiej jakości 
wyniki.

Zacznijmy od błędów, jakie popełniają projektanci portfolio, żebyś wiedział, czego się 
wystrzegać.

background image

ROZDZIAŁ 3

24

PUŁAPKA 1. PRZEGADANIE

Czytelność i skupienie na zadaniu powinny być podstawowym założeniem portfolio. 
Nie używaj dwudziestu słów, jeśli wystarczy siedem. Daj swoje najlepsze treści na początek. 
Gdzie to tylko możliwe, umieszczaj najważniejszą treść powyżej linii zgięcia. Unikaj 
skomplikowanych wywodów. Staraj się nie tworzyć za wielu poziomów i upewnić się, 
że zdefi niowane sekcje realizują jakieś założenia.

W serwisie copyblogger.com znajdziesz artykuł, który zawiera prostą listę sugestii dla pisarzy, 
opartą na pracach popularnego dwudziestowiecznego autora znanego z unikania pustosłowia. 
Chodzi o artykuł Ernest Hemingway’s Top 5 Tips for Writing Well (www.copyblogger.com/ernest-
hemingway-top-5-tips-for-writing-well
). Hemingway znany był z mistrzostwa krótkich zdań, 
silnego, zdecydowanego języka i czytelności. Te same zasady defi niują skuteczne pisanie treści 
w sieci WWW.

W artykule Creating Th

  e Perfect Portfolio (www.digital-web.com/articles/the_perfect_portfolio

Collisa Ta’eed przedstawia porady dotyczące portfolio z punktu widzenia potencjalnego 
pracodawcy. Sekcja zatytułowana Get to it (w wolnym tłumaczeniu: „Przejdź do 
konkretów”) wyjaśnia, dlaczego należy ograniczyć liczbę elementów prezentowanych 
w portfolio: chodzi o to, żeby Twoje najlepsze prace były łatwiejsze do odnalezienia. 
Pracodawca musi w krótkim czasie przejrzeć dużą liczbę kandydatur. Masz większe szanse 
się przebić, jeśli Twoja najlepsza praca będzie widoczna od razu. Portfolio Evana Eckarda 
(www.evaneckard.com/) jest przykładem strony WWW promującej jego najlepsze prace już 
na stronie głównej, dzięki czemu szybko „przechodzi do konkretów”.

PUŁAPKA 2. 
ZA DUŻO INFORMACJI NARAZ

Inna pułapka polega na tym, że próbuje się przekazać za dużo informacji na małej 
przestrzeni. Musisz postarać się uzyskać równowagę w liczbie podstron, które powinien 
kliknąć użytkownik w celu uzyskania dodatkowych informacji, a ilością informacji na 
każdej podstronie. Ta reguła jest szczególnie ważna podczas tworzenia portfolio.

Im więcej informacji jest upakowanych w portfolio, tym bardziej zabałaganione będzie się 
ono wydawać. Jeśli koniecznie musisz umieścić na stronie dużą ilość informacji, zapoznaj się 
z artykułem Grid and Column Designs w serwisie WebDesigner Wall (www.webdesignerwall.
com/trends/grid-and-column-designs
). Po
dsunie Ci on doskonałe pomysły na temat 
wykorzystania siatki do prezentacji dużej ilości informacji.

background image

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

25

PUŁAPKA 3. CO ZA DUŻO, TO NIEZDROWO

Decydując się na zachowanie prostoty i dobrej organizacji, trudno popełnić błąd. Taka 
decyzja jest właściwa we wszystkich obszarach portfolio. Mniej znaczy więcej. Im więcej 
chcesz zrobić w portfolio, tym większa szansa, że coś pójdzie źle.

Demonstracja osiemnastu projektów będzie mniej skuteczna, niż gdybyś skupił się na kilku. 
Za wiele rodzajów prac albo za dużo projektów jednego typu prawdopodobnie spowodują 
zagubienie użytkownika. Nie zauważy on tych kilku perełek, które pokazują, jak doskonałą 
pracę wykonałeś.

PUŁAPKA 4. NIETYPOWA NAWIGACJA

Projektanci odczuwają silną potrzebę wyróżniania się. Ostatnim miejscem, w którym 
powinieneś dawać upust tej potrzebie, powinna być nawigacja na stronie. To prosta 
arytmetyka. Im więcej użytkowników zrazi się z powodu problemów z nawigacją, 
tym mniejsze szanse, że portfolio osiągnie swoje cele.

Kyle Meyer w swoim artykule My Last Portfolio Sucked, Yours Might Too (http://astheria.
com/design/my-last-portfolio-sucked-yours-might-too
) pr
ezentuje kilka doskonałych 
przykładów decyzji związanych z nawigacją, jakich należy unikać. Analizuje 200 przykładów 
portfolio i wylicza ich problemy. Błędy związane z nawigacją dotyczyły ponad 
32% przykładów.

Rysunek 3.1. Przykłady projektów nawigacji, jakich należy unikać

background image

ROZDZIAŁ 3

26

PUŁAPKA 5. BAŁAGAN WIZUALNY

Zastanówmy się nad rolą elementów dekoracyjnych. To doskonale, jeśli taki element 
realizuje Twoje cele i stanowi uzupełnienie pracy. W przeciwnym razie należy go usunąć. 
Puste przestrzenie nadają portfolio profesjonalnego wyrazu. Im więcej elementów 
spróbujesz tam wcisnąć, tym trudniej będzie osiągnąć wrażenie profesjonalizmu.

Do nawigacji po stronie zastosuj hierarchię. W artykule Visible Narratives: Understanding 
Visual Organization
 (www.boxesandarrows.com/view/visible_narratives_understanding_
visual_organization
) Lu
ke Wroblewski wyjaśnia reguły rządzące wizualną hierarchią.

Ten sam projektant w wywiadzie Where Visual Design Meets Usability (www.uie.com/
articles/wroblewski_interview
) om
awia zasady hierarchii stron oraz problemy wynikające 
z bałaganu wizualnego. W tym wywiadzie Wroblewski odwołuje się do nauk Edwarda Tuft e, 
nawołujących do unikania zbędnych informacji.

REGUŁY EFEKTYWNEGO 
PROJEKTU PORTFOLIO

W kolejnych punktach przedstawię kilka sugestii dotyczących udoskonalania portfolio 
(albo stworzenia dobrego, jeśli jeszcze go nie masz). Pamiętaj, że niektóre z tych porad 
wymagają cierpliwości, czasu i dużej ilości planowania. Warto jednak podjąć ten wysiłek. 
Przedstawione przykłady pokazują, że stosując się do tych dwunastu wskazówek, można 
osiągnąć niesamowite rezultaty.

ZDEFINIUJ SWOJE KRYTERIA 
I STRATEGIE SUKCESU

W przypadku każdego projektu pierwszym krokiem powinno być jasne zdefi niowanie celów. 
Gdy już wiesz, jakie cele masz przed sobą, wszelkie decyzje będą podejmowane w zgodzie 
z nimi. Poniższa lista prezentuje kilka typowych celów stawianych przed projektami portfolio. 
Należy pamiętać, że często zdarza się, iż portfolio musi realizować więcej niż jeden cel. Może 
też być tak, że będziesz musiał zbudować kilka różnych portfolio do różnych celów.



Portfolio dedykowane znalezieniu pracy. Jeśli aktywnie poszukujesz pracy, głównym 
celem portfolio powinno być właśnie jej znalezienie. W tym przypadku powinno ono 
być przygotowane z myślą o fi rmie, w której chciałbyś pracować.





Portfolio generujące sprzedaż ma za zadanie utrzymać przepływ zamówień na stałym 
poziomie. W tym przypadku cel polega na zachęceniu klientów do generowania 
zamówień.

background image

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

27





Portfolio budujące reputację służy do wykreowania nazwiska w środowisku oraz 
online. Może mieć postać pokazu umiejętności artysty, można też stworzyć portfolio 
w postaci bloga.





Portfolio społecznościowe tworzy powiązania. Wiele sieci społecznościowych oferuje 
doskonałe narzędzia do budowania portfolio, umieszczenie go na ich stronie może 
mieć pewne zalety. Jedną z najważniejszych jest wykorzystanie mechanizmów strony 
do zawierania nowych znajomości.

ROZWAŻ STWORZENIE KILKU PORTFOLIO

Istnieje wiele powodów posiadania większej liczby portfolio. Być może masz więcej 
niż jedną umiejętność, którą chcesz promować. A może chcesz wysłać portfolio do 
konkretnego dyrektora marketingu w celu zdobycia określonej pracy. Dyrektor doceni 
to, że przygotowałeś portfolio z myślą właśnie o nim. Pozwoli to fi rmie oszczędzić czas 
i demonstruje Twoje zaangażowanie, nawet jeśli portfolio będzie niezbyt rozbudowane.

Nawet jeśli wszystkie one będą częściowo zawierały te same informacje, przygotowanie 
portfolio pod kątem każdego z odbiorców może być korzystne.

Weźmy za przykład Nika Ainleya, projektanta i ilustratora z Wielkiej Brytanii. Przygotował 
on kilka różnych portfolio realizujących różne cele. Udziela się w społecznościach 
promujących portfolio w celu zbudowania reputacji i nawiązywania kontaktów z innymi 
projektantami. Jego stronę, Shiny Binary, odwiedziło już ponad milion osób.

Nik ma portfolio w serwisie Behance (www.behance.net/shinybinary). Należy tam do kilku 
grup i ma spory krąg znajomych. To portfolio zawiera wyraźny przekaz sugerujący, że Nik 
jest dostępny jako freelancer do długoterminowych kontraktów, pracy na pełny etat i do 
zleceń konsultingowych.

Posiada również bardzo popularne portfolio w serwisie DeviantArt (shinybinary.deviantart.
com
). Jest członkiem tej społeczności od 2004 roku i obecnie posiada ponad 80 elementów 
portfolio oraz 1000 komentarzy. Wielu fanów oznaczyło jego prace jako ulubione.

W serwisie CPLUV jest mniej aktywny, ale i tu posiada portfolio (www.cpluv.com/profi le/
users/shinybinary
). Jeg
o portfolio na Depthcore (depthcore.com/artist/Nik+Ainley/) jest 
naprawdę dobre. Na tej stronie znajdują się prace tylko tych artystów, którzy zostali przez 
kogoś poleceni, więc jakość jest tu wysoka.

background image

ROZDZIAŁ 3

28

Przykład Nika Ainleya pokazuje, że warto posiadać kilka zupełnie różnych portfolio 
online, nawet jeśli część z demonstrowanych prac będzie się powtarzać. Każde z nich 
jest skierowane do innych odbiorców. Jeśli zrobisz podobnie, nawiążesz nowe kontakty 
z ciekawymi ludźmi i zaprezentujesz im swoją pracę.

ZDEFINIUJ SWOJEGO ODBIORCĘ

Im nasz projekt jest lepiej dopasowany do wybranego rynku, tym bardziej przemówi do 
odbiorców. Jeśli celujesz w klientów korporacyjnych z konserwatywnej branży, zaprezentuj 
im czyste, poprawne marketingowo i profesjonalnie wyglądające portfolio. Nie pokazuj 
kontrowersyjnych, mrocznych, artystycznych wizji, chyba że takie są oczekiwania rynku.

Artykuł Th

  e Secret to Getting a Lot of Web Design Work (Jak zdobyć dużo zleceń jako 

projektant WWW) autorstwa Collisa Ta’eeda (freelanceswitch.com/designer/the-secret-to-
getting-a-lot-of-web-design-work
) zawiera sekcję zatytułowaną Design the portfolio you 
think your clients want to see
 (Zaprojektuj portfolio, jakie chciałby zobaczyć twój klient). 
I dokładnie o to chodzi. Skup się w swoim portfolio na odbiorcy. Jeśli starasz się zdobyć 
klientów o określonych preferencjach, projektuj z myślą właśnie o nich.

Rysunek 3.2. Shiny Binary, strona Nika Ainleya

background image

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

29

Istnieje więcej zalet myślenia o określonych odbiorcach. W artykule Finding a Target Market 
(Znaleźć rynek docelowy, www.digitaloutput.net/content/ContentCT.asp?P=843) Barbara 
Pellow omawia poziome i pionowe podejście do marketingu zorientowanego na odbiorcę. 
Identyfi kuje kilka innych zalet tego typu marketingu. Systematyczne przemawianie do 
określonego słuchacza pozwala znacznie łatwiej zostać uznanym ekspertem w danej 
dziedzinie. Ustalenie odbiorcy pozwala wyróżnić własne usługi.

Weźmy na przykład projektanta WWW, który specjalizuje się w tworzeniu stron WWW 
fi rm prawniczych. Jego rynek docelowy będzie zupełnie inny niż ten, dla którego pracuje 
projektant stron WWW zespołów rockowych. Język, grafi ka i podejście prezentowane 
w portfolio będą znacząco się różnić. Projektant WWW, który posiada solidne portfolio 
stron WWW fi rm prawniczych, łatwiej znajdzie klienta na tym rynku od innego projektanta 
lub agencji, które nie mogą pochwalić się tego typu doświadczeniem.

Często zdarza się zatem, że projektanci próbują się wyróżniać, wybierając określony 
rynek docelowy dla swojego portfolio. Skuteczność w poszukiwaniu zleceń dzięki 
zagospodarowaniu wybranej niszy będzie się stopniowo zwiększać wraz z rozbudową 
portfolio. Jako przykład skutecznego ograniczenia rynku można podać portfolio 
Dana Gilroya (www.dangilroy.com/portfolio.htm).

Rysunek 3.3. Dostosuj wygląd portfolio do planowanego odbiorcy.

Copyright © 2010 Dan Gilroy Design, LLC

background image

ROZDZIAŁ 3

30

Wybór rynku docelowego jest krytycznym etapem przed rozpoczęciem wyboru elementów 
portfolio i projektowania wizualnego strony.

USTAL PRIORYTET NA UŻYTECZNOŚĆ

Nawigacja ma znaczenie podstawowe. Zobacz wcześniejszą uwagę na temat nietypowej 
nawigacji. Innym ważnym zagadnieniem są standardy WWW. To jest szczególnie ważne 
w przypadku, gdy szukasz pracy. Przeczytaj artykuł Five Steps to a Better Design Portfolio 
(Pięć kroków do lepszego portfolio) Jeff reya Veena (www.veen.com/jeff /archives/000935.
html
). Veen
 omawia w nim najlepsze praktyki tworzenia portfolio w kontekście tego, jak 
będą odbierane przez pracodawców.

Nie lekceważ też wyszukiwarek. Popracuj nad SEO. Dobrym źródłem informacji na ten 
temat jest blog SEOBook (www.seobook.com/blog). Dobre SEO zwiększa szanse na to, 
że potencjalni klienci znajdą Cię w wyszukiwarce.

UŻYJ WŁAŚCIWEJ TECHNOLOGII

Jeśli poszukiwana przez Ciebie praca wymaga zastosowania określonych technologii, to warto 
zastosować je również w swoim portfolio. Oczywiście Flash jest fajny, ale czy to odpowiednie 
narzędzie do budowania Twojej strony? Prawdopodobnie nie, jeśli jesteś projektantem 
specjalizującym się w tworzeniu logo. Jeśli jednak szukasz pracy jako projektant aplikacji Flash 
w renomowanej agencji, to ta technologia jest właściwym wyborem.

Nawigacja w portfolio projektanta Matthew V. Robinsona (www.matthewvrobinson.com
jest łatwa w użyciu. Kluczem do sukcesu strony WWW stworzonej we Flashu jest prędkość 
działania. Portfolio Matthew jest bardzo użyteczne i wygląda świetnie.

Decydując się na technologię, weź pod uwagę koszt utrzymania. Maksymalne uproszczenie 
portfolio skróci czas niezbędny na aktualizacje i wprowadzanie zmian.

Jak łatwo możesz dodawać elementy do swojego portfolio? Im łatwiej, tym większa szansa, 
że będziesz regularnie je aktualizować. Jamie Gregory (www.jamiegregory.co.uk) ma 
proste, eleganckie i efektywne portfolio na pojedynczej podstronie. Z pewnością nie ma 
najmniejszych problemów z dodawaniem lub zamienianiem elementów.

background image

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

31

Dobierając technologię, weź pod uwagę zastosowanie techniki stopniowego udoskonalania. 
Dobrym wyborem jest dodanie niewielkiej ilości kodu JavaScript lub innej technologii, 
ale unikanie opierania na nich funkcjonowania strony. Dzięki temu osiągniesz cele bez 
komplikowania projektu. W portfolio Mariusa Roosendaala (www.mariusroosendaal.
com
) poświęć
 chwilę na przeanalizowanie kodu: zobacz, jaki jest prosty i czytelny oraz 
uzupełniony o eleganckie rozwiązania z użyciem JavaScriptu.

Zastanów się chwilę nad wyborem między statyczną stroną a systemem zarządzania 
treścią. Portfolio jednostronicowe jest łatwe w aktualizacji i pozwala na szybkie 
zademonstrowanie najlepszych dokonań. Jeśli zastosujesz jedną stronę, nie będziesz też 
miał problemów nawigacją. Ale problemem może być mała elastyczność i nie będziesz 
miał możliwości wykorzystania dodatkowych funkcji systemów zarządzania treścią, 
jak na przykład obsługa bloga.

ZAPLANUJ PROJEKT

Kluczowym czynnikiem stworzenia efektywnego portfolio jest potraktowanie go w taki sam 
sposób, w jaki traktujesz zlecenia. Zarządzaj nim tak samo profesjonalnie jak każdą inną 
stroną WWW, którą się zajmujesz. Wygospodaruj odpowiednią ilość czasu na zrealizowanie 
zaplanowanych celów. Zdefi niuj też terminy i staraj się ich trzymać, aby kontrolować czas.

Rysunek 3.4. Portfolio Matthew Robinsona łączy łatwą w obsłudze nawigację z efektownością animacji Flash

background image

ROZDZIAŁ 3

32

OGRANICZ ZAKRES I TYP 
PROMOWANYCH PROJEKTÓW

Twoje portfolio powinno ograniczać się do najlepszych prac w założonym zakresie celów. 
Jeśli szukasz zleceń związanych z projektowaniem stron WWW, powinno się ono składać 
tylko z prac tego typu, nie powinno natomiast zawierać projektów logo lub materiałów 
przeznaczonych do druku. Jeśli nie szukasz pracy danego typu, nie chwal się dokonaniami 
w tym zakresie. Efekt będzie znacznie lepszy.

Jesse Bennett-Chamberlain w maju 2007 roku przeprojektował serwis 31three.com
Wcześniej w swoim portfolio miał projekty do druku i logotypy. Tworząc nowy projekt, 
zdecydował się ustalić węższy zakres adresatów, skupiając się na wsparciu projektowym 
dla programistów.

Jego obecne portfolio prezentuje wyłącznie projekty stron WWW i interfejsów, ponieważ 
takiej pracy szuka. To portfolio jest uznane za bardzo dobre i jest często cytowane 
w blogosferze.

To nie oznacza, że Jesse nie robi projektów logo, a nawet projektów tożsamości wizualnej 
marek. Wręcz przeciwnie, ale uznał, że klienci rzadko przychodzą do niego, prosząc 
o zaprojektowanie samego logo. Przychodzą natomiast z prośbami o zaprojektowanie całych
nowych stron WWW lub przebudowy istniejących, a logo jest jedynie jednym z elementów 
wchodzących w skład pakietu. Więcej informacji na temat procesu przeprojektowywania 
strony jego portfolio znajdziesz w artykule Redesigning the ExpressionEngine Site 
(Nowy projekt strony ExpressionEngine, www.digital-web.com/articles/redesigning_the_
expressionengine_site
).

Oczywiście niektórzy projektanci i fi rmy mają różne doświadczenia. Im więcej rzeczy 
potrafi sz robić dobrze, tym większym wyzwaniem jest dobra ich promocja. Jeśli to tylko 
możliwe, staraj się zminimalizować liczbę prezentowanych prac. Dziesięć doskonałych 
pozycji z reguły działa skuteczniej niż pięćdziesiąt dobrych.

INFORMACJE, DOKUMENTACJE 
I OBJAŚNIENIA

Informacje kontaktowe powinny być łatwe do odszukania, a formularze kontaktowe 
powinny być łatwe w użyciu. Postaraj się, żeby ta informacja była dobrze widoczna. 
Portfolio Hicksdesign (www.hicksdesign.co.uk/) zawiera informacje kontaktowe na każdej 
podstronie.

background image

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

33

Jasne określenie Twojej roli w projektach prezentowanych w portfolio zwiększy zaufanie 
potencjalnych klientów. Jeśli zaprojektowałeś stronę, ale została ona zaprogramowana 
przez kogoś innego, napisz to. Jeśli samodzielnie zrobiłeś wszystko, również umieść taką 
informację. Cameron Moll (www.cameronmoll.com/portfolio/) stosuje właśnie tę zasadę.

Głębszy wgląd w projekty zapewniają studia przypadków. Gdy klient skończy pobieżne 
przeglądanie portfolio różnych kandydatów, być może pojawi się u Ciebie ponownie, żeby 
pogłębić temat. Studia przypadków prezentują, jak skrupulatny i kompetentny jest Twój 
proces pracy. David Airey ułatwia odszukanie swoich studiów przypadku (www.davidairey.com/
miskeeto-logo-design/
).

Rysunek 3.5. Na każdej podstronie portfolio Hicksdesign znajdziesz odnośnik kontaktowy. 

© Hicksdesign Ltd 2002 – 10

Rysunek 3.6. Projekt logo dla miskeeto autorstwa Davida Aireya jest wyraźnie wyodrębniony na jego stronie

background image

ROZDZIAŁ 3

34

Opinie klientów (ang. testimonials) są wyraźnym sygnałem dla odwiedzających, że 
sprawdzasz się w warunkach praktycznych. Jeśli zostaną ze smakiem wkomponowane 
w portfolio, zwiększą poczucie profesjonalizmu. Użyteczne uwagi na ten temat przedstawił 
David Airey w swoim artykule Th

  e Importance of Client Testimonials (Znaczenie opinii 

klientów, www.davidairey.com/the-importance-of-client-testimonials/).

ZAPREZENTUJ SWOJĄ PRACĘ 
W KONTEKŚCIE USTALONYCH CELÓW

Twoja praca powinna być najważniejszym elementem portfolio. Jeśli niesamowity układ 
strony przytłacza treść, to istnieje duże ryzyko, że przekaz nie dotrze do adresata. Uważnie 
przemyśl każdy element wizualny, jaki planujesz dodać do strony. Jeśli nie jesteś pewny, 
wybieraj prostotę.

ZAWRZYJ W PROJEKCIE SWOJĄ OSOBOWOŚĆ 

Portfolio Nicka La demonstruje jego styl projektowania i zainteresowania. Szczególnie 
wyróżnia się unikalna ilustracja tła. Nie zmniejsza użyteczności i doskonale sprawdza 
się jako tapeta. W niektórych przypadkach zastosowanie tego typu zabiegu mogłoby 
przeszkadzać przekazowi, ale w przypadku portfolio Nicka działa wyśmienicie.

W swoim słynnym projekcie z 2009 roku Nick ułożył ilustracje z białą ramką w silnym, 
dwukolumnowym układzie. Prezentowane prace komponują się z ilustracją użytą 
w charakterze tła. Skuteczna realizacja tego typu elementu charakterystycznego nie jest 
łatwa, ale powoduje, że portfolio staje się nie tylko łatwe do zapamiętania, lecz także 
wzbudza zachwyt.

Nick ze swoim portfolio N.Design Studio (www.ndesign-studio.com/portfolio) osiągnął 
ogromny sukces. Pozostawienie odcisku własnej osobowości w projekcie zawsze wiąże się 
z odwołaniem się do poczucia estetyki, które autor budował w sobie przez wiele lat.

Seth Godin zgłasza kilka cennych uwag na ten temat w artykule How to Be Remarkable 
(Jak być zachwycającym, sethgodin.typepad.com/seths_blog/2007/01/how_to_be_remar.
html
). Pisze między innymi: „Zachwyt bierze się ze skrajności: największy, najszybszy, 
najwolniejszy, najbogatszy, najprostszy, najbardziej skomplikowany”. To celne spostrzeżenie, 
ale żyjąc na krawędzi, znacznie zwiększasz ryzyko spadnięcia w przepaść.

background image

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

35

Dokładnie się zastanów, w jaki sposób połączysz tego typu osobiste elementy w swoim 
portfolio bez poświęcania użyteczności czy zaburzania równowagi między nim a wyglądem 
reszty witryny WWW.

PROMUJ SWOJĄ PRACĘ

Istnieje wiele sposobów na promocję portfolio. Rozważ przystąpienie do społeczności online 
w celu nawiązania kontaktów z innymi jej członkami. W tym artykule wspomniałem o kilku 
tego typu społecznościach, które pozwalają na publikację portfolio. Zostaw wiadomość 
na forum projektantów WWW z informacją, gdzie można znaleźć portfolio. Wyślij swoje 
projekty do galerii stron WWW. Do promocji portfolio można wykorzystać praktycznie 
dowolną strategię promocji strony WWW.

Dodaj bloga na swojej stronie. Im więcej ruchu przyciągniesz, tym większa szansa, 
że portfolio zostanie zauważone. Dan Cederholm był jednym z pierwszych projektantów 
świadomie stosujących tę technikę i zdobył rozgłos dzięki blogowi Simplebits (simplebits.com). 
Jego portfolio można znaleźć na tej samej witrynie WWW.

Rysunek 3.7. Osobowość Nicka La jest wyraźnie wyeksponowana w jego portfolio. 

© N.Design Studio 2010

background image

ROZDZIAŁ 3

36

Do autopromocji zalicza się również umieszczanie odnośnika do strony portfolio 
w wysyłanych wiadomościach e-mail. Umieść odnośnik również w swoim profi lu na 
Facebooku i każdym innym serwisie społecznościowym, do którego należysz. Zintegruj 
swoje portfolio z każdą możliwą komunikacją i obecnością online.

OPRACUJ CELE DŁUGOFALOWE

Zawsze warto mieć jasną wizję przyszłości. Twoje potrzeby będą ewoluowały wraz 
z realizowaniem różnych zleceń na kolejnych etapach kariery. Doświadczenia z najbliższej 
przeszłości również będą miały wpływ na to, w jaki sposób będziesz prezentować swoje 
portfolio.

Efektywne portfolio stanowi perfekcyjne połączenie osobowości, efektowności, prostoty 
i łatwości użycia. Spraw, żeby Twoje portfolio wyróżniało się w tłumie i realizowało 
postawione przed nim cele.

Sean Hodge jest kreatywnym umysłem stojącym za AiBURN, blogiem omawiającym 
zagadnienia projektowania, kreatywności, inspiracji i grafi ki.

background image

R

O

ZDZIAŁ

 4

4

UZYSKANIE 

LEPSZEGO 

USER EXPERIENCE 

ZA POMOCĄ 

OPOWIEŚCI

Francisco Inchauste

OPOWIEŚCI DEFINIUJĄ NASZ

 świat. Są z nami od zarania komunikacji. Zaczęło się 

od malunków na skałach jaskiń i historii przekazywanych z ust do ust przy ogniskach. 
Z czasem stale się rozwijały, ale ich cel pozostał niezmienny: dostarczają rozrywki, pozwalają 
przekazywać doświadczenia, uczą i podtrzymują tradycje.

Dziś komunikujemy się w inny sposób. Informacja jest pofragmentowana w przeróżnych 
kanałach medialnych i dostarczana za pośrednictwem różnych technologii. Stała się 
rozcieńczona, sklonowana i przesyłana pośpiesznie w bełkocie 140-znakowych komunikatów. 
Utraciliśmy tego ducha indywidualizmu, gdy osoba przekazująca informację uzupełniała ją 
o własne emocje, wywołując w odbiorcy poczucie zaangażowania.

Wykorzystując technikę opowieści (ang. storytelling), możemy te fragmenty uporządkować 
w jeden, ujednolicony wątek. Możemy połączyć się z odbiorcą jako żywi ludzie, nie 
komputery. W tym rozdziale dowiemy się, w jaki sposób fachowcy z dziedziny user 
experience (doświadczeń użytkownika) wykorzystują technikę opowiadania historii 
do defi niowania interesującego user experience
 budującego emocjonalne powiązania.

background image

ROZDZIAŁ 4

38

WSZYSTKO ZACZYNA SIĘ OD OPOWIEŚCI

W 1977 roku jedna prosta opowieść postawiła na głowie cały przemysł fi lmowy. Technologia 
efektów specjalnych wykorzystana do skonstruowania tej opowieści nie istniała wcześniej 
i nie była dostępna twórcom fi lmów. Autor opowieści odrzucił popularne i łatwo sprzedające 
się tematy (kino apokaliptyczne i katastrofi czne) i zdecydował się podążać za własną wizją. 
Do współpracy zaprosił nikomu nieznanych aktorów, a gatunek fi lmu stanowił relikt z lat 
30. XX wieku. Pomysł został odrzucony przez wiele wytwórni fi lmowych i w pewnym
momencie niewiele brakowało, aby trafi ł na półkę niezrealizowanych projektów.

Filmem tym, o ile nie odgadłeś tego wcześniej, były oczywiście Gwiezdne wojny autorstwa 
George’a Lucasa. Okazały się jednym z najbardziej kasowych fi lmów wszech czasów i są 
uważane za fenomen popkultury. Były pierwszą częścią kultowej trylogii, która całkowicie 
odmieniła sposoby tworzenia efektów specjalnych. Sukces tych fi lmów dał początek wielu 
ważnym obecnie fi rmom przemysłu fi lmowego: LucasFilm, THX, Industrial Light & Magic 
(ILM) czy Pixar.

Jednak istotne jest to, że Gwiezdne wojny nie przekazywały nowatorskiej opowieści. 
Całymi garściami czerpały z archetypów znanych z historii opowiadanych od tysiącleci.

OPISYWANIE PROJEKTU W OPOWIEŚCIACH

Proces tworzenia opowieści jest często postrzegany jako niemal magiczny lub wręcz 
zupełnie przypadkowy. Autor siedzi przed płótnem czy też białą stroną edytora tekstów 
i zaczyna pisać to, co w danej chwili przychodzi mu do głowy. Doskonałe opowieści nie 
pojawiają się jednak w taki sposób — są projektowane. Praca nad nimi opiera się na 
określonych wzorcach. Jeśli chcesz zainteresować ludzi, znajdź dramatyczny temat i zanurz 
się głęboko w psychikę społeczną. Autorzy muszą kierować się pewną określoną metodą 
działania. Rysunek 4.1 przedstawia typowy szablon opowieści. Jeśli jakaś historia nie zdoła 
uzyskać zainteresowania odbiorców, istnieje duże prawdopodobieństwo, że jej autor nie 
wykorzystał tych wzorców w wystarczającym stopniu.

Ta struktura opowieści była stosowana na długo, zanim powstały szkoły dla scenarzystów. 
W pewnym okresie była ona zaledwie niezauważalnym rytmem przewijającym się 
w tle każdej opowieści. Niektóre jej elementy, jak wędrówka bohatera czy mitologia 
porównawcza, zostały spopularyzowane przez Josepha Campbella. Swoje badania opisał on 
w książce Bohater o tysiącu twarzy.

background image

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

39

Campbell był uczniem szwajcarskiego psychiatry Carla Junga, który wierzył, że wszyscy 
rodzimy się z podświadomą ideą tego, czym powinien być „bohater”, „mentor” czy 
„wyprawa”. Studiował struktury religii i mitów wielu kultur. Odkrył między innymi, że 
świadomie lub nie każda opowieść (mit) była oparta na tej samej, prostej formule. Właśnie 
dlatego wspaniałe historie pozostają nimi nawet mimo barier językowych. Spostrzeżenie 
Campbella wywarło istotny wpływ na sposób pojmowania mitologii i religii.

Opowieści, które poruszają nas na srebrnym ekranie i w książkach, opierają się na tych 
samych schematach. O dialogach i scenach opowiadamy przy porannej kawie tak, jak 
byśmy opowiadali o przygodach bliskich znajomych, a nie fi kcyjnych postaci. Dzieje się tak, 
ponieważ w losy postaci i opowieść angażujemy się emocjonalnie.

Marki na co dzień wykorzystują to zaangażowanie emocjonalne. Starbucks nie tylko chce 
sprzedawać nam kawę, chce, abyśmy zainwestowali w tę opowieść, tworząc atmosferę, 
aromaty, społeczność. Celem fi rmy jest, aby stała się „trzecim miejscem” (dom, praca, 
Starbucks). Firma twierdzi, że „chodzi w niej o relacje międzyludzkie”

1

.

SIŁA EMOCJI

Gdy rozmawiamy o opowieściach, z reguły opisujemy doświadczenia związane z emocjami, 
czyli ten aspekt, który dotyczy nas osobiście. To znacząca różnica w stosunku do sposobu, 
w jaki zwykle opisujemy nasze doświadczenia z produktami, jakimi są strony WWW 
i aplikacje. Z reguły są one postrzegane jak narzędzia zorientowane na zadania.

Rysunek 4.1. Wzorzec opowieści stosowany powszechnie przez autorów scenariuszy i powieści

y = napięcie

x = czas

Punkt zwrotny

Kryzysy

Otwarcie

Scena

Początek

Środek

Koniec

Rozwiązanie

1

  http://starbucks.pl/about-us/company-information/mission-statement — przyp. red.

background image

ROZDZIAŁ 4

40

Jeśli za pomocą takiej strony WWW czy aplikacji uda nam się zrealizować nasz cel, na 
przykład przesłać pieniądze drogą elektroniczną w aplikacji bankowej, nasze doświadczenie 
uznajemy za pozytywne. Aby tak się stało, interfejs aplikacji musi być użyteczny i powinien 
działać zgodnie z naszymi oczekiwaniami. Taka opinia jest popularyzowana przez wielu 
ekspertów z dziedziny użyteczności, między innymi Donalda Normana, profesora nauk 
poznawczych i konsultanta użyteczności z Nielsen Norman Group.

Słysząc zarzuty, że tego typu podejście spowoduje, iż „wszystko będzie brzydkie”, Norman 
zdecydował się przestudiować stosunek ludzi do projektu aplikacji. Wyniki swoich badań 
opublikował w książce Emotional Design.

W swoich badaniach Norman odkrył, że projekt wizualny ma wpływ na to, w jaki sposób 
ludzie postrzegają produkty. Odbywa się to na trzech różnych poziomach, które mają 
przełożenie na trzy rodzaje technik projektowania:



projektowanie organiczne (ang. visceral design) — odwołuje się do mechanizmów 
myślowych zakodowanych na poziomie biologicznym. Niektórych rzeczy możemy nie 
lubić w sposób automatyczny (pająki, zapach zgnilizny itp.), a inne lubić („atrakcyjne” 
osoby, symetryczne obiekty itp.). Na tym poziomie odbieramy wygląd rzeczy 
„na pierwszy rzut oka”;





projektowanie behawioralne (ang. behavioral design) — to, w jaki sposób produkt 
działa, wygląd i wrażenia z funkcjonowania, użyteczność, czyli doświadczenie 
z użytkowania produktu;



projektowanie odwzorowawcze (ang. refl ective design) — to, w jaki sposób 
postrzegamy produkt po zatarciu pierwszego wrażenia, gdy wrażenia z użytkowania 
go zaczynamy odwzorowywać na ogólne doświadczenia życiowe i przykładać do niego 
znaczenia i wartości.

W jaki sposób mózg przetwarza doświadczenia

Organiczny

Behawioralny

Odwzorowawczy

Rysunek 4.2. Projekt aplikacji odbieramy na trzech różnych poziomach

Emocje to znacznie głębszy temat, nie możemy jednak poświęcić mu więcej miejsca. 
Zrozumienie podstawowych poziomów projektowania pomoże nam jednak zrozumieć, 
dlaczego opowieści mają tak wielką siłę. Zastanów się na przykład, w jaki sposób 
poszczególne poziomy wpływają na siebie nawzajem w parku rozrywki: ludzie płacą za 
to, żeby ich straszyć. Na poziomie organicznym boimy się wysokości i niebezpieczeństwa. 

background image

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

41

Na poziomie behawioralnym mamy zaufanie do tego, że przejażdżka będzie bezpieczna, 
a na poziomie odwzorowawczym oczekujemy, że osiągniemy satysfakcję dzięki poczuciu 
spełnienia (pokonania strachu) po jej zakończeniu.

Wiedząc, jak wielki wpływ emocje mają na to, w jaki sposób rozumujemy, przekonasz 
się, że tworzenie bogatego funkcjonalnie i użytecznego wrażenia jest nie mniej ważne 
od stworzenia połączenia z użytkownikiem na poziomie psychologicznym.

PODSTAWY WYKORZYSTANIA OPOWIEŚCI
DO UDOSKONALANIA USER EXPERIENCE

Na poziomie podstawowym opowieści i user experience mają wspólne elementy: 
planowanie, badania i tworzenie treści, które mogą być wykorzystane do zbudowania 
satysfakcjonującego user experience. Opowieści pozwalają zespołowi w pełni zrozumieć 
produkt, który kreuje, oraz grupę docelową, dla której to robi.

Opowieści pozwalają przekazać użytkownikom nawet najbardziej skomplikowane idee. 
Produkt lub doświadczenie skonstruowane w taki sposób są wzbogacone o znaczenia 
i emocje. Profesjonaliści, którzy potrafi ą wykorzystywać siłę narracji w swoich projektach, 
robią to na różne sposoby. Kolejne punkty rozdziału opisują wybrane zastosowania 
opowieści i korzyści, jakie mogą one przynieść.

SCALANIE ZESPOŁÓW

Profesjonaliści z dziedziny user experience często pracują z ludźmi wielu specjalności. 
W zależności od rodzaju projekt może wymagać różnych umiejętności, od inżynierów 
po projektantów interfejsu użytkownika. Przy projektowaniu stron WWW i aplikacji 
punktem wyjścia jest najczęściej technologia albo jej ograniczenia. Sprawy komplikują 
się jeszcze bardziej, gdy członkowie większych zespołów instynktownie skupiają się na 
swoich dziedzinach, na przykład marketingowiec będzie skupiał się na swoich zadaniach 
i opracowywał strategie w oparciu o własne doświadczenie.

Zespół user experience wybrany do stworzenia przeznaczonej dla szerokich mas aplikacji 
na platformę iPhone będzie prawdopodobnie składał się z innych osób niż zespół, którego 
zadaniem jest opracowanie aplikacji dla lekarzy. Jak wspomnieliśmy, eksperci z zakresu 
budowania opowieści wiedzą, w jaki sposób wykorzystać techniki komunikacji znane 
od tysiącleci. Używając technik opowiadania historii, zespoły user experience mogą dodać 
do produktu wartość emocjonalną.

background image

ROZDZIAŁ 4

42

ORIENTACJA NA UŻYTKOWNIKA

Słysząc pierwszy raz o podejściu opartym na opowieściach, można pomyśleć, że to po prostu 
inny sposób defi niowania „strategii”. Ale opowieści dają większe możliwości niż orientacja 
na użytkownika. Podobne metody w swoim procesie projektowym wykorzystywały fi rmy, 
na przykład Apple, które chciały zdefi niować prawdziwą wizję tworzonego produktu.

Cindy Chastain nazywa to podejście motywem doświadczenia (ang. experience theme). 
Jej zdaniem ten motyw polega na oferowaniu „fundamentalnej wartości doświadczenia”. 
Christian Saylor nazywa to „szukaniem głównej postaci”. Jego zdaniem bez elementu 
orientacji na użytkownika po prostu „projektujemy dla samego projektowania”.

Dzięki skupieniu na motywie lub postaci pozornie wzajemnie niezwiązane elementy 
doświadczenia łączą się w spójny cel. Dzięki opowieściom zespół tworzący stronę lub 
aplikację, mimo że złożony z różnorodnych osobowości, jest w stanie wspólnymi siłami 
połączyć elementy i stworzyć coś, co będzie kreować znaczące doświadczenie, całość, 
która jest czymś więcej niż jedynie sumą części.

Rysunek 4.3. Różne umiejętności i elementy wykorzystywane do budowania spójnej opowieści

Projekt wizualny

Dział projektowania

kreatywnego

Przykład rozproszonych elementów doświadczenia użytkownika internetu

Marketing

Informacja/zawartość

Nawigacja

Układ/prezentacja zawartości

Interakcje/odpowiedź systemu

Procesy

Animacje

Muzyka/dźwięki

Komunikaty o błędach

Pomoc

Dział biznesowy

Zasoby

zewnętrzne

Marketing

Inżynieria

Architektura informacji/

projekt interakcji

Asystent

produktu

background image

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

43

DEFINIOWANIE UŻYTKOWNIKA

Na temat użyteczności i funkcji stron oraz aplikacji WWW trwa nieprzerwanie wiele 
dyskusji. Funkcje są oczywiście ważne. Na przykład: na co zda się samolot, jeśli jego 
silniki są za słabe, żeby był w stanie wzbić się w powietrze? Jeśli jednak zrobisz krok do 
tyłu, nasuwa się kolejne pytanie: jak daleko będą musieli podróżować pasażerowie? Jeśli to 
tylko kilka kilometrów, pytanie o silnik samolotu jest zupełnie nieadekwatne do problemu. 
Właśnie dlatego przy budowaniu user experience kluczową kwestią jest identyfi kacja 
problemu.

Po zakończeniu badań z reguły następnym etapem jest defi niowanie osobowości (ang. personas), 
które będą narzędziem potrzebnym do zrozumienia użytkownika. Ten etap można uznać za 
część budowania opowieści. Poprzez budowanie wymyślonej reprezentacji użytkownika 
w oparciu o rzeczywiste badania i obserwacje jesteśmy w stanie stworzyć z nim więź 
i w pełni zrozumieć jego potrzeby. Tworząc opowieści wokół tych osobowości, możemy 
natomiast wykreować bardziej wiarygodną wizję projektu.

Opowieści pozwalają nam przełożyć wyniki badań na anegdoty, ułatwiając ludziom 
zrozumienie i zapamiętanie znaczenia koncepcji. Dodatkowo dzięki więzi z użytkownikiem, 
nawiązanej za pomocą opowieści, możemy lepiej zrozumieć emocjonalną stronę jego 
wrażenia. Filmy i gry wideo dostarczają tego typu wrażeń, które oddziałują na użytkownika 
na poziomie emocjonalnym. Użytkownicy zaczynają oczekiwać podobnych wrażeń od 
aplikacji i stron WWW, które odwiedzają każdego dnia.

Możemy zatem przenieść naszą uwagę z tworzenia prostych, zorientowanych na realizację 
zadań stron i aplikacji WWW i skupić się na kultywowaniu wartościowych więzi 
międzyludzkich. Siedzimy w końcu wszyscy przy „globalnym ognisku”, jak tę sytuację 
określa Curt Cloninger (http://www.alistapart.com/articles/storytelling/). Stwierdza on 
między innymi: „Sieć WWW nie jest globalną siecią wzajemnie połączonych komputerów. 
Jest globalną siecią połączonych ludzi. A opowieści nadal są najbardziej efektywnym 
sposobem wywierania emocjonalnego wpływu na ludzi”.

ZALETY

Większość projektów posiada sporą ilość dokumentacji defi niującej ich cele i strategie. 
Ta dokumentacja występuje w postaci list wymagań biznesowych, specyfi kacji funkcjonalnej 
oraz dokumentacji badawczych czy informacyjnych. Opowieści mogą wpłynąć na 
udoskonalenie produktu (user experience) dzięki swoim następującym właściwościom:



nadanie suchym danym „ludzkiej twarzy”;





uproszczenie skomplikowanych koncepcji na potrzeby zespołu projektowego;





zwiększenie efektywności współpracy w zespole;

background image

ROZDZIAŁ 4

44





jasna defi nicja celu;





lepsze zrozumienie najważniejszej grupy użytkowników;



szybsze nakreślenie kierunku rozwoju projektu;



uproszczenie komunikacji z większymi organizacjami;



dostarczenie użytkownikowi znaczenia i wartości.

Opowieści umożliwiają członkom zespołu skupienie się na wszystkich aspektach projektu: 
od treści strony WWW po nowy sposób pojmowania problemów biznesowych. Możesz na 
przykład szybko zdefi niować zakres projektu bez konieczności tworzenia szablonów i makiet 
ekranów. Zespół user experience projektu Yahoo! Personals stworzył opowieść o fi kcyjnej 
parze romansującej przez internet, którą przedstawiono w kilku scenariuszach. Dzięki tej 
opowieści zespół mógł lepiej zrozumieć cel strony WWW i rodzaj wrażeń użytkownika, jakich 
miała dostarczać. Lista punktów defi niująca zadania i strategię przeistoczyła się w bardziej 
autentyczne, emocjonalne wrażenie romansowania. Ten sposób okazał się niezwykle 
skuteczny, dzięki niemu zespół był w stanie odnieść się bezpośrednio do doświadczenia 
bez konieczności tworzenia dokumentacji technicznej, która miałaby je defi niować.

„I ŻYLI DŁUGO I SZCZĘŚLIWIE” 
A RZECZYWISTOŚĆ

Istnieje wiele opinii na temat tego, w jaki sposób budować user experience. Wiele z nich 
opiera się na regułach opracowanych przez Alana Coopera, pioniera w dziedzinie 
budowania oprogramowania w oparciu o user experience (http://www.cooper.com/). 
Jednak wraz z rozwojem technologii rozwijają się również metody i procesy używane do 
tworzenia rozwiązań realizujących potrzeby ludzi. Liczba metod budowania user experience 
jest zbliżona do liczby narzędzi (ang. frameworków) do tworzenia oprogramowania. Z reguły 
chodzi po prostu o wybór najlepszego narzędzia do typu projektu, z jakim ma najczęściej 
do czynienia dany zespół.

Umiejętność realizacji wybranego projektu najczęściej zależy od wielu czynników, jak czas, 
budżet czy postawione cele. W rzeczywistości realizacja 100% założeń każdego z procesów 
z reguły rzadko jest możliwa.

Opowieści to też możliwość szybkiego zespolenia i lepszego zrozumienia wewnątrz zespołu. 
Doświadczenia, które tworzymy, nabierają kształtu dzięki projektowi grafi cznemu, treści 
i interakcji z użytkownikiem. Gawędziarze komunikowali się skutecznie na długo przed 
pojawieniem się stron WWW, co dowodzi, że warto traktować opowieści jako wartościowe 
narzędzie wspomagania biznesowej sfery projektu.

background image

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

45

KILKU GAWĘDZIARZY ERY INTERNETU

Pomysł wykorzystania opowieści w procesie defi niowania user experience jest stosunkowo 
nowy, ale kilku profesjonalistów zdążyło już dorobić się doświadczenia w tym zakresie. 
Przeprowadziłem rozmowy z kilkoma z tych gawędziarzy ery internetu, chcąc dowiedzieć się, 
w jaki sposób stosują opowieści w swojej pracy.

DORELLE RABINOWITZ

Dorelle jest gawędziarką, która projektuje, ilustruje i snuje opowieści z wykorzystaniem 
różnych mediów i kontekstów.

Pytanie: Jaki jest twój sposób na wykorzystanie opowieści w UX?

Dorelle: Opowieści postrzegam jako jedno z narzędzi, które mogę wykorzystać 
w charakterze katalizatora komunikacji w pracy nad projektem. Dla mnie jako projektanta 
najważniejsze jest nadanie ludzkiej twarzy procesowi projektowania, doprowadzenie do 
zbliżenia ludzi. Dzięki opowieści projektanci, inżynierowie, menedżerowie produktu, 
stratedzy i członkowie zarządów mogą nadawać na tych samych falach i to doświadczenie 
potrafi  być niezwykle satysfakcjonujące. Jest to forma bardzo emocjonalnego połączenia 
członków zespołu jako ludzi.

Rysunek 4.4. Dorelle Rabinowitz (http://www.slideshare.net/dorelvis/storytelling-a-compelling-design-tool)

background image

ROZDZIAŁ 4

46

Kiedyś pracowałam nad stroną fi rmy medialnej Oxygen nazwaną „Our Stories” 
(nasze opowieści), na której wspólnie z użytkownikami budowaliśmy opowieści online. 
Nazywaliśmy to „współkreacją” (ang. co-creation), a gdy w pracy skupiłam się bardziej na 
projektach grafi cznych, zdałam sobie sprawę, że opowieści pozwalają mi lepiej zrozumieć 
użytkowników. Wraz z nabieraniem doświadczenia zdałam sobie sprawę, że opowieści 
usprawniają komunikację, że ludzie reagują na nie w sposób emocjonalny, nawiązują z nimi 
więzi i wymieniają się nimi. Im więcej opowieści wykorzystywałam w swojej pracy, tym 
lepsze uzyskiwałam efekty.

Tak wiele naszej pracy polega nie tylko na projektowaniu wyglądu strony, ale raczej na 
kontaktach z ludźmi, negocjowaniu i planowaniu. Opowieści mogą być pomocne w tych 
wszystkich sytuacjach, mogą też przyspieszyć proces znajdowania rozwiązań problemów. 
Uważam, że wartość opowieści jest niezależna od typu doświadczenia, w jakim są użyte.

Pytanie: W końcowym rozrachunku priorytet zawsze mają względy biznesowe 
(czyli zysk). W jaki sposób opowieści radzą sobie w takim kontekście?

Dorelle: Opowieści pomagają lepiej zrozumieć, dlatego pozwalają różnym członkom 
zespołu mówić wspólnym językiem, co prowadzi do oczekiwanych wyników. Pomagają też 
ludziom współpracować w sposób bardziej skuteczny, dzięki czemu projekty są realizowane 
sprawniej, a produkt szybciej trafi a na rynek. Opowieści są w stanie przedefi niować 
problemy biznesowe, dzięki czemu projekty mogą skupić się na właściwych problemach 
i znajdowaniu lepszych rozwiązań.

Pytanie: Gdzie możemy dowiedzieć się więcej na ten temat?

Dorelle: Polecam doskonały artykuł Cindy Chastain w Boxes and Arrows, pod tytułem 
Experience Th

  emes (http://www.boxesandarrows.com/view/experience-themes).

CURT CLONINGER

Curt jest artystą i pisarzem. Mówi, że jego sztuka nie polega na tworzeniu standardowej 
opowieści z punktem zwrotnym i rozwiązaniem, a raczej na kreowaniu czegoś na kształt 
wydarzenia.

Pytanie: Jaki jest twój sposób na wykorzystanie opowieści w UX?

Curt: Projektowanie, a w szczególności projektowanie grafi czne, można rozumieć jako 
formę komunikacji, a opowieści są historycznie sprawdzoną formą komunikacji. Opowieści 
lub projekty narracyjne są czymś, co warto mieć na uwadze, zabierając się za projektowanie 
user experience.

background image

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

47

Dla mnie projektowanie narratywne oznacza przede wszystkim zachowanie spójnego 
„głosu”: każdy element projektu musi prowadzić do tego samego celu lub konkluzji. 
To oznacza również, że w dziedzinie user experience wykorzystuję element fabuły. Także 
sam użytkownik powinien mieć możliwość samodzielnego wypowiedzenia się w celu 
dopełnienia swojego doświadczenia.

Na tym polega różnica między powieścią (w przypadku której użytkownik wypełnia 
w wyobraźni luki w zakresie sfery wizualnej) a fi lmem hollywoodzkim (gdzie te luki są 
już wypełnione, czym wyręcza się użytkownika). Czytanie powieści jest, moim zdaniem, 
bardziej angażujące.

Rysunek 4.5. Curt Cloninger (http://www.lab404.com/dreams/library.html#text)

Pytanie: W końcowym rozrachunku priorytet zawsze mają względy biznesowe 
(czyli zysk). W jaki sposób opowieści radzą sobie w takim kontekście?

Curt: Hollywood opowiada historie i zarabia na tym mnóstwo pieniędzy. Politycy, 
dziennikarze i wielkie korporacje opowiadają historie (inaczej: kłamstwa) i robią na tym 
wielkie pieniądze. Ewolucję każdej marki na świecie można interpretować jako pewnego 
rodzaju narrację.

Korporacje są w stanie zainwestować każde pieniądze, próbując przekonać nas do tego, 
że wykreowane przez nie wizerunki (np. Ronald McDonald) są postaciami pozytywnymi. 
Narracja i kapitalizm od zawsze funkcjonowały w owocnym związku.

background image

ROZDZIAŁ 4

48

Pytanie: Gdzie możemy dowiedzieć się więcej na ten temat?

Curt: Lubię książkę Experience Design Nathana Shedrofa. Dotyczy bardziej projektowania 
user experience, ale w wielu miejscach wykorzystuje elementy narracyjne. Dobra jest też 
Performance Th

  eory Richarda Schechnera. Nie ma ścisłego związku z projektowaniem user 

experience, ale omawia takie zagadnienia, jak teatr, rytuały plemienne i interfejsy kulturowe, 
jakie ludzie budują w celu nadania znaczenia swoim światom.

CHRISTIAN SAYLOR

Christian jest gawędziarzem, który projektuje user experience. Wierzy, że przedmioty nas 
otaczające mają do opowiedzenia bardzo istotne historie.

Rysunek 4.6. Christian Saylor (http://www.undertheinfl uenceofdesign.com/2009/06/19/the-art-of-storytelling/)

Pytanie: Jaki jest twój sposób na wykorzystanie opowieści w UX?

Christian: Opowieści dają nam cel i poczucie miejsca. Z tego powodu wykorzystanie 
opowieści nie jest wielkim „odkryciem”, a jedynie naturalnym etapem w udoskonalaniu 
doświadczeń użytkownika, które są ukryte głęboko w opowieści czekającej, aż ktoś ją opowie.

Pomysł wykorzystania opowieści do odkrywania bogatych wrażeń z myślą o użytkowniku 
końcowym (kimkolwiek by on nie był) po prostu ma głęboki sens.

background image

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

49

W efekcie praca projektanta user experience sprowadza się do opowiedzenia historii, która 
jest odpowiednia do danej sytuacji i posiada właściwe znaczenie, niezależnie od czasu, 
urządzenia, a nawet lokalizacji. Do pełnego zrozumienia użytkownika docelowego oraz 
jego celów i pragnień wykorzystujemy „osobowości” (ang. personas) i „scenariusze” (ang. 
scenarios), czyli elementy narracyjne opowiadające historie o osobowościach. Te narzędzia 
pomagają zdefi niować user experience, które będą miały dla niego znaczenie.

Głęboko wierzę w to, że każde zjawisko posiada związaną ze sobą historię. Każdy biznes, 
grupa społeczna, koncepcja, metodologia czy związek aż rwą się do tego, żeby znaleźć lepszy 
sposób związania się z odbiorcą.

Niektóre fi rmy wykorzystują tego typu techniki na szeroką skalę (Apple), inne po cichu 
utrwalają swoją ścieżkę życiową, którą podążają, aż znikną (pilot zdalnego sterowania).
Od opakowania, które widzimy na wystawie sklepu, po aplikacje towarzyszące nam każdego 
dnia różnego rodzaju opowieści mają niezwykły wpływ na każdy aspekt naszego życia. 
Historia jest wokół nas. Daje nam poczucie zrozumienia i wiedzy na temat istotnych dla nas 
ludzi i zjawisk.

Uważam, że najważniejszą dla mnie cechą opowieści jest możliwość wpływu na sposób 
postrzegania świata i interakcji z nim.

Pytanie: W końcowym rozrachunku priorytet zawsze mają względy biznesowe 
(czyli zysk). W jaki sposób opowieści radzą sobie w takim kontekście?

Christian: Jeśli opowiesz bogatą historię niewłaściwemu odbiorcy, a nawet opowiesz 
bogatą historię w niewłaściwy sposób, twój biznes i produkt prędzej czy później odejdą 
w zapomnienie. Projekt i technologia są katalizatorami zmian w „ekonomii doświadczeń”. 
Jeśli zatem nie będziemy poszukiwać wciąż lepszych sposobów opowiadania naszych 
historii, żywot naszego biznesu, produktu lub usługi będzie zagrożony.

Jak wiemy wszyscy, świat biznesu stale poszukuje złotego środka. Żyjemy w świecie 
przesyconym produktami i usługami, które proszą się o naszą uwagę, a doświadczenie, 
sposób, w jaki rozwija się opowieść, będzie właśnie stanowić tę różnicę, która zaważy na 
sukcesie lub porażce fi rm.

Pytanie: Gdzie możemy dowiedzieć się więcej na ten temat?

Christian: Lovemarks (the future beyond brands) autorstwa Saatchi & Saatchi (www.lovemarks.
com
). To
 niesamowicie głęboka analiza zjawiska stopniowego pogłębiania miłości klientów do 
fi rm i ich produktów.

background image

ROZDZIAŁ 4

50

CINDY CHASTAIN

Cindy jest fi lmowcem i scenarzystką, która tworzy fi lmy i pisze scenariusze oraz uważa 
siebie za wizualną i dramatyczną gawędziarkę.

Pytanie: Jaki jest twój sposób na wykorzystanie opowieści w UX?

Cindy: Opowieści są jeszcze jednym narzędziem, które można wykorzystać w kontekście 
projektowania w charakterze: 1) urządzenia, 2) ramy (ang. framework) i (lub) 3) płótna, 
na którym będziemy rysować. Innymi słowy, historię możemy wykorzystać do schwytania 
i sprzedaży pomysłu, możemy jej użyć jako sposobu do zdefi niowania granic projektu, 
produktu lub usługi, możemy wreszcie wykorzystać techniki narracyjne do naszkicowania 
interakcji, a w konsekwencji różnych behawioralnych i emocjonalnych reakcji na opowieść.

Opowieści wykorzystujemy do poszukiwania porządku w chaosie, dostarczania znaczeń 
i emocjonalnego zaangażowania odbiorców. Projektujemy doświadczenia, które będą 
realizować te same zadania (mamy taką nadzieję). Ale w kontekście projektowania znaczenie 
defi niuje też, co to doświadczenie, produkt czy usługa mogą dać użytkownikowi. W jaki 
sposób może on udoskonalić swoje życie. Chodzi o to, żeby zrozumieć, w jaki sposób to 
coś ma działać.

Jako projektanci dobrze radzimy sobie z dialogiem między ludźmi i interaktywnymi 
produktami, których używają. Często jednak rezygnujemy z kreowania nienamacalnej 
warstwy doświadczenia — opowieści, które ewoluują w ramach interakcji użytkownika 
z tworzonymi przez nas produktami.

Nie mamy też odpowiedniego podejścia do projektowania bardziej całościowego. Jeśli 
nauczymy się projektować na zasadach zbliżonych do tych, które stosują powieściopisarze, 
będziemy w stanie nie tylko tworzyć bogatsze doświadczenia, ale też wypracujemy sobie 
pewne zasady pracy, które pomogą ocenić, kiedy i jakie techniki narracyjne mogą być użyte 
do zaangażowania umysłów, emocji i wyobraźni użytkowników. Zasady te pomogą nam 
tworzyć lepsze opowieści, a te z kolei przekształcą martwe funkcje w żywe doświadczenia, 
które będą w stanie wpłynąć na umysły i emocje użytkowników.

Pytanie: W końcowym rozrachunku priorytet zawsze mają względy biznesowe 
(czyli zysk). W jaki sposób opowieści radzą sobie w takim kontekście?

Cindy: Przekaz marki już nie wystarcza do napędzenia sprzedaży, taką moc ma 
doświadczenie. Jeśli ulotna przyjemność, emocja lub znaczenie mogą zostać przekształcone 
w trwałą wartość dzięki zastosowaniu opowieści i technik narracyjnych, zbudujemy bardziej 
atrakcyjne dla klienta doświadczenie produktu. A jeśli to doświadczenie będzie rzeczywiście 
bardziej atrakcyjne, biznes osiągnie zyski dzięki rzeszom lojalnych klientów, świadomych 
wartości doświadczenia.

background image

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

51

Bez zrozumienia tego decyzje dotyczące cech i funkcji produktu oraz jego zachowania 
będą pozbawione polotu i spójności. Oczywiście do pomocy mamy cele biznesowe, analizy 
potrzeb użytkowników, reguły projektowe i praktyki rynkowe, ale te narzędzia nie są 
w stanie dać zespołowi projektowemu jednolitej koncepcyjnej płaszczyzny współpracy, nie 
mówiąc już o emocjach i znaczeniach.

Pytanie: Gdzie możemy dowiedzieć się więcej na ten temat?

Cindy: Zacznij od samej dyscypliny, czyli książki Story Roberta McKee, dotyczącej pisania 
scenariuszy. Do zapoznania się z teorią polecam Narration in the Fiction Film Davida 
Bordwella oraz klasyczną pozycję Computers as Th

  eatre Brendy Laurel. A na temat snucia 

opowieści najlepiej zasięgnij informacji z pierwszej ręki: przeczytaj Th

  e Poetics Arystotelesa.

DOŚWIADCZENIA OPARTE 
NA OPOWIEŚCIACH WOKÓŁ NAS

Można wymienić sporą liczbę doświadczeń, do których wykreowania zostały zastosowane 
opowieści, tworząc interesujące przekazy przyciągające użytkowników. Te opowieści nie 
zawsze są widoczne lub oczywiste na pierwszy rzut oka. Jednak w głębi wielu dobrze 
wykreowanych doświadczeń znajdziemy doskonałą opowieść. Może się ona ujawniać 
w interakcjach łączących się w większe historie albo po prostu w połączeniu emocjonalnym, 
które nawiązujemy z produktem lub marką.

OPAKOWANIE: APPLE

Jedną z fi rm, które doskonale potrafi ą dostarczyć skuteczną historię, jest Apple. Zakup 
produktu tej fi rmy i otwieranie wielu warstw pięknego opakowania to doświadczenie, 
które opiera się na typowych elementach fabuły budującej oczekiwanie.

Podczas tego procesu znajdziesz ciekawe fotografi e i mądre teksty. Te elementy budują 
pewien rodzaj napięcia, które jest rozładowywane w momencie wyjęcia z pudełka nowego 
iPhone’a. Częściej stosowana strategia, o odwrotnym działaniu z punktu widzenia atmosfery, 
polegałaby na zapakowaniu iPhone’a w folię bąbelkową, co zredukowałoby opowieść do 
przekazu: „Kup mnie”.

MARKETING: PERFUMY SIX SCENTS

Seria perfum Th

  e Six Scents (http://www.six-scents.com/) jest tworzona w rocznym cyklu, 

a pomysł polega na powiązaniu sześciu znanych artystów z sześcioma znanymi twórcami 
perfum. Celem tego projektu jest zwiększenie zainteresowania celami charytatywnymi. 
W drugiej serii butelka perfum jest dostarczana wraz z płytą DVD zawierającą fi lm wideo 
i fotografi e. Film i zdjęcia tworzą historię z unikalnym klimatem wokół każdego z zapachów.

background image

ROZDZIAŁ 4

52

ARCHITEKTURA: SKLEP HBO

Sklep HBO (ulokowany w środkowym Manhattanie) został zaprojektowany z opowieścią 
w efektowny sposób wbudowaną w spektakularne wrażenia klientów. Architektura 
i technologia udostępniają przestrzeń, która stała się nowym sposobem prezentowania 
materiałów i gadżetów z fi lmów związanych z produkcjami fi rmy HBO. Celem sklepu 
(zaprojektowanego po części przez studio Imaginary Forces) było stworzenie inteligentnego 
i niezapomnianego user experience.

Rysunek 4.7. Perfumy Six Scents

Rysunek 4.8. HBO Store. ©2010 Home Box Offi  ce, Inc.

background image

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

53

DANE: TAXI 07: ROADS FORWARD

W swoim komentarzu na temat opowieści Dorelle Rabinowitz pokazała, w jaki sposób mogą 
one być użyte do komunikowania na temat danych, które same w sobie nie są ciekawym 
tematem, tak aby przedstawić je w formie bardziej dostępnego doświadczenia. Jednym 
z przykładów z życia jest Taxi 07: Roads Forward (http://www.designtrust.org/publications/
publication_07roadsfwd.html
). Do
kument ten jest raportem stworzonym na potrzeby New 
York City Taxi & Limousine Commission, dotyczącym stanu przemysłu taksówkowego 
w Nowym Jorku. Informacje zostały przedstawione za pomocą historii w formie komiksu 
i pięknych infografi k.

KONIEC JEST POCZĄTKIEM TEJ OPOWIEŚCI

Wielu zagadnień związanych z opowieściami nie mogliśmy poruszyć w tym artykule. 
Przedstawione tu informacje stanowią punkt wyjścia do pogłębienia tematu. Zakończenie 
tej opowieści nie zostało jeszcze napisane. To zaledwie początek nowej ery wykorzystania 
opowieści.

Francisco Inchauste jest projektantem UX, którego pasją jest pisanie. Więcej informacji na 
temat jego przygód w świecie projektowania i user experience znajdziesz na jego blogu Finch 
(http://www.getfi nch.com/).

Rysunek 4.9. Taxi Road

©2009 The Design Trust for Public Space

background image
background image

R

O

ZDZIAŁ

 5

5

PROJEKTOWANIE 

INTERFEJSU 

UŻYTKOWNIKA 

NA POTRZEBY 

BIZNESOWYCH 

APLIKACJI WWW

Janko Jovanovic

PROJEKTOWANIE WYGLĄDU BIZNESOWYCH APLIKACJI WWW

 jest zagadnieniem zbyt 

często lekceważonym. Często spotykam się z aplikacjami, które nie spełniają wymagań ich 
biznesów lub użytkowników, przez co przyczyniają się do utraty dochodów i kiepskiego 
user experience. Zdarza się również, że projektanci interfejsu użytkownika w ogóle nie 
są angażowani w proces tworzenia tego typu aplikacji, co skutkuje pozostawieniem całej 
odpowiedzialności na barkach programistów.

Dla programistów jest to bardzo trudne zadanie. Mimo że mogą oni posiadać duże 
doświadczenie w pisaniu kodu strony serwerowej (back-end) i klienckiej (front-end), z reguły 
mają bardzo ograniczoną wiedzę na temat projektowania. W efekcie sytuacja ta przyczynia się 
do mniejszej satysfakcji klientów, frustracji użytkowników i porażek projektów.

Ten rozdział omawia podstawowe zagadnienia projektowania interfejsów użytkownika 
aplikacji WWW dla biznesów. Przy tej okazji można zastosować wiele uniwersalnych podejść, 
technik i zasad projektowania interfejsu użytkownika, ale my skupimy się na tych z nich, 
które dotyczą specyfi cznych zagadnień aplikacji WWW.

background image

ROZDZIAŁ 5

56

SERWISY A APLIKACJE WWW

Łatwo jest pomylić aplikację WWW z serwisem WWW, tak samo jak proces projektowania 
interfejsu z projektowaniem wyglądu. Ale zagadnienia te znacząco się różnią, zarówno 
z punktu widzenia istoty problemu, jak i pod wieloma innymi względami.

Serwis WWW jest kolekcją stron i składa się głównie z treści, obrazów i wideo 
z ograniczonymi możliwościami interakcji (to znaczy, w serwisie WWW mogą występować 
elementy interakcji, ale w ustalonych z góry miejscach, jak formularz kontaktowy czy pole 
wyszukiwania). Podstawowa funkcja serwisu WWW polega na informowaniu. Niektóre 
serwisy WWW do zarządzania i wyświetlania treści wykorzystują system kontroli treści 
(ang. content management system), który z natury jest aplikacją, ale nawet w takich 
przypadkach funkcja serwisów WWW nadal jest ściśle informacyjna.

Z drugiej strony, aplikacje WWW są dynamicznymi, interaktywnymi systemami, których 
zadanie polega na wspomaganiu krytycznych procesów biznesowych i zwiększeniu ich 
produktywności. Zatem główna rola aplikacji WWW polega na realizowaniu funkcji, która 
służy potrzebom użytkownika, zgodnie ze zdefi niowanymi regułami biznesowymi.

Aplikacje WWW wymagają od użytkowników większego poziomu zaangażowania i wiedzy 
na temat systemu. Nie można oczekiwać, że użytkownicy po prostu natkną się na aplikację, 
wykonają swoją pracę, a potem pójdą swoją drogą. Użytkownicy używają aplikacji WWW 
jako narzędzia do realizacji krytycznych zadań w swojej codziennej pracy. W efekcie nie 
mogą po prostu przestać z niej korzystać i zdecydować się na inną, jeśli nie podoba im się 
sposób, w jaki ona funkcjonuje. W przypadku serwisów WWW tego typu zachowanie jest 
natomiast zupełnie normalne.

RÓŻNE TYPY APLIKACJI WWW

Aplikacje biznesowe występują w różnych typach, od systemów fakturowania dla 
freelancerów, przez systemy kontroli treści, systemy zarządzania dokumentami, po systemy 
bankowe i fi nansowe.

Rozróżniamy również systemy otwarte i zamknięte. Systemy otwarte to takie, do których 
dostęp może mieć każdy, kto zechce założyć w nich konto. Użytkownicy mają dostęp do 
tego typu systemów za pośrednictwem typowej przeglądarki WWW i mogą założyć konto 
za darmo lub za opłatą.

Systemy zamknięte (lub aplikacje biznesowe, ang. line-of-business application) z reguły 
nie są dostępne poza siecią fi rmową. Są one określane jako „aplikacje offl

  ine” (ponieważ 

nie działają w internecie, choć istnieją przypadki, gdy tego typu systemy są udostępniane 
partnerom biznesowym fi rmy za pośrednictwem innych usług lub specjalizowanych 
interfejsów). Systemy tego typu najczęściej działają w sieci lokalnej fi rmy i są dostępne tylko 
dla pracowników.

background image

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

57

Nie wiem, kto wymyślił ten termin, ale osobiście lubię aplikacje WWW nazywać 
weblikacjami, co stanowi doskonałe określenie wszelkiego rodzaju aplikacji WWW. 
Nie oznacza to jednak, że aplikacje WWW są jakimiś hybrydami: w połowie serwisami 
WWW, w połowie aplikacjami. To nie jest takie proste.

POZNAJ SWOICH UŻYTKOWNIKÓW

Z pewnością słyszałeś tę poradę tysiące razy i jest tego doskonały powód. Skuteczny interfejs 
użytkownika skupia swoją uwagę na użytkowniku i jego zadaniach. To kluczowe założenie 
i zbyt wielu twórców interfejsu użytkownika o tym zapomina, tworząc kiepskie user 
experience. Steve Krug stwierdził: „Programiści lubią komplikować, uwielbiają poznawać, 
jak coś działa”.

Gdy identyfi kujesz użytkowników, pamiętaj, że Twoi klienci nie są użytkownikami aplikacji 
i że Ty również nim nie jesteś. Zespół zarządzający projektem od strony klienta z pewnością 
będzie zainteresowany wpłynięciem na jego kształt i będzie starał się wpływać na decyzje, 
pamiętaj jednak, że to nie jego członkowie będą siedzieć przed komputerem kilka godzin 
dziennie (chyba że tworzona aplikacja jest przeznaczona właśnie dla nich).

JAK ZIDENTYFIKOWAĆ UŻYTKOWNIKÓW

Identyfi kacja użytkowników może być realizowana z użyciem kilku technik, jak wywiady 
z użytkownikami, z dostawcami usług czy metody obserwacji „techniką cienia” (ang. 
shadowing). Wywiady dostarczają odpowiedzi na temat wiedzy użytkowników o systemie 
i komputerach, a obserwacja pozwala uzyskać szczegółowe informacje na temat sposobów, 
w jakie użytkownicy realizują zadania, oraz błędów, jakie popełniają. Metodę tę określa się 
„techniką cienia”, ponieważ użytkownik nie jest świadomy obserwatora (który jest w tym 
przypadku właśnie jego „cieniem”).

Jeśli nie masz dostępu do rzeczywistych użytkowników (ponieważ po prostu go nie masz 
albo masz za zadanie zaprojektować aplikację ogólnego przeznaczenia), możesz wykorzystać 
osobowości (ang. personas). Osobowości są reprezentacją żywych użytkowników, 
ich zwyczajów, celów i motywacji. Niektóre informacje na temat użytkowników są 
identyfi kowane przez analizę biznesową, dlatego można ją wykorzystać właśnie do 
zbudowania osobowości. Jeśli nie spotkałeś się z tym narzędziem, w jego zrozumieniu 
pomoże Ci komiks Brada Colbowa (http://thinkvitamin.com/design/how-to-under-stand-
your-users-with-personas/
).

background image

ROZDZIAŁ 5

58

Analiza zadań pomaga identyfi kować zadania, jakie użytkownicy realizują w swojej pracy, 
w jaki sposób to robią, jak dużo czasu to zajmuje i jakie popełniają błędy. Czasem klienci 
używają starszej wersji aplikacji w czasie, gdy Ty projektujesz nową. Wykorzystaj ten stary 
system i obserwuj użytkowników przy pracy. Zrozum ich zadania, a wyzwania projektowe 
staną się łatwiejsze do pokonania.

Niezależnie od tego, kim są użytkownicy, w większości przypadków musimy wziąć pod 
uwagę nowicjuszy i ekspertów. Nowicjusze powinni mieć możliwość jak najszybszej nauki 
funkcji aplikacji, eksperci powinni mieć szansę realizacji swoich zadań w jak najbardziej 
efektywny sposób. To może oznaczać nawet konieczność stworzenia dwóch osobnych 
interfejsów użytkownika. Jednak w wielu przypadkach istnieje możliwość obsłużenia 
obydwu typów użytkowników za pomocą tego samego interfejsu użytkownika — 
wystarczy zastosować odpowiednie techniki, jak na przykład stopniowe ujawnianie funkcji 
(ang. progressive disclosure).

Tego typu badania są z reguły prowadzone przez analityków biznesowych. Jeśli jednak 
nie ma osoby dedykowanej do realizacji tego typu zadań, musisz zrobić to sam. 
Gdy zdobędziesz niezbędne informacje, możesz zacząć projektować aplikację.

PROCES PROJEKTOWANIA

W projektowaniu interfejsu użytkownika możesz zastosować jeden z dostępnych procesów. 
Możliwe też, że masz już wypracowany własny proces. Niezależnie od tego, proponuję, 
abyś rozważył zastosowanie tzw. metodologii zwinnej (ang. agile). Dlaczego? Ponieważ dla 
użytkowników (i klientów) to interfejs użytkownika jest produktem. Innymi słowy: nic 
ich nie obchodzą Twoje szkice czy niesamowity silnik albo potężny serwer. Jedyne, co ich 
interesuje, to interfejs użytkownika.

Rysunek 5.1. Osobowość reprezentuje rzeczywistych użytkowników, ich zwyczaje, cele i motywację.

Copyright © 2006 – 2010 Think Vitamin

background image

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

59

W jaki sposób pomaga w tym metodologia zwinna? Dzięki swojemu podstawowemu 
założeniu: iteracyjnemu podejściu. Każda iteracja składa się z wszystkich faz zdefi niowanych 
w procesie. Oznacza to, że na końcu każdej iteracji mamy do dyspozycji skończony produkt 
nadający się do testowania, czyli prototyp.

Test

Szkic

Prototyp

SZKICOWANIE

Szkicowanie to bardzo efektywny sposób obrazowania i pogłębiania idei. Celem 
szkicowania jest szybkie opracowanie rozwiązania dzięki porównaniu uproszczonych 
wyobrażeń różnych koncepcji. Większość szkiców zostaje odrzucona, ale właśnie o to 
chodzi. Bill Buxton w swojej broszurze Sketching User Experiences, Getting the Design 
Right and the Right Design
 stwierdził: „Szkice tworzy się szybko i łatwo jest się ich pozbyć, 
dlatego właśnie mają taką siłę”.

Czy szkice są tym samym co szkielety (ang. wireframe)? Różnica jest dość mglista, 
ale odpowiem, że nie. Szkielety nie mają za zadanie obrazowania ogólnych pomysłów, 
a raczej stanowią budulec w procesie ich materializacji. Więcej szczegółów znajdziesz 
w doskonałej dyskusji na łamach IxDA:

 

Sketching Before the Wireframes (http://www.ixda.

org/node/21817).

Gdy tylko wybierzesz „właściwe” szkice lub przynajmniej takie, które uważasz za właściwe, 
możesz stworzyć bardziej szczegółowe szkielety albo przejść od razu do budowania 
interaktywnych prototypów.

Rysunek 5.2. Iteracyjne podejście w zwinnym procesie projektowania

background image

ROZDZIAŁ 5

60

PROTOTYPOWANIE

Następnym krokiem w procesie jest zbudowanie prototypów symulujących rzeczywistą 
aplikację. Prototyp może dotyczyć jednej lub większej liczby funkcji (a nawet wszystkich), 
ale ich nie realizuje. Po prostu symuluje zachowanie rzeczywistej aplikacji, a użytkownik ma 
jedynie wrażenie, że aplikacja działa. Prototypy mogą realizować niektóre funkcje aplikacji, 
o ile to konieczne do ich działania (np. wykonywanie obliczeń prezentowanych wyników).

Prototypy w HTML-u mają tymczasową naturę — w końcu służą do testowania 
pomysłów. Z tego powodu nie warto martwić się o elegancję kodu, należy jedynie zadbać 
o to, żeby działał z minimalną liczbą błędów. Prototyp w końcu zostanie wyrzucony.
Do prototypowania można też wykorzystać specjalizowane oprogramowanie. Znamy ludzi, 
którzy tworzą prototypy w programie PowerPoint.

TESTOWANIE

Prototypy są bezużyteczne, jeśli nie zostaną przetestowane. To nic skomplikowanego. Jakob 
Nielsen i Steve Krug propagują koncepcję tzw. przecenionych testów użyteczności (ang. 
discount usability testing), które stanowią tani i szybki sposób zdobycia cennych obserwacji 
pomocnych w procesie decyzyjnym na etapie projektowania. Te informacje wykorzystasz 
jako podstawę do następnej iteracji szkicowania, prototypowania i testowania. Ten proces 
jest wykonywany do momentu, gdy z projektu zostaną usunięte wszystkie najważniejsze 
problemy. Zdajemy sobie sprawę, że projekty związane z oprogramowaniem komputerowym 
z reguły borykają się z problemami braku czasu i budżetu, dlatego właśnie — w celu 
uniknięcia dodatkowych kosztów — należy testować wcześnie i często (ang. test early and 
test ofen
).

Jednym z najlepszych źródeł informacji na temat przecenionych testów użyteczności jest 
książka Steve’a Kruga

 

Rocket Surgery Made Easy: Th

  e Do-It-Yourself Guide to Finding and 

Fixing Usability Problems. Przeczytaj ją.

REGUŁY PROJEKTOWANIA

Istnieje wiele reguł projektowania, ale jak do tej pory nie udało się wypracować najlepszej 
ani najważniejszej. Z tego powodu omówimy kilka z nich w sposób nieco nieformalny, 
rezygnując z przytaczania ich defi nicji.

NIKT NIE LUBI NIESPODZIANEK

Prawdopodobnie najbardziej istotnymi cechami dobrego projektu interfejsu użytkownika 
są spójność i rozpoznawalność. Interfejs użytkownika powinien być spójny we wszystkich 
częściach aplikacji, od pasków nawigacyjnych po terminologię. Cechę tę nazywamy 
wewnętrzną spójnością. Ale interfejs użytkownika powinien również być spójny w szerszym 

background image

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

61

kontekście, na przykład w ramach systemu operacyjnego i innych aplikacji w swojej grupie 
lub rodzinie. Typowym przykładem tego typu spójności są aplikacje z rodziny Microsoft  
Offi

  ce. Ten rodzaj spójności nazywamy zewnętrzną.

Dobre podejście do spójności polega na zdefi niowaniu reguł interfejsu użytkownika dla 
każdego projektu lub grupy projektów. Te reguły powinny wpływać na decyzje dotyczące 
wszystkich szczegółów. W ten sposób nie tylko zagwarantujemy zachowanie spójności, 
ale również stworzymy dokumentację, która pomoże członkom zespołu zrozumieć 
podejmowane decyzje.

Spójny interfejs użytkownika charakteryzuje się krótkim czasem niezbędnym na jego 
poznanie, ponieważ użytkownicy muszą poznać jedynie fragment systemu, a jego pozostałe 
części zrozumieją w oparciu o dotychczasowe doświadczenie. Należy jednak uważać na to, 
że ze spójnością często jest mylona znajomość. Znajome interfejsy użytkownika opierają 
się na koncepcjach poznanych w innych doświadczeniach użytkownika, wykorzystując 
do swoich celów odpowiednie metafory. Na przykład foldery, które są doskonale znaną 
metaforą organizacji systemu plików, w pewnym momencie zastąpiły „katalogi”, znane 
wcześniej z tekstowych interfejsów użytkownika. Krótko mówiąc: warto mówić językiem, 
który zna użytkownik.

Wśród właścicieli fi rm funkcjonuje przesąd, że doskonały interfejs użytkownika powinien 
przypominać produkt z rodziny Microsoft  Offi

  ce, w szczególności Outlook. Nie mam 

zamiaru tłumaczyć, jak bardzo błędna jest ta opinia. Zamiast tego zaoferuję poradę: zawsze 
staraj się bronić podejścia zorientowanego na użytkownika, wyjaśnij, dlaczego tak ważne jest 
tworzenie aplikacji dla pracowników, klientów i partnerów (czyli ich klientów).

Należy też pamiętać, że wszystkie biznesy są unikalne, tak samo jak ich procesy biznesowe. 
Na przykład dwa biznesy z tej samej branży mogą mieć zupełnie różne procesy, co zmusza 
nas do innowacji i wyjścia poza ramy tego, co znane. Ta część procesu projektowania może 
być bardzo interesująca, choć należy zachować umiar w zakresie innowacji.

UŻYTKOWNICY POWINNI MIEĆ MOŻLIWOŚĆ 

EFEKTYWNEJ PRACY

Bez wątpienia użytkownicy powinni być efektywni w pracy z aplikacjami biznesowymi. 
Za to pracodawca im płaci i tego oczekują od aplikacji menedżerowie. Interfejsy 
użytkownika powinny pozwalać użytkownikom osiągnąć wysoką efektywność pracy i skupić 
się na realizacji zadań w jak najprostszy i najszybszy sposób.

Jednak nie zawsze tak jest. Wśród programistów istnieje opinia (a raczej: taka zasada jest 
praktykowana), że interfejs użytkownika powinien być tak skomplikowany, jak stojący za 
nim system zaplecza (back-end). Brzmi to dość absurdalnie, ale ten problem jest rzeczywisty 
i może przyprawić o ból głowy. To jeden z powodów, dla których dobra komunikacja między 
członkami projektu jest koniecznością.

background image

ROZDZIAŁ 5

62

Użytkownicy są wydajni, gdy skupiają się na konkretnym zadaniu. Jak wspomnieliśmy, analiza 
zadań pozwala je zidentyfi kować i określić sposoby ich realizacji. Jeśli zadania są rozciągnięte 
w czasie, należy je skrócić przez rozbicie na mniejsze fragmenty. Wydajność można zwiększać 
przez udostępnienie skrótów klawiszowych. Należy pamiętać, jak mało wydajne jest zmuszanie 
użytkownika do przełączania się między klawiaturą a myszką. W niektórych przypadkach 
interfejsy będą wykorzystywane przez użytkowników, którzy są przyzwyczajeni do używania 
interfejsów tekstowych (wiersza poleceń). Szczególnie oni będą oczekiwali wsparcia w postaci 
skrótów klawiszowych. Projektując tego typu wsparcie dla użytkownika, pamiętaj o tym, 
aby skróty klawiszowe były spójne z innymi popularnymi zastosowaniami. Na przykład 
kombinacja klawiszy Ctrl+S powinna zawsze oznaczać Zapisz itp.

Rysunek 5.3. Aplikacja Arkusz kalkulacyjny Google Docs umożliwia użytkownikom 
efektywną pracę dzięki skrótom klawiszowym i menu kontekstowym, jak również 
dzięki podobieństwom do znanych biurkowych aplikacji tego typu. 

Skopiowane z Google™

Wydajność można również zwiększyć przez personalizację. Użytkownicy, którzy mogą 
przystosować środowisko do własnych potrzeb, będą w stanie szybciej się go nauczyć, 
a co ważniejsze, będą używać go w sposób bardziej pewny siebie. Personalizacja może 
być realizowana na wiele sposobów: poprzez wybór widżetów wyświetlanych na desce 
rozdzielczej, defi niowanie własnych skrótów i zakładek, zmianę kolejności elementów itp.

Warto również poświęcić uwagę kwestii dostępności (ang. accessibility). Istnieją co prawda 
opinie, że dostępność nie ma znaczenia w aplikacjach WWW, ale to nieprawda. Aplikacja 
WWW powinna być pod tym względem traktowana tak samo jak publiczna strona WWW.

background image

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

63

Aplikacja WWW powinna być również wydajna w kwestii prędkości przetwarzania 
informacji. Dlatego należy wziąć pod uwagę interakcje wykorzystujące częściowe 
renderowanie stron i wysyłanie żądań AJAX.

POMOCY!

Interfejs powinien dostarczać użytkownikowi czytelne informacje zwrotne opisujące 
aktualny stan systemu. Jeśli wystąpi błąd, użytkownicy powinni otrzymać informację 
o sposobie dalszego postępowania w celu przywrócenia normalnego funkcjonowania
systemu. Jeśli odbywa się długotrwała operacja, użytkownicy powinni otrzymać informację 
na temat jej postępu.

Można nawet pójść dalej i stwierdzić, że interfejs powinien zabezpieczać użytkownika przed 
popełnianiem błędów. Ta reguła, znana jako zasada wybaczenia (ang. forgiveness), może 
być realizowana w formie komunikatów potwierdzeń, opcji wycofania operacji, stosowania 
przyjaznych formatów itp. Zasada wybaczenia powoduje, że eksperymenty z interfejsem 
są bezpieczne, co sprawia, że czas niezbędny do nauczenia się go znacznie się skraca, 
a to z kolei zwiększa satysfakcję z użytkowania.

Z powodu wysokiego poziomu komplikacji aplikacji WWW powinieneś też zaplanować 
stworzenie odpowiedniego systemu pomocy. Można to zrobić w postaci podpowiedzi 
w ramach elementów interfejsu, bazy wiedzy czy też poradników interaktywnych 
(łączących wideo, obrazy i tekst).

BRAK SATYSFAKCJI

Satysfakcja to pojęcie subiektywne i odnosi się do poczucia przyjemności z użytkowania 
interfejsu. Każda opisywana do tej pory reguła projektowa ma wpływ na satysfakcję 
użytkownika. Warto wspomnieć o jeszcze kilku.

Prostota jest jedną z głównych reguł projektowania interfejsu użytkownika. Im prostszy jest 
interfejs, tym łatwiej używa się aplikacji. Ale zapewnienie prostoty aplikacji biznesowych 
to niełatwe wyzwanie, ponieważ z reguły oferują one bardzo dużo funkcji.

Kluczem jest zrównoważenie liczby funkcji i prostoty. Zachowanie rozsądku to jeden 
z najskuteczniejszych sposobów osiągnięcia tej równowagi, na przykład przez znalezienie 
najprostszego sposobu rozwiązania problemu.

Estetyka, choć jest pojęciem subiektywnym i dość słabo zdefi niowanym, odgrywa nie mniej 
istotną rolę w osiągnięciu satysfakcji użytkownika. Użytkownicy reagują pozytywnie na 
estetyczne interfejsy, czasem nawet przymykając oko na brakujące elementy funkcjonalne. 

background image

ROZDZIAŁ 5

64

Ale należy pamiętać, że nie tworzymy dzieła sztuki. Jednym z lepszych artykułów 
poświęconych temu zagadnieniu jest In Defense of Eye Candy

 

(www.alistapart.com/articles/

indefense ofeyecandy/).

W końcu użytkownicy będą spędzali mnóstwo czasu z aplikacją biznesową i nieważne, jak 
użyteczny, spójny, wybaczający będzie interfejs — to satysfakcja spowoduje, w jaki sposób 
aplikacja zostanie oceniona.

KLUCZOWE ELEMENTY 
APLIKACJI WWW

Każda aplikacja WWW jest unikalna, ale wiele z nich posiada wspólne cechy. Choć 
szczegóły implementacji tych funkcji mogą się różnić, warto poznać pięć najważniejszych 
z nich.

FORMULARZE

Formularze są ważnym elementem aplikacji WWW. Wiemy jednak, zgodnie z tym, 
co napisał Luke Wroblewski w książce Web Form Design, że „nikt nie lubi wypełniać 
formularzy”. To dotyczy również formularzy w aplikacjach biznesowych, składających się 
z mnóstwa pól.

Warto minimalizować frustrację związaną z wypełnianiem formularzy. Zaimplementować 
walidację online i dobre sprzężenie zwrotne. Nie zapominać o początkujących 
użytkownikach. Udostępnić mechanizmy kreatorów ułatwiające i przyspieszające wykonanie 
powtarzalnych operacji albo zastosować mechanizm stopniowego ujawniania funkcji, 
ukrywając funkcje zaawansowane (albo rzadko używane).

WIDOK OGÓLNY I SZCZEGÓŁOWY

Ta technika polega na wyświetlaniu danych w dwóch osobnych, ale ściśle związanych 
widokach. Jeden z nich przedstawia dane w formie listy elementów, a drugi szczegóły 
wybranego elementu. Widoki tego typu można udostępnić w formie podstron widoku 
lub na pojedynczych stronach.

DESKI ROZDZIELCZE

Wiele aplikacji WWW oferuje elementy znane pod nazwą desek rozdzielczych (ang. 
dashboard). Jest to rodzaj widoku, który w jednym miejscu gromadzi najważniejsze 
informacje pozwalające na podjęcie szybkiego działania lub decyzji. Deska rozdzielcza 

background image

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

65

zajmuje jedną stronę i często stanowi stronę początkową po uruchomieniu aplikacji. 
Elementy tego typu są ważne, ponieważ pozwalają użytkownikom uzyskać dostęp do 
różnych informacji bez konieczności odwiedzania wielu podstron aplikacji.

TABELE

Aplikacje WWW z reguły przetwarzają duże ilości danych, które są w nich łatwo dostępne 
i można je sortować. Z tego powodu nieodzowne jest zastosowanie tabel. Nie należy 
jednak postrzegać tego jako wady. W rzeczywistości tabele zostały stworzone właśnie do 
tego. Nie należy mylić tego problemu z zaleceniem, aby unikać wykorzystywania tabel do 
porządkowania elementów interfejsu użytkownika (ang. table-less design).

Dobrze użyte tabele są bardzo czytelne. W większości przypadków należy zadbać o czytelny 
nagłówek, optymalną liczbę kolumn, podział danych na strony, zamienne kolory wierszy, 
odpowiednie wyrównanie danych w kolumnach, obsługę sortowania i fi ltrowania i wiele 
innych mechanizmów wspomagających.

Tabele mogą też być interaktywne, to znaczy mieć możliwość generowania dodatkowych 
informacji, a nawet modyfi kowania prezentowanych danych.

RAPORTY

Większość fi rm wykorzystuje raporty. Często wymagana jest ich drukowana forma, dlatego 
należy poświęcić odpowiednią ilość czasu na ich odpowiednie zaprojektowanie. Drukowane 
(lub eksportowane do innych formatów) raporty są często uproszczoną reprezentacją ich 
wersji online, zoptymalizowaną pod kątem drukarek.

NIE ZAPOMINAJ 
O WZORCACH PROJEKTOWYCH

Jesteśmy tak przyzwyczajeni do dyskusji o wzorcach projektowych, że czasem zapominamy 
o tym, by je stosować! Wzorce projektowania interfejsu użytkownika są cenną pomocą,
ważne jest jednak, aby uwzględnić je w procesie projektowania jak najwcześniej, najlepiej już 
na etapie szkicowania.

Wzorce pomagają rozwiązywać często spotykane problemy, wybór odpowiedniego wzorca 
może zatem wpłynąć na zapewnienie użytkownikom odpowiedniego poziomu znajomości 
interfejsu, a dzięki temu na skrócenie czasu niezbędnego na naukę aplikacji.

background image

ROZDZIAŁ 5

66

Rysunek 5.4. Ten zrzut ekranu pochodzi z artykułu „12 Standard Screen Patterns” (designingwebinterfaces.com/
designing-web-interfaces-12-screen-patterns), omawiającego najczęściej spotykane wzorce projektowe interfejsów WWW.

Copyright © 2009 Bill Scott & Theresa Neil, Designing Web Interfaces, O’Reilly Media

background image

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

67

STUDIUM PRZYPADKU: 
APLIKACJA BANKU ONLINE

Do omówienia przykładu z rzeczywistych aplikacji posłużę się procesem projektowania 
interfejsu użytkownika systemu online niewielkiego banku. Zespół, w którym pracowałem, 
został wynajęty do udoskonalenia systemu. Głównym powodem zlecenia była sytuacja, 
którą zarząd klienta określił jako „ciągłe narzekanie klientów — wielu z nich przestało 
używać aplikacji”.

Najważniejsze problemy odkryliśmy już po kilku godzinach spędzonych z rzeczywistymi 
użytkownikami. Informacje o kontach i kartach były ukryte pod wieloma warstwami 
kiepsko zaprojektowanej nawigacji. Znalezienie informacji o tym, ile klient wydał pieniędzy 
i jaki jest aktualny stan konta, również nie było łatwym zadaniem. Aplikacja działała 
jednak w sposób oczywisty dla pracowników banku, którzy byli doskonale zaznajomieni 
z technologią i umieli bez problemu zrozumieć liczby prezentowane przez aplikację.

Termin był bardzo napięty. Zastosowaliśmy proces opisany wyżej w tym rozdziale 
i osiągnęliśmy częściowy sukces. Mimo krótkiego czasu najważniejsze problemy były tak 
oczywiste, że dokładnie rozumieliśmy nasze zadanie i kroki niezbędne do jego realizacji. 
Stworzyliśmy stronę deski rozdzielczej, na której prezentowaliśmy użytkownikowi czytelne 
informacje na temat stanu konta i kart kredytowych. Dzięki temu nowemu elementowi 
nawigacyjnemu znalezienie najważniejszych informacji stało się łatwiejsze. Raporty stały się 
bardziej zrozumiałe, a dodatkowo zostało zaimplementowanych kilka nowych funkcji.

W systemie dokonaliśmy tylko kilku modyfi kacji, które dotyczyły kluczowych elementów 
aplikacji z perspektywy użytkownika, co wpłynęło na znaczne poprawienie doświadczenia 
z użytkowania systemu.

PODSUMOWANIE

Projektowanie interfejsu użytkownika na potrzeby aplikacji WWW jest niełatwym 
zadaniem, często zmuszającym do kompromisów. Musisz pogodzić interes klienta 
i użytkowników, wymagania biznesowe i użytkowników, oczekiwania zaawansowanych 
i początkujących użytkowników, bogactwo funkcji i prostotę obsługi.

Zadanie to wymaga solidnego zrozumienia użytkowników i ich zadań, jak również reguł 
i wzorców projektowania. Mimo trudności ta praca jest ciekawa i przy okazji każdego 
projektu możesz nauczyć się wielu rzeczy, które będą miały wpływ na sposób projektowania 
stron WWW.

Janko Jovanovic jest inżynierem oprogramowania, blogerem i autorem odczytów na tematy 
związane z inżynierią interfejsów użytkownika. W wolnym czasie pisze na temat inżynierii 
interfejsów użytkownika na swoim blogu 
JankoAtWarpSpeed.com.

background image
background image

R

O

ZDZIAŁ

 6

6

STOPNIOWE 

UDOSKONALANIE 

I STANDARDY WWW 

NIE OGRANICZAJĄ 

PROJEKTÓW

Christian Heilmann

OSTATNIO MOCNO 

nudzę się i irytuję, gdy ludzie atakują standardy WWW i koncepcje 

stopniowego udoskonalania, twierdząc, że powstrzymują nas one przed tworzeniem pięknych 
stron WWW. Padają też takie zarzuty, że te narzędzia nie pozwalają nam przesuwać granic 
tego, co jest możliwe do zrobienia ze współczesnymi technologiami.

Problem z tego typu teoriami bierze się stąd, że opierają się one na niezrozumieniu 
standardów i koncepcji stopniowego udoskonalania, a także — w każdym razie taka jest moja 
opinia — wynikają z arogancji i ignorancji w zakresie tego, jaka jest rola projektanta WWW. 
Internet jest dostępny dla wszystkich i jest takim samym produktem i medium jak każde inne.

Osobiście jestem wielkim fanem kina i lubię stare fi lmy. Rozumiem jednak, że w celu 
tworzenia doskonałych fi lmów musimy zarobić pieniądze na tych koszmarnych gniotach, 
które odwołują się do najmniejszego wspólnego mianownika upodobań albo odgrzewają 
pomysły, jakie sprawdziły się w przeszłości.

background image

ROZDZIAŁ 6

70

Ta sama zasada odnosi się do WWW: musimy przenieść naszą uwagę na to, jacy 
użytkownicy korzystają ze strony oraz jaka treść powinna się na niej znaleźć, a nie skupiać 
się na tym, jak piękna ma być albo jakie technologie wykorzysta. Piękno technologii 
WWW polega na tym, że można ich użyć do budowania produktów, które potrafi ą się 
przystosować do warunków. Nie wjadę wysoką ciężarówką do niskiego tunelu, ale aplikacje 
WWW potrafi ą zawstydzić nawet Transformersów — jeśli zbudujemy je w sposób dający im 
możliwość dostosowania dzięki współpracy w zespole ekspertów.

NOWIUTKIE TECHNOLOGIE 
A STARE DOBRE PRAKTYKI

Istnieją dziesiątki studiów przypadku demonstrujące transformacje i animacje CSS, 
dema wykorzystujące element 

canvas

 i obsługę audio i wideo w HTML 5, które „działają 

w najnowszej wersji alfa przeglądarki X”. To daje nam iluzję sieci WWW dużo bogatszej 
i piękniejszej, niż ma to miejsce w rzeczywistości. Te demonstracje dają też podstawę do 
stwierdzenia, że strony WWW stoją w miejscu, bo jakieś sztywniaki starej daty uparły 
się, że musimy stosować się do reguł i obsługiwać stare technologie. Tak naprawdę jednak 
nie ma tutaj mowy o stagnacji, chodzi raczej o dojrzałość technologii i wykorzystanie 
adaptacyjnej natury sieci WWW. Jeśli próbujesz projektować strony WWW i usiłujesz robić 
to po swojemu, to znaczy, że nie zrozumiałeś, o co w rzeczywistości chodzi w technologiach 
WWW i ich wzajemnie uzupełniających się mechanizmach.

BAŁAGAN ZWANY WWW

Dobre produkty WWW są efektem skutecznej współpracy. Jednoosobowe armie twórców 
o ograniczonej perspektywie postrzegania własnego dzieła doprowadziły do powstania
niezmierzonej masy stron o miernej jakości, niskim poziomie bezpieczeństwa, kiepsko 
zarządzanych oraz trudnych w utrzymaniu i dalszym rozwoju. Mam tu na myśli zarówno te 
strony, które wyglądają koszmarnie, ale „robią swoje”, ogromną grupę stron, które są bardzo 
trudne w użyciu, ale „komunikują przesłanie marki”, oraz tych kilka, które są zjawiskowo piękne 
na pierwszy rzut oka, ale śmiertelnie nudne na każdy następny. Znaleźć naprawdę użyteczną, 
łatwą w użyciu, piękną, dobrze utrzymaną (i łatwą w utrzymaniu) stronę to niełatwe zadanie.

Taki stan rzeczy bierze się stąd, że eksperci mają skłonność do tego, aby w procesie 
tworzenia produktu kłaść największy nacisk na tę dziedzinę, na której najlepiej się znają. 
Jeśli mieliby jednak dostęp do opinii ekspertów z innych dziedzin, mieliby możliwość 
stworzenia lepszej oferty, a w konsekwencji lepszego produktu.

TWORZENIE CELEBRYTÓW I MIEJSC, 
W KTÓRYCH CHCIELIBYŚMY BYĆ

Z zachwytem patrzymy na „gwiazdy” projektowania WWW, ludzi, którzy „wylatują 
ponad poziomy”, tworząc spektakularne, ale oderwane od rzeczywistości demonstracje. 

background image

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

71

A powinniśmy chwalić zespoły, które wykonują niesamowitą robotę, dostarczając świetne 
produkty WWW i wykorzystując do tego istniejącą, choć niedoskonałą infrastrukturę. 
Wyidealizowane prezentacje powstają w środowiskach, w których projektanci 
i programiści mają pełną kontrolę nad treścią i technologią oraz swobodę w tworzeniu 
wielkich rzeczy.

Niestety, te marzenia są oderwane od rzeczywistości, ponieważ w prawdziwym świecie 
nigdy nie mamy takiego komfortu pracy, chyba że tworzymy stronę na własne potrzeby.

To wywołuje frustrację i właśnie dlatego zamiast próbować zmienić cokolwiek w naszym 
środowisku pracy, uciekamy do świata fantazji, w którym wszystko jest świecące i nowe, 
a interfejs użytkownika razi w oczy swoją urodą.

Wracając z konferencji, na których napatrzyłeś się na nowe możliwości CSS, masz poczucie, 
że bierzesz udział w czymś wartościowym. Sprzeczki z członkami zespołu o to, że trzeba 
napisać wtyczkę, która pozwoli fi rmowemu CMS-owi generować semantycznie poprawny 
HTML (albo, w ostateczności, wygeneruje klasę, która ułatwi podpięcie się CSS-em), 
są już znacznie mniej satysfakcjonujące. Trzeba jednak zadać sobie pytanie: które z tych 
doświadczeń ma wpływ na Twoje produkty? Prawdopodobnie i jedno, i drugie, ale 
naprawiając problemy w infrastrukturze, umożliwiamy wdrożenie nowych, ciekawych 
technologii, które mają szansę przyjąć się na rynku masowym.

Możemy budować niezwykle szybkie samochody o niskim zawieszeniu, poruszające się 
z prędkością przekraczającą 300 km/h, ale jeśli zatłoczone samochodami drogi będą pełne 
dziur i byle jakich łat, te wspaniałe pojazdy staną się jedynie zabawkami dla bogaczy, 
których stać na zbudowanie prywatnego toru wyścigowego. Dokładnie to samo można 
powiedzieć na temat każdej „pokazowej” prezentacji, w której doskonałe efekty wizualne 
uzyskano dzięki dostosowaniu tekstu do szerokości okien, odpowiedniemu doborowi liczby 
prezentowanych produktów, ale w której dodanie choćby akapitu tekstu będzie wymagać 
ingerencji w kod CSS.

Nie w ten sposób powinniśmy korzystać z WWW. Osoby utrzymujące strony nie powinny 
być skazane na pomoc ekspertów w przypadku każdej zmiany treści. A pamiętajmy, 
że strony WWW zmieniają się w trybie ciągłym, co powoduje, że są interesujące i bardziej 
efektywne choćby od mediów drukowanych.

HOLLYWOOD I REKLAMY 
NICZEGO NAS NIE NAUCZĄ

Wiele prezentacji projektów stron WWW odwołuje się do przemysłu fi lmowego — 
z powodu bogactwa treści i wizualnej atrakcyjności. Spróbuj w takim razie odszukać strony 
dotyczące starszych fi lmów, a przekonasz się, że większość z nich przywita Cię błędem 
404 albo komunikatem: 

       

 (poszukaj np., czym jest 

Matrix, ale przygotuj się na chwilę oczekiwania). Czy chcemy stworzyć właśnie taką sieć 
WWW? Czy to można nazwać innowacją? A może raczej powinniśmy pracować jako 
zespół, wykorzystując unikalne talenty każdego z członków do stworzenia czegoś lepszego 
i trwalszego niż ulotna uroda, czegoś, co będziemy mogli nazwać doskonałą stroną WWW? 

background image

ROZDZIAŁ 6

72

Czy celem projektowania WWW nie było od zawsze stworzenie treści, które będą dostępne 
dla milionów użytkowników na całym świecie znacznie dłużej, niż wynosi żywotność taniej 
płyty CD (dla zainteresowanych: wynosi ona około 10 lat).

MIT INNOWACJI PRZEZ ROZWÓJ TECHNOLOGII

A teraz niespodzianka. W większości przypadków nie wprowadzamy innowacji — to nie jest 
rewolucja, to już było.

To już się wydarzyło podczas pierwszych wojen przeglądarek: ludzie budowali strony 
działające tylko w ich konkretnych wersjach. Wówczas również twierdzili, że to patrzenie 
w przyszłość. Jestem pewny, że doskonale wiesz, która przeglądarka była wtedy najmocniej 
wykorzystywana do tego typu demonstracji, a dziś tak ciężko jest nam się jej pozbyć.

Tak, chodzi o IE6. Wiele współczesnych pokazowych prezentacji CSS3, szczególnie 
wykorzystujących animacje, boleśnie przypomina mi wyrażenia CSS specyfi czne dla IE6 
z dawnych lat. Czy wiesz na przykład, że w IE5.5 można było obracać tekst z użyciem 
fi ltra 

matrix

? Różnica jednak polega na tym, że wówczas komputery były tak wolne, 

iż efekty tego typu wyglądały po prostu źle. Na współczesnych komputerach i nowiutkich 
iPhone’ach i iPadach wygląda to znacznie lepiej. Bardzo się cieszę, że nie doczekałem 
czasów hybrydowych technologii z problemami wydajności i konieczności borykania się 
ze składnią, która została stworzona w ramach koszmarnego snu, ale nie jestem przekonany, 
że przeglądarkowe „wojny CSS3”, jakich jesteśmy obecnie świadkami, również oprą się 
próbie czasu.

W INNOWACJI NIE CHODZI O NOWE ZABAWKI

Często przez pojęcie innowacji rozumiemy wykorzystanie nowoczesnych technologii. 
Właśnie z tego powodu wciąż widzimy próby rozwiązywania tych samych, starych 
problemów przez coraz to nowsze technologie, najczęściej również wówczas, gdy już 
dawno zostały rozwiązane. Menu rozwijane w CSS były na przykład zastosowaniem nowej 
technologii, ale z pewnością również krokiem wstecz, jeżeli chodzi o użyteczność: nie 
można opóźnić ukrywania menu, nie można też sprawdzić z góry, czy przed rozwinięciem 
menu zmieści się na ekranie.

Do tego typu zastosowań niezbędna jest technologia wykorzystująca komunikację 
dwukierunkową: modyfi kujesz jakiś parametr i sprawdzasz, czy zmiana przyniosła 
oczekiwane efekty. CSS nie obsługuje tego typu mechanizmów, możemy jedynie mieć 
nadzieję, że przeglądarka ma daną funkcję zaimplementowaną w prawidłowy sposób. 
Z JavaScriptem natomiast mamy taką opcję. W przypadku JavaScriptu mamy również 
dostęp do czytelnej składni, a CSS ze swoimi rozszerzeniami specyfi cznymi dla przeglądarek 
stopniowo przekształca się w składniowy koszmar.

background image

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

73

CSS dorobił się również pewnych mechanizmów obronnych, na przykład obsługi 
niezależnych arkuszy stylów dla różnych mediów czy rozmiarów ekranu — to użyteczne 
narzędzia. Ale warto zadać sobie pytanie, czy CSS rzeczywiście potrzebuje tego typu logiki 
i czy musimy być skazani na czekanie, aż rozwiązania te zostaną zaimplementowane we 
wszystkich przeglądarkach. Nie lepiej już teraz użyć JavaScriptu w połączeniu z istniejącymi 
możliwościami CSS, aby uzyskać dokładnie taki sam efekt? Wystarczy dobry projektant 
znający CSS i programista posiadający podstawową wiedzę z zakresu JavaScriptu. Ależ 
absolutnie, dlaczego mamy dzielić się chwałą z jakimiś programistami, jeśli możemy zebrać 
wszystkie zaszczyty, używając CSS3?

Innowacja nie polega na używaniu wyłącznie nowych technologii do realizacji wszystkich 
zadań. Innowacja polega na tym, aby łączyć nowe narzędzia z już posiadanymi w celu 
uzyskania nowej jakości. Krzemień nadawał się nieźle na groty włóczni do polowań, 
sprawdzał się też do obierania zwierzyny ze skóry. Uderzanie krzemieni jeden o drugi 
albo o kamień niespodziewanie dało dostęp do nowego narzędzia — ognia. Nikt nie 
pojawił się ni z tego, ni z owego z zapalniczką, żeby pokazać, jak to się robi. Zamiast 
tego analizowaliśmy możliwości posiadanych technologii w celu jeszcze lepszego ich 
wykorzystania. A jako bonus: krzemień do działania nie wymaga napełniania paliwem.

KORPORACYJNE WYPACZENIE INNOWACJI 
I JEGO KONSEKWENCJE

Mówiąc o innowacji, należy pamiętać o jeszcze jednym fakcie. Pół roku po opracowaniu 
nowej technologii znajdą się ludzie, którzy zaczną ją sprzedawać korporacyjnym działom 
IT. W większości przypadków taka innowacja wchodzi w skład większego pakietu 
oprogramowania: „O tak, w najnowszej wersji nasz pakiet CMS Za-Dużo-Kosztuje-
Za-Mało-Potrafi -Wersja-Professional obsługuje AJAX, do tego w kolorze!”. Co jeszcze 
smutniejsze, to jedyny przypadek, gdy innowacja ma szansę dotrzeć do masowego odbiorcy.

Jeśli naprawdę myślisz, że korporacje albo użytkownicy końcowi interesują się tym, 
co robisz, to po prostu się oszukujesz. Oprogramowanie i internet służą przecież tylko do 
rozwiązywania problemów. A smutne jest to, że to nie my będziemy decydować o tym, które 
rozwiązania są najlepsze, tylko odbiorcy, którzy najczęściej wybiorą to, co będzie najtańsze, 
względnie najbardziej bezpieczne (często w subiektywnej ocenie).

Wielkie fi rmy oferują korporacjom swoje oprogramowanie po ustalonych cenach, 
obiecując rozwiązać wszystkie problemy, z jakimi borykają się one w związku z jego 
wykorzystywaniem, oraz przeszkolić pracowników w zakresie pracy z nowym systemem. 
Strategia ta sprzedaje się znacznie lepiej niż nasze hasła typu: „Pomożemy wam zrozumieć 
sieć, a waszym pracownikom pracować w sposób bardziej efektywny”. Takie hasło tłumaczy 
się w sposób następujący: „Więcej pracy dla waszych, już przeciążonych, pracowników”.

background image

ROZDZIAŁ 6

74

SYNDROM SZTOKHOLMSKI 
ZŁYCH INTERFEJSÓW

Popełniane błędy projektowe skutkują powstaniem dużej liczby interfejsów WWW, które są 
nieprzyjemne w użyciu i nieatrakcyjne w wyglądzie. Co jednak zdumiewa, ludzie uwielbiają 
ich używać. Tego nauczyli się na szkoleniach korporacyjnych i to są produkty używane w ich 
fi rmach.

Zapamiętanie pięciu pozornie niezwiązanych operacji oraz ich mechaniczne wykonywanie 
jest łatwiejsze od znalezienia czasu na nauczenie się nowych rzeczy. To w pewnym sensie 
uspokaja, gdy wiesz, jak osiągnąć oczekiwane efekty w przewidywalny sposób.

Jeśli nie jesteś jednym z nielicznych, którzy budują sieć WWW, każda zmiana staje się 
zmorą, a jedną z nich są nowe wersje oprogramowania.

Właśnie z tego powodu wiele fi rm boryka się z przestarzałymi konfi guracjami: nie dlatego, 
że zarząd z piekła rodem odmawia pracownikom wdrożenia nowiutkich technologii, 
a dlatego, że pracownicy nie oczekują tych unowocześnień, ponieważ nie wynika z nich 
żadna dostrzegalna korzyść.

Zamiast stawiać sobie za cel użytkowników, którym w rzeczywistości nie zależy na rozwoju 
sieci WWW, i wmawiać im, jak wiele mogą zyskać na innowacji, pozostajemy w bezpiecznej 
strefi e fachowców, takich jak my, dyskutując o przesuwaniu granic możliwości i narzekając, 
jak mało tym wszystkim przejmuje się rynek.

Chcesz popchnąć sieć WWW do przodu? Znajdź sposób, aby skrócić pięcioletni cykl 
aktualizacji oprogramowania w korporacjach. Zawsze gdy ktoś próbuje rozmawiać o tym 
problemie z wiodącymi autorytetami projektowania WWW, słyszy stwierdzenie: „To jest 
bitwa, której nie mamy szansy wygrać”.

NIE CHODZI O TECHNOLOGIĘ 
ALBO PROJEKT

Na końcu dostarczamy produkt. Pasjonujemy się siecią i chcemy popchnąć ją do przodu. 
Nasz problem polega na tym, że chowamy się w naszej strefi e bezpieczeństwa, zamiast 
rozszerzać naszą wiedzę:



projektanci chcą przesuwać granice możliwości w zakresie bogatszych interakcji 
i piękniejszych projektów z bogatą typografi ą;





projektanci user experience chcą jak najbardziej uprościć odbiorcom realizację ich 
celów: jeśli coś działa w aplikacjach biurkowych, powinno działać w WWW;

background image

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

75





inżynierowie pracują nad optymalizacją prędkości, stosując „najlepsze praktyki 
wydajności”, które są związane z szybkością generowania wyników wyszukiwania 
w specjalizowanych aplikacjach, jak Gmail, ale mają mniej wspólnego ze stronami 
WWW z dużą ilością treści;



inni inżynierowie chcą budować jak najbardziej elastyczne platformy, które 
użytkownicy będą wykorzystywać do tworzenia treści, nigdy więcej nie zawracając 
inżynierom głowy (bo oni oczywiście wówczas przejdą do rozwiązywania nowych 
problemów);



entuzjaści technologii mobilnych porzucają technologie WWW, traktując je jako 
przestarzałe, ponieważ mają ograniczenia i są za bardzo oddalone od możliwości 
platformy.

Wiele z tych ambicji wzajemnie się wyklucza, a ostatni z powyższych punktów opisuje 
szczególnie błędny punkt widzenia. Dzieje się tak, ponieważ my, twórcy WWW, 
zapomnieliśmy o naturze tej sieci: stosie technologii, które można przystosować do potrzeb 
użytkownika, o sprytnych właściwościach przystosowania interfejsu danych tak, aby 
każdy przypadek mógł być obsłużony w sposób, jakiego wymaga. To, że sieć WWW, która 
powstała jako platforma tekstowa, ewoluowała w system multimedialny, jest wspaniałym 
zjawiskiem. To, że na siłę staramy się usunąć tę pierwszą, fundamentalną jej cechę i zastąpić 
ją drugą, jest nieodpowiedzialne lub przynajmniej mocno przedwczesne.

GDZIE JEST PIĘKNO SIECI WWW?

Piękno projektu WWW polega na jego możliwościach przystosowawczych oraz interfejsach, 
które dopasowują się do potrzeb użytkownika w sposób niezależny od technologii lub 
możliwości fi zycznych. Zapomnieliśmy o tym z wielu powodów:



Jesteśmy fanatykami kontroli. Lubimy kontrolować to, co robimy, boimy się 
chaosu, a użytkownicy robią zamieszanie w naszych produktach. Oczywiście lubimy 
wprowadzać zmiany i łamać zasady, ale tylko w zakresie wyboru czcionki albo kolorów.



Jesteśmy zgorzkniali. Przez lata pracowaliśmy niezmordowanie, żeby zrobić z sieci 
lepsze i piękniejsze miejsce, a nasi klienci mieli to w nosie. Obiecywano nam, że 
będziemy mogli stworzyć coś wspaniałego, po czym nasze budżety były obcinane albo 
zmuszano nas do przejścia do kolejnego projektu, zanim zdążyliśmy dodać ten jeden 
element, który spowodowałby, że poprzedni projekt stałby się niesamowity.





Tanie podniety. Łatwo jest wygłaszać pochwały za „myślenie poza ograniczeniami”, 
wmawiając ludziom, że koncepcja stopniowego udoskonalania nie ma sensu, że nie 
warto obsługiwać IE6 albo że wszyscy powinni używać rozdzielczości o szerokości 
1920 pikseli. Usłyszysz brawa, a ludzie będą patrzeć na Ciebie z podziwem, ponieważ 
dokładnie to samo od zawsze chcieli powiedzieć swoim szefom. Ale czy taka postawa 
nam pomaga? Czy ktoś nas pochwali za to, że zamykamy się w nierealnym świecie?

background image

ROZDZIAŁ 6

76





Frustracja na punkcie produktu końcowego. Rzadko mamy możliwość spojrzeć 
na produkt i powiedzieć: „To jest fajne i wygląda dokładnie tak, jak sobie 
zaplanowaliśmy”. Co gorsza, po roku utrzymywania produktu mamy szczęście, jeśli 
uda nam się znaleźć jakiekolwiek podobieństwo z tym, co zrobiliśmy. Strony portfolio 
są nieaktualne już w momencie wrzucenia ich na serwer (wiem to z doświadczenia, 
ponieważ właśnie zatrudniam nowych pracowników i mam problemy z dotarciem do 
ich dzieł).



Arogancja i ignorancja. Nasz rynek, nasze praktyki zarządzania zasobami ludzkimi, 
a nawet nasze listy zadań kreują wyraźny podział na projektantów i programistów. 
Zamiast walczyć z tą tendencją i wyróżniać „programistów WWW”, którzy radzą sobie 
z user experience i wierszem poleceń, z zadowoleniem pozwalamy sobie na chowanie 
się w naszych bunkrach.

Programista, który twierdzi, że nie potrzebuje dobrego projektu, jest tak samo bezużyteczny 
jak projektant, którego nie interesują techniczne zastosowania jego projektów. Powinniśmy 
zachęcać obie strony do budowania jak najlepszych produktów dzięki współpracy, zamiast 
traktować się wzajemnie jak beton blokujący rozwój albo nieuleczalni narzekacze, którzy 
przeszkadzają w pracy.

JESZCZE RAZ: NASZE PROBLEMY

Podsumujmy zatem problemy, z jakimi boryka się każdy, kto chce budować wysokiej jakości 
produkty WWW:



Twoje produkty będą pracować w nieprzewidywalnych konfi guracjach 
technologicznych
. Możesz się oszukiwać, że każdy użytkownik z radością zaktualizuje 
system i przeglądarkę do najnowszej wersji, ale jeśli w to wierzysz, to znak, że od 
dawna nie zrealizowałeś prawdziwego projektu.



Przestarzała technologia jest i będzie zawsze. Użytkownicy nie mogą aktualizować 
swojego oprogramowania albo po prostu ich to nie obchodzi. Gdy oglądam telewizję, 
nie interesuje mnie, jak to działa „w środku”. Wielu użytkowników WWW myśli 
dokładnie tak samo.





Twoja praca będzie zmasakrowana. Strona WWW, którą chcesz zbudować, będzie 
zmieniana wielokrotnie w czasie realizacji projektu (np. klientowi skończą się 
pieniądze, co jest standardową sytuacją), a to, co w końcu powstanie, przez lata 
użytkowania będzie nadal zmieniane do postaci, jakiej nigdy nie planowałeś stworzyć.





Nie możesz wiedzieć wszystkiego. Gdy publikujesz produkt w sieci WWW, musisz 
spełnić następujące wymagania: produkt musi służyć ludziom, wyglądać estetycznie, 
działać z zadowalającą wydajnością, być bezpieczny, być rozszerzalny, obsługiwać 
możliwość przystosowania do innych rynków i języków, pozwalać na łatwe 
modyfi kacje i adaptacje, być tani w utrzymaniu i przenoszeniu na inne platformy. 
Jeśli potrafi sz spełnić te wymagania, proszę, wyślij mi swoje CV… Albo nie, bo jeśli 
to prawda, z pewnością nie potrafi sz pracować w zespole.

background image

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

77





Nie możesz zakładać, że rozwiązania przetrwają próbę czasu. Wiele „świetnych 
sztuczek” i „najlepszych praktyk” wiąże się z ogromną ceną, jaką trzeba zapłacić po 
kilku miesiącach użytkowania. Wiele rozwiązań, które kiedyś były uznane za szczyt 
osiągnięć rzemiosła, obecnie jest traktowanych jako niezalecane (np. układy strony 
oparte na tabelkach były swego czasu uznane za niezawodne rozwiązanie ratujące 
przed błędami obsługi CSS w przeglądarkach).

Wszystkie te elementy prowadzą do prawdy, którą poznałem dawno temu: przestrzeganie 
standardów i stopniowe udoskonalanie pozwalają na budowanie produktów, które nie będą 
po jakimś czasie mścić się lub śnić w koszmarach nocnych.

DLACZEGO STANDARDY 
MAJĄ ZNACZENIE I CO OZNACZA 
„PRZESTRZEGANIE STANDARDÓW”

Praca zgodnie ze standardami oznacza dwie rzeczy: ułatwianie innym wykorzystania 
Twojej pracy oraz stabilny punkt wyjścia do rozpoczęcia pracy. Standardy w każdym 
profesjonalnym środowisku mają tę właściwość, że po prostu działają. Nie zawsze stanowią 
najlepsze lub najbardziej eleganckie rozwiązanie, ale trzymanie się ich pozwala na 
dostarczenie działającego produktu. Właśnie dlatego zostały ustandaryzowane takie rzeczy, 
jak gwinty śrub i rozmiary czcionek, i dzięki temu mamy dostęp do szablonów umów na 
realizację projektów.

Jeśli programista zastosował standardy, jego produkt będzie mógł być rozwijany przez kogoś 
innego, nawet w przypadku gdy brakuje dokumentacji. Nadal mogę złożyć samochody ze 
swoich starych zestawów Lego, mimo że zgubiłem instrukcje. Gdybym jednak poobcinał 
albo powyginał klocki, żeby wyglądały atrakcyjniej, nie miałbym takiej możliwości.

Wykorzystując standardy, zawieramy niepisane porozumienie z programistami, którzy 
przejmą projekt po nas. Wysyłamy czytelny komunikat: „Nie obawiaj się niespodzianek, 
jestem profesjonalistą”.

Warto jednak pamiętać, że zgodność ze standardami nie jest czymś absolutnie wymaganym. 
Dodanie ról ARIA do kodu HTML spowoduje, że walidatory W3C będą zgłaszać błędy, 
ale obsługa tych ról pozwala użytkownikom sprawnie poruszać się w dokumentach bez 
konieczności wykorzystywania specjalnie napisanych mechanizmów, jak skróty klawiszowe.

STOPNIOWE UDOSKONALANIE DZIAŁA

Mechanizmy stopniowego udoskonalania nie dotyczą możliwości wykorzystania starszych 
wersji przeglądarek — każdy, kto tak twierdzi, zdradza się ze swoim brakiem zrozumienia 
problemu. Chodzi tu o dostarczanie produktu, który będzie obsługiwany niezależnie od 
platformy, a dokładniej:

background image

ROZDZIAŁ 6

78



Wszystkie elementy absolutnie niezbędne do odbioru treści są dostarczone 
w HTML-u
. Nie chodzi tu jednak o statyczny HTML, a o dynamiczny HTML 
wyrenderowany za pomocą dobrze napisanego back-endu pobierającego dane 
za pomocą API.



Wygląd i zachowanie powinny być zdefi niowane w arkuszach CSS. Jeśli chcesz 
spowodować, żeby wybrane elementy miały określony wygląd, nie będzie większego 
problemu. Właśnie do tego celu mamy elementy 

SPAN

 i 

DIV

. Oczywiście zawsze znajdą 

się fanatycy, którzy będą się krzywić na widok każdego dodatkowego elementu 

DIV

 

na stronie. Powiedz im, żeby wyluzowali.



 Wzbogacanie doświadczenia użytkownika dzięki atrakcyjnej warstwie 
interaktywności
. Ten element może być zaimplementowany z użyciem CSS 
w przypadku efektów 

hover

, przekształceń i animacji. Można też wykorzystać 

JavaScript, Flash czy też Silverlight… A co tam, jeśli chcesz, możesz nawet wrzucić 
aplety Javy. Nie stanie się nic złego, pod warunkiem że dodasz te elementy tylko tam, 
gdzie to ma sens.

Dobrymi przykładami wykorzystania stopniowego udoskonalania są elementy SWFObject 
i SoundManager. Zamiast umieszczać na stronie elementy Flash w nadziei, że zadziałają, 
umieść linki do pobrania fi lmów wideo i plików audio, dodaj JavaScript i pozwól skryptowi 
zająć się przypadkami szczególnymi. Skrypt sprawdzi obsługę Flasha, zbuduje odpowiedni 
kod HTML dla przeglądarki i osadzi w dokumencie obiekty wideo i audio tylko wówczas, 
gdy użytkownik będzie w stanie je odtworzyć. Każdy użytkownik będzie miał możliwość 
obejrzenia wideo i odsłuchania audio, ale na stronie wyświetlą się odpowiednie elementy 
kontrolne tylko wówczas, gdy przeglądarka będzie potrafi ła je odtworzyć.

Zastanawiając się nad tym, czy potrzebujesz mechanizmów stopniowego udoskonalania, 
warto zadać sobie pytanie, czy jesteś pewny, że oferowane funkcje będą działać zawsze. 
Jeśli tak, gratulacje, zbudowałeś doskonały produkt WWW. Testowanie przed oddaniem 
produktu to konieczność tak oczywista jak sprawdzanie głębokości jeziora, zanim się do 
niego wskoczy na główkę. Tutaj nie ma żadnej magii.

Wielką i często zapominaną zaletą stopniowego udoskonalania jest to, że różne zadania są 
przydzielane do różnych technologii, dzięki czemu można podzielić się pracą pomiędzy 
członkami zespołu.

Produkt wykorzystujący techniki stopniowego udoskonalania może być budowany 
w sposób równoległy przez programistów back-endu, programistów front-endu 
i przez zespół projektantów user experience. Jeśli zaczniesz od projektu i przekażesz go 
programistom, to nie dochodzi do współpracy. Przy takim podejściu często zdarza się, 
że część kodu musi zostać przepisana, a czasem nawet zachodzi konieczność zmiany 
architektury. W celu zaoszczędzenia czasu warto zastosować się do reguły, żeby mierzyć 
dwa razy, a przycinać raz.

Cykl budowania produktu powinien się rozpoczynać od zdefi niowania podstawowych 
funkcji. Po ich ustaleniu wszystkie grupy mogą pracować równolegle i spotykać się co jakiś 
czas w celu dalszego udoskonalania. Oznacza to również, że jeśli dochodzi do sytuacji 
krytycznej i fundusze zostają obcięte, mamy działający produkt. To metodologia zwinna 
(ang. agile) w najlepszym wydaniu.

background image

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

79

NAJLEPSZE PRAKTYKI 
BIORĄ SIĘ Z ZASTOSOWAŃ 
I CIĄGŁEGO UDOSKONALANIA

Jeśli chcemy udoskonalić nasz rynek, nie możemy reklamować wszystkiego, co tworzymy, 
jako „najlepsze praktyki”. Najlepsze praktyki powinny wynikać w sposób naturalny 
z rzeczywistych produktów zbudowanych w oparciu o realne założenia dla żywych klientów, 
ze wszystkimi irytującymi problemami wynikającymi z takiego układu. Demonstracyjne 
technologie obsługujące wszystkie „aktualne” przeglądarki wyglądają ciekawie, ale 
w rzeczywistym projekcie może znienacka pojawić się przeszkoda, która okaże się kijem 
włożonym w szprychy przedsięwzięcia.

Jeśli więc pracujesz w fi rmie i udało Ci się zaimplementować ciekawą technologię w oparciu 
o istniejący produkt lub znasz historie o tym, jak decyzja o przejściu na układ oparty na
CSS pozwoliła klientowi zaoszczędzić tysiące dolarów, napisz do nas. Chcemy opowiadać 
klientom historie z życia, nie wizje świetlanej przyszłości.

Co więcej, postaraj się prześwietlić każdą „najlepszą praktykę” z własnego podwórka: czy 
rzeczywiście dają tak dobre rezultaty, jakie obiecują? Czy też do rzeczywistych zastosowań 
wymagają zaimplementowania jakiejś protezy?

RAZEM MOŻEMY TEGO DOKONAĆ

Ostatnią rzeczą, jaką chciałem poruszyć, jest moje zmęczenie ciągle trwającą debatą 
na temat konfl iktu na linii programiści, projektanci i menedżerowie projektów. Jak 
wspomniałem wcześniej, realizacja projektu WWW wymaga różnych umiejętności i albo 
będziesz zmuszony znaleźć kogoś, kto je posiada, albo samemu nauczyć się tego wszystkiego 
i włożyć wysiłek w to, aby utrzymać się na fali.

Chodzi tu przede wszystkim o pracę zespołową, zaufanie, dzielenie się pracą i komunikację. 
Jeśli wszyscy zabarykadujemy się w naszych wieżach z kości słoniowej i będziemy jedynie 
narzekać na to, że nie możemy pracować z innymi, przy okazji udając, że możemy 
bez problemu wykonywać ich pracę, pod warunkiem że użytkownicy będą zawsze 
wykorzystywali tylko najnowsze wersje przeglądarek, nie powinniśmy się dziwić, że nie 
będzie nam dane dostarczyć na rynek gotowego i udanego produktu WWW, a jedynie 
marne programy z interfejsem WWW.

Christian Heilmann jest ewangelistą oprogramowania (ang. Developer Evangelist) pracującym 
w fi rmie Yahoo! Developer Network w pięknym mieście Londyn w Anglii.

background image
background image

R

O

ZDZIAŁ

 7

7

TEORIA 

KOLORÓW DLA 

PROFESJONALNYCH 

PROJEKTANTÓW

Cameron Chapman

KOLOR W PROJEKCIE

 ma działanie bardzo subiektywne. To, co w jednej osobie wywołuje 

pewną reakcję, w kimś innym może wywołać zupełnie inną. Czasami wynika to z osobistych 
preferencji, a czasami z podłoża kulturowego. Teoria barw jest nauką samą w sobie. 
Studiowanie, w jaki sposób kolory oddziałują na różnych ludzi, zarówno na jednostkę, 
jak i na grupę, to coś, na czym niektórzy budują swoje kariery. I nie jest to temat błahy.

Czasami taki podstawowy zabieg jak zmiana odcienia lub nasycenia może wywołać 
całkowicie różne odczucia. Różnice kulturowe powodują, że coś, co wywołuje uczucie 
szczęścia i podnosi na duchu w jednym kraju, w innym może być przygnębiające.

background image

ROZDZIAŁ 7

82

CIEPŁE KOLORY

Do ciepłych kolorów zaliczają się: czerwony, pomarańczowy i żółty oraz ich wariacje. 
To kolory ognia, jesiennych liści, wschodu oraz zachodu słońca. Zazwyczaj są one 
energetyzujące, namiętne oraz pozytywne.

$[FSXPOZ

;JFMPOZ

őؒUZ

1PNBSBŴD[PXZ

'JPMFUPXZ

/JFCJFTLJ

$[FSXPOPmPMFUPXZ

/JFCJFTLPmPMFUPXZ

őؒUPQPNBSBŴD[PXZ

$[FSXPOPQPNBSBŴD[PXZ

/JFCJFTLP[JFMPOZ

őؒUP[JFMPOZ

Rysunek 7.1. Projektanci muszą dobrze zrozumieć zasadę emocjonalnego oddziaływania koloru

Zarówno kolor czerwony, jak i żółty są barwami podstawowymi, kolor pomarańczowy 
powstaje z ich połączenia, co oznacza, że ciepłe kolory są rzeczywiście ciepłe i nie powstają 
z połączenia ciepłych kolorów z kolorami zimnymi. Wykorzystaj ciepłe kolory w swoim 
projekcie do odzwierciedlenia pasji, szczęścia, entuzjazmu oraz energii.

Rysunek 7.2. Ciepłe kolory przywołują energię oraz pasję

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

83

CZERWONY (KOLOR PODSTAWOWY)

Czerwony jest kolorem gorącym. Kojarzy się z ogniem, przemocą i wojną. Jednocześnie 
oznacza miłość i pasję. W przeszłości był symbolem zarówno diabła, jak i Kupidyna. Kolor 
czerwony może mieć rzeczywiście fi zyczny wpływ na ludzi, podnosząc ciśnienie oraz 
przyspieszając oddech. Udowodniono również, że przyspiesza metabolizm.

Czerwony może kojarzyć się zarówno ze złością, jak i ze statusem (przypomnij sobie 
czerwony dywan na rozdaniach nagród oraz na imprezach dla celebrytów). Czerwony 
sygnalizuje również niebezpieczeństwo (dlatego czerwone są światła drogowe i znaki stopu 
oraz większość etykiet ostrzegawczych).

Poza światem zachodnim czerwony ma różne znaczenia. Na przykład w Chinach jest 
kolorem powodzenia i szczęścia. W innych wschodnich kulturach jest noszony przez panny 
młode w dniu ślubu. W Ameryce Południowej natomiast czerwony jest kolorem żałoby. 
Czerwony jest również symbolem komunizmu. W Afryce kolor ten został wykorzystany 
w kampanii RED mającej na celu szerzenie świadomości na temat choroby AIDS.

W projektowaniu czerwony może być użyty jako mocny akcent kolorystyczny. Stosowany 
w nadmiarze może przytłaczać. Jest wspaniałym kolorem symbolizującym w projekcie 
władzę i pasję. Ma szeroki zakres znaczeń — jaśniejsze odcienie kojarzą się z energią, 
ciemniejsze z władzą i elegancją.

POMARAŃCZOWY (KOLOR POŚREDNI)

Pomarańczowy jest żywym i energicznym kolorem. W swoich stonowanych odcieniach 
symbolizuje ziemię oraz okres jesienny. Ze względu na swój związek ze zmieniającymi się 
porami roku pomarańczowy może oznaczać zmianę oraz ruch w ogóle.

Rysunek 7.3. Czerwony jest gorący i namiętny, ale może być również przytłaczający

background image

ROZDZIAŁ 7

84

Ponieważ nazwa koloru jest równocześnie nazwą owocu, kolor pomarańczowy może także 
kojarzyć się ze zdrowiem oraz witalnością. W projektowaniu kolor pomarańczowy przyciąga 
uwagę bez ryzyka przytłoczenia, jak może to mieć miejsce w przypadku czerwonego. 
Jest często uważany raczej za bardziej przyjazny i przyciągający, a nie wulgarny.

ŻÓŁTY (KOLOR PODSTAWOWY)

Żółty jest uważany za najjaśniejszy i najbardziej energetyzujący ze wszystkich ciepłych 
kolorów. Symbolizuje szczęście i słońce. Może być również kojarzony z oszustwem 
i tchórzostwem (w angielskim, mówiąc do kogoś, że „jest żółty”, sugerujemy, że jest 
tchórzem — ang. to be yellow).

Rysunek 7.4. Pomarańczowy jest żywym kolorem oznaczającym zdrowie i witalność

Rysunek 7.5. Żółty symbolizuje szczęście, energię, ale również i oszustwo

Żółty oznacza także nadzieję. Są kraje, gdzie nosi się żółte wstążki na pamiątkę bliskich, 
którzy zginęli na wojnie. Żółty symbolizuje również niebezpieczeństwo, choć w sposób 
mniej intensywny niż czerwony. W różnych krajach żółty może mieć różne znaczenie. 
W Egipcie na przykład oznacza żałobę, w Japonii odwagę, a w Indiach jest kolorem kupców.

W projektach możesz wykorzystać kolor jasnożółty, aby wywołać w użytkownikach 
poczucie szczęścia i pogody ducha. Delikatne żółcie są powszechnie używane jako neutralny, 
niezależny od płci kolor dla niemowląt (zamiast niebieskiego lub różowego) oraz małych 
dzieci. Jasny żółty wywołuje uczucie spokoju i szczęścia w większym stopniu niż intensywny 
żółty. Natomiast ciemny żółty oraz żółty z odcieniem złota wyglądają „zabytkowo”, mogą 
więc być używane w projektach, w których pożądane jest wrażenie trwałości.

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

85

ZIMNE KOLORY

Do zimnych kolorów zaliczają się: zielony, niebieski i fi oletowy. W przeciwieństwie do 
kolorów ciepłych występują najczęściej w barwie stonowanej. Symbolizują kolory nocy, 
wody i natury. Zazwyczaj są uspokajające, relaksujące i nieco ofi cjalne.

W całym zbiorze zimnych kolorów tylko niebieski jest kolorem podstawowym. To oznacza, 
że inne barwy powstają z połączenia niebieskiego z kolorem ciepłym (z żółtym dla 
uzyskania zielonego, z czerwonym — fi oletowego). Kolor zielony przyjmuje niektóre 
atrybuty żółtego, a fi oletowy czerwieni. Zastosuj zimne kolory w swoich projektach, 
aby uzyskać poczucie spokoju i profesjonalizmu.

ZIELONY (KOLOR POŚREDNI)

Zielony jest kolorem bliskim ziemi. Symbolizuje nowy początek i rozwój. Oznacza również 
odnowę i obfi tość. Inne znaczenia zieleni to zazdrość, zawiść czy brak doświadczenia.

Rysunek 7.6. Zimne kolory dają poczucie spokoju

Zielony posiada cechy uspokajające jak niebieski, ale wywołuje również przypływ energii jak 
żółty. W projektach może dać efekt równowagi, harmonii oraz stabilności. Doskonale nadaje 
się do projektów związanych z bogactwem, stabilnością, odnową oraz naturą. Jaśniejsze 
zielenie są energetyzujące oraz żywe, podczas gdy oliwkowe nawiązują do świata przyrody. 
Ciemne zielenie symbolizują stabilność i zamożność.

Rysunek 7.7. Zielony łączy uspokajającą moc niebieskiego z energią żółtego

background image

ROZDZIAŁ 7

86

NIEBIESKI (KOLOR PODSTAWOWY)

Niebieski w kulturze zachodniej jest często kojarzony ze smutkiem (ang. blue oprócz nazwy 
koloru oznacza smutny nastrój). Jest on często wykorzystywany do symbolizowania spokoju 
i odpowiedzialności. Jasne odcienie niebieskiego mogą mieć działanie odświeżające i są 
odbierano jako przyjazne. Ciemne odcienie dają mocniejszy efekt i poczucie zaufania. 
Niebieski jest utożsamiany z pokojem i przywołuje skojarzenia religijne i duchowe 
(np. Matka Boska jest często przedstawiana w niebieskich szatach).

Znaczenie niebieskiego w dużej mierze zależy od odcienia i poziomu nasycenia. 
Wybór odcienia będzie miał ogromny wpływ na odbiór projektu. Blade odcienie są 
zwykle relaksujące i uspokajające. Jaskrawe odcienie mogą dawać efekt energetyzujący 
i odświeżający. Ciemne odcienie doskonale nadają się na strony korporacyjne oraz takie, 
na których zależy nam na uzyskaniu efektu siły i wiarygodności.

FIOLETOWY (KOLOR POŚREDNI)

Fioletowy od dawna jest kojarzony z monarchią (lub jest uznawany za kolor królewski). 
Powstaje w wyniku połączenia czerwonego z niebieskim i przejmuje cechy ich obu. 
Symbolizuje kreatywność i wyobraźnię.

Rysunek 7.8. Różne odcienie niebieskiego wywołują szerokie spektrum emocji

W Tajlandii fi olet jest kolorem żałoby dla wdów. Kolory ciemnego fi oletu są tradycyjnie 
kojarzone z bogactwem i monarchią, podczas gdy jasne fi olety (jak lawendowy) są uważane 
za romantyczne.

Rysunek 7.9. Fioletowy symbolizuje bogactwo i monarchię (królewskość)

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

87

W projektowaniu ciemne fi olety dają poczucie bogactwa i luksusu. Jasne fi olety są 
łagodniejsze i kojarzą się z wiosną i romantyzmem.

KOLORY NEUTRALNE

Kolory neutralne są stosowane w projektowaniu jako tło. Zwykle są łączone z jaśniejszymi 
akcentami kolorystycznymi. Mogą być używane samodzielnie i tworzyć wyszukane układy. 
Kolory otaczające wpływają na nastrój kolorów neutralnych w większym stopniu niż na 
kolory ciepłe lub zimne.

CZARNY

Czarny jest najsilniejszy ze wszystkich kolorów neutralnych. W pozytywnym znaczeniu 
kojarzy się z mocą, elegancją i formalnością. W negatywnym ze złem, śmiercią i tajemnicą. 
W wielu krajach zachodnich czarny jest tradycyjnym kolorem żałoby. W niektórych 
kulturach jest również kojarzony z buntem, Halloween i okultyzmem.

Rysunek 7.10. Kolory neutralne mogą dodać smaku projektowi

Czarny stosuje się często w ostrych, jak i eleganckich projektach. W zależności od 
kolorów otaczających może być zarówno konserwatywny, jak i nowoczesny, tradycyjny 
lub niekonwencjonalny. W projektowaniu czarny stosowany jest w typografi i lub innych 
funkcjonalnych elementach z uwagi na swoją neutralność. Czarny wywołuje uczucia 
wyrafi nowania oraz tajemniczości.

Rysunek 7.11. Czarny budzi zarówno dobre, jak i złe skojarzenia

background image

ROZDZIAŁ 7

88

BIAŁY

Biały jest przeciwieństwem czarnego i tak jak on dobrze współgra z innymi kolorami. 
Często symbolizuje niewinność, czystość oraz cnotę. Na Zachodzie kolor biały jest noszony 
przez panny młode w dniu ślubu. Jest również kojarzony z ochroną zdrowia, zwłaszcza 
z lekarzami, pielęgniarkami i dentystami. Biały jest symbolem dobra — aniołowie są często 
przedstawiani w białej sukni.

Rysunek 7.12. Biały symbolizuje niewinność oraz czystość

W projektowaniu biały kolor używany jest jako naturalne tło nadające innym kolorom 
mocniejszego wyrazu. Kojarzy się z czystością i prostotą oraz jest bardzo popularny 
w minimalistycznych projektach. Biały symbolizuje zarówno zimę, jak i lato w połączeniu 
z motywami dekoracyjnymi oraz innymi kolorami.

SZARY

Szary jest kolorem neutralnym, często kojarzony jest z końcem widma kolorów zimnych. 
Może symbolizować nastrojowość lub depresję. W niektórych projektach jasnoszary 
stosowany jest zamiast białego, a ciemnoszary w miejsce czarnego.

Rysunek 7.13. Szary może być depresyjny, ale również nowoczesny lub wyszukany

Szary jest najczęściej uważany za konserwatywny i ofi cjalny, ale również nowoczesny. 
Czasami jest używany jako kolor symbolizujący żałobę. Najczęściej stosuje się go 
w projektach biznesowych, tam, gdzie potrzebny jest profesjonalizm oraz formalność. 

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

89

Czyste szarości są odcieniami czarnego, jednak mogą też mieć ciemnoniebieski lub brązowy 
odcień. W projektowaniu szary stosuje się jako tło oraz do typografi i.

BRĄZOWY

Brązowy kojarzy się z ziemią, drewnem oraz kamieniami. Jest kolorem całkowicie 
naturalnym oraz ciepłym neutralnym. Brązowy może symbolizować niezawodność 
i wiarygodność, wytrwałość i przyziemność. Może być również uznany za nudny.

W projektowaniu brązowy używany jest najczęściej jako kolor tła. Czasami spotykany 
w teksturach drewna oraz kamieni. Daje poczucie ciepła i żywotności projektu. W swoich 
najciemniejszych odcieniach często stosowany jest zamiast czarnego, jak również jako kolor 
tła oraz czcionki.

BEŻOWY I JASNOBRĄZOWY

Beżowy jest dość wyjątkowym kolorem, ponieważ przyjmuje barwy zimne lub ciepłe 
w zależności od kolorów, jakie go otaczają. Jest cieplejszy od brązowego oraz zimniejszy od 
białego i podobnie jak brązowy może być uważany za nudny. W większości przypadków 
jest uważany za kolor konserwatywny, zazwyczaj zarezerwowany dla tła. Symbolizuje także 
pobożność.

Rysunek 7.14. Brązowy może reprezentować materiały naturalne: kamienie, drewno oraz ziemię

Rysunek 7.15. Beżowy może być zimny lub ciepły, w zależności od kolorów, jakie go otaczają

background image

ROZDZIAŁ 7

90

Beżowy jest najczęściej używany jako tło, często imitujące papier. Przybiera cechy kolorów 
go otaczających, minimalizując swój wpływ na projekt.

KREMOWY I KOŚĆ SŁONIOWA

Kremowy i kość słoniowa są kolorami wyszukanymi. Występują w odcieniach ciepłego 
brązu oraz chłodnej bieli. Są łagodne, kojarzą się z historią. Kość słoniowa to kolor spokojny, 
jego niektóre jaśniejsze odcienie kojarzone są z czystością bieli, lecz są od niej nieco 
cieplejsze.

Rysunek 7.16. Kość słoniowa i kremowy są łagodne i działają uspokajająco

W projektowaniu kość słoniowa dodaje elegancji i spokoju. W połączeniu z naturalnymi 
kolorami, takimi jak brzoskwinia lub brąz, może kojarzyć się z naturą. Może być użyta do 
rozjaśnienia ciemniejszych kolorów zamiast zbyt mocno kontrastującego białego.

W SKRÓCIE

Informacje przedstawione w tym artykule mogą wydawać się nieco przytłaczające, 
ale w rzeczywistości teoria koloru jest niczym innym jak opisem tego, jakie uczucia 
wywoływane są przez poszczególne odcienie. Poniżej znajduje się krótkie zestawienie 
najbardziej popularnych znaczeń kolorów.

Czerwony 

Pasja, miłość, złość

Pomarańczowy 

Energia, szczęście, witalność

Żółty 

Szczęście, nadzieja, oszustwo

Zielony 

Nowy początek, urodzaj, natura

Niebieski 

Spokój, odpowiedzialność, smutek

Fioletowy 

Kreatywność, królewskość, bogactwo

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

91

Czarny 

Tajemniczość, elegancja, zło

Szary 

Nastrojowy, konserwatywny, ofi cjalny

Biały 

Niewinność, czystość, cnota

Brązowy 

Naturalny, zdrowotny, rzetelny

Jasnobrązowy lub beżowy 

Konserwatywny, pobożny, nudny

Kremowy lub kość słoniowa 

Spokojny, elegancki, czysty

TRADYCYJNE PALETY BARW

W literaturze fachowej można znaleźć mnóstwo wzorców schematów kolorów, które mogą 
być pomocne dla początkujących. W kolejnych podrozdziałach znajdziesz opis tradycyjnych 
palet oraz kilka ich przykładów.

Rysunek 7.17. Podstawowe dwunastoelementowe koło barw jest ważnym narzędziem w tworzeniu własnej palety

background image

ROZDZIAŁ 7

92

MONOCHROMATYCZNA

Paleta monochromatyczna składa się z różnych odcieni poszczególnego koloru. Jest ona 
najprostszym do utworzenia schematem kolorów, ponieważ cała składa się z tej samej barwy 
i trudno tutaj uzyskać jakiś drażniący i brzydki zestaw (choć jest to możliwe).

Poniżej znajdują się trzy przykłady palet barw monochromatycznych. W większości tych 
przykładów pierwsza barwa (od lewej do prawej) może zostać użyta jako kolor nagłówków. 
Druga może zostać użyta jako kolor czcionki tekstu lub ewentualnie tła. Trzecia barwa może 
zostać użyta jako tło (lub kolor czcionki, jeśli druga barwa została użyta jako kolor tła). 
Dwie ostatnie barwy mogą zostać użyte jako akcent kolorystyczny lub jako główna tonacja 
elementu grafi cznego.

Rysunek 7.18. Niebieska paleta monochromatyczna

Rysunek 7.19. Jagodowa paleta monochromatyczna

Rysunek 7.20. Złota paleta monochromatyczna

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

93

ANALOGICZNA

Analogiczna paleta barw również jest dość łatwa do utworzenia. Analogiczne palety składają 
się z trzech barw, które leżą obok siebie na dwunastoelementowym kole barw. Najczęściej 
wszystkie analogiczne palety barw mają ten sam poziom chrominancji (nasycenia) (ang. 
chroma level). Używając odcieni, możemy zwiększyć ich atrakcyjność i zaadaptować je do 
naszych potrzeb.

Rysunek 7.21. Tradycyjna analogiczna paleta barw, mimo że wizualnie jest 
dość atrakcyjna, nie jest wystarczająco kontrastowa, aby utworzyć efektowny 
projekt strony internetowej

Rysunek 7.22. Paleta barw oparta na tych samych kolorach co powyżej, 
lecz z użyciem ich bardziej kontrastowych odcieni. Taka paleta lepiej 
pasuje do zastosowania na stronie WWW

Rysunek 7.23. Inny przykład tradycyjnej analogowej palety barw

Rysunek 7.24. Ta paleta jest modyfi kacją poprzedniej pod kątem 
zastosowania na stronie WWW

background image

ROZDZIAŁ 7

94

DOPEŁNIAJĄCA

Paleta dopełniająca jest tworzona z kombinacji kolorów leżących po przeciwnych stronach 
koła barw. W swojej podstawowej postaci składa się tylko z dwóch barw, lecz może być 
również stosowana w formie rozszerzonej, składającej się z różnych odcieni tych dwóch 
podstawowych barw. Ku przestrodze: używanie obok siebie kolorów leżących dokładnie 
po przeciwnej stronie koła barw przy tym samym poziomie nasycenia (ang. chroma) może 
dawać drażniący efekt (w skrajnym przypadku będzie to wyglądało, jakby ich granice 
drgały). Aby tego uniknąć, można pozostawić odstęp pomiędzy kolorami lub dodać inny 
kolor przejściowy.

ROZSZERZONA DOPEŁNIAJĄCA

Rozszerzona dopełniająca paleta barw (ang. split complementary) jest prawie tak łatwa 
w użyciu jak paleta dopełniająca. W tym przypadku jednak zamiast barwy znajdującej się po 
przeciwnej stronie koła barw możesz zastosować barwy znajdujące po obu stronach koloru 
podstawowego.

Rysunek 7.25. Tę uniwersalną paletę barw tworzy szeroka gama odcieni

Rysunek 7.26. Kolejny przykład dopełniającej palety barw. Nie zapomnij, 
że kolor beżowy i brązowy są odcieniami pomarańczowego

Rysunek 7.27. W tej palecie zastosowano kolor zielonożółty jako barwę podstawową. 
Najbardziej istotne jest w tym przypadku użycie odpowiednio różnego nasycenia 
i jasności wybranych braw

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

95

TRIADY

Triady (ang. triadic)

 

składają się z barw, które są równomiernie rozmieszczone na całym 

dwunastoelementowym kole barw. To sprawia, że charakteryzują się bardziej żywymi 
kolorami.

Rysunek 7.28. Kolejna paleta barw wykorzystująca różne poziomy nasycenia

PODWÓJNIE DOPEŁNIAJĄCE (TETRADIC)

Paleta barw typu tetriada (ang. tetradic) jest prawdopodobnie najtrudniejsza 
do zastosowania.

Rysunek 7.29. Użycie bardzo jasnej lub ciemnej odmiany danego koloru z triady obok 
różnych odcieni dwóch innych barw sprawia, że kolor ten wygląda zupełnie neutralnie

Rysunek 7.30. Alternatywnie, połączenie bardzo jaskrawej barwy z barwami 
stonowanymi spowoduje, że ta jaskrawa będzie się bardziej wyróżniać

Rysunek 7.31. Raczej niepozorna paleta. Najlepsze palety tego typu bazują 
na jednym podstawowym kolorze i innych, użytych jedynie jako akcenty

background image

ROZDZIAŁ 7

96

NIESTANDARDOWE

Niestandardowe schematy kolorów są najtrudniejsze do tworzenia. Trzeba zrezygnować 
ze wszystkich formalnych zasad, aby nie kopiować palet omówionych w poprzednich 
punktach. Podczas tworzenia niestandardowych palet kolorów miej na uwadze nasycenie 
i jasność barwy.

Rysunek 7.32. Tetriady z kolorami o podobnym nasyceniu i jasności wyglądają 
lepiej. Dodaj tylko jakiś neutralny kolor (np. ciemnoszary lub czarny) na tekst 
lub akcenty

Rysunek 7.33. Ta paleta wygląda równie dobrze w ciemniejszych odcieniach

Rysunek 7.34. Wszystkie kolory w tym przykładzie mają taki sam 
poziom nasycenia

Rysunek 7.35. Również w tym przypadku użycie kolorów o tym samym 
nasyceniu jest efektowne i wywołuje wrażenie równowagi

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

97

TWORZENIE PALET BARW

Tworzenie własnych palet barw może wydać się zadaniem nieco przerażającym. Nie jest 
to jednak tak skomplikowane, jak się wydaje. Za pomocą kilku prostych zabiegów możesz 
stworzyć zupełnie od podstaw naprawdę wspaniałe palety barw.

Zaprezentowaliśmy wiele różnych typów palet barw. Teraz spróbujmy stworzyć kilka 
swoich. W internecie możesz znaleźć mnóstwo narzędzi, które Ci to ułatwią, ale na początek 
wykorzystamy jedynie Photoshopa.

Odejdźmy na moment od tych wszystkich standardowych palet barw opisanych powyżej 
i stwórzmy swoją własną. Mając już wiedzę na temat oddziaływania kolorów i tworzenia 
tradycyjnych palet barw, w większości projektów prawdopodobnie nie będziesz 
wykorzystywać wzorców barwnych pasujących idealnie do jakiejś defi nicji.

Na potrzeby tego artykułu utworzymy zestaw trzech palet kolorów dla dwóch różnych 
stron WWW. Naszymi wymyślonymi klientami będą blog o nowoczesnej architekturze oraz 
sprzedawca wysokiej klasy odzieży damskiej, zainspirowanej stylem wiktoriańskim.

Rozpoczniemy od podstawowej palety monochromatycznej. Podczas gdy tradycyjne palety 
barw nie są zbyt często stosowane w projektowaniu, akurat monochromatyczne stanowią 
wyjątek. Prawdopodobnie będziesz z nich korzystać dość regularnie.

Oto tradycyjny system monochromatyczny dla naszego sklepu odzieżowego, z dodanym 
z białym kolorem w charakterze barwy neutralnej.

Rysunek 7.36. Inną ciekawą propozycją jest zastosowanie jednego koloru 
o wysokim poziomie nasycenia w otoczeniu innych kolorów o niskim 
poziomie nasycenia (kolor o najwyższym nasyceniu jest użyty jako akcent)

background image

ROZDZIAŁ 7

98

Strona WWW naszego bloga poświęconego architekturze będzie wykorzystywała odcienie 
szarości.

Rysunek 7.37. Podstawowa paleta monochromatyczna na stronę sklepu odzieżowego

Rysunek 7.38. Paleta monochromatyczna dla bloga o projektowaniu 
nowoczesnej architektury

Kolejna paleta barw jest prawie paletą analogiczną, z jednym dodatkowym kolorem. Składa 
się ona z odcieni fi oletu z dodatkowym kolorem czerwonofi oletowym. Te dwa kolory leżą 
obok siebie na kole barw i dobrze ze sobą współgrają, szczególnie kiedy mają różne poziomy 
nasycenia oraz jasności.

Rysunek 7.39. Uzupełnienie palety o fi oletowe kolory

Dodanie dwóch odcieni czerwieni do naszej szarej kolorystyki spowoduje zwiększenie 
wizualnej atrakcyjności projektu i da możliwość zaakcentowania niektórych części projektu.

Rysunek 7.40. Dodanie czerwonego zwiększa wizualną atrakcyjność

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

99

W następnym kroku pozbyliśmy się fi oletowego i zastąpiliśmy go burgundem. Jak 
poprzednio, jest to kolor leżący na kole barw obok czerwonofi oletowego. Dodaliśmy 
również odcień jasnożółty, który leży po przeciwnej stronie koła barw. W naszej palecie 
pełni on rolę barwy neutralnej i w porównaniu do innych barw mocno kojarzy się z bielą.

Następny schemat kolorów na pierwszy rzut oka wygląda jak kolejna szara i czerwona paleta 
standardowa. Jednak te szarości są w rzeczywistości odcieniami niebieskiego. Niebieski 
i czerwony tworzą dwie trzecie tetriady. Bez żółtego dobrze ze sobą współgrają, zwłaszcza 
gdy czerwony jest czysty, a błękit stonowany do prawie szarego.

Rysunek 7.41. Użycie koloru burgund

DLACZEGO ODCIENIE SĄ TAK ISTOTNE

Jak widać z powyższej analizy, użycie różnych odcieni kolorów jest bardzo ważne. Czyste 
barwy mają podobne poziomy nasycenia oraz jasności. Tak skonstruowana paleta barw 
będzie przytłaczająca, ale też i nudna.

Gdy połączysz odcienie z barwami, rozwiniesz podstawowe dwunastoelementowe koło barw 
w nieskończoną liczbę możliwych kolorów. Jednym z najłatwiejszych sposobów zbudowania 
profesjonalnie wyglądającego schematu kolorów jest wybranie kilku odcieni danego koloru 
(należy unikać czystej barwy podstawowej) i dodanie do tego jako akcentu kolorystycznego 
czystej barwy (lub prawie czystej), która znajduje się przynajmniej trzy pozycje dalej na kole 
barw (będzie to część standardowej palety: triady, tetriady lub rozszerzonej dopełniającej). 
Takie rozwiązanie sprawi, że schemat będzie wizualnie ciekawy, a jednocześnie zachowa 
równowagę.

Rysunek 7.42. Dodanie do szarości odrobiny niebieskiego

background image

ROZDZIAŁ 7

100

DODAWANIE KOLORÓW NEUTRALNYCH

Kolory neutralne są kolejnym ważnym elementem w projektowaniu palet barw. Szary, 
czarny, biały, brązowy, jasnobrązowy oraz barwy zbliżone do bieli są zawsze uważane 
za kolory neutralne. Ocieplają one paletę barw (ponieważ tak naprawdę są odcieniami 
koloru pomarańczowego lub żółtego). Kolor szary nabiera ciepłego lub chłodnego wyrazu 
w zależności od kolorów go otaczających. Czarny i biały również przybierają ciepły lub 
zimny charakter w zależności od kolorów, z jakimi sąsiadują.

Rysunek 7.43. Zastosowanie jaskrawego koloru do zmiany efektu zestawu 
neutralnego

Czarny i biały są najbardziej oczywistymi kolorami neutralnymi, jakich można użyć do 
skonstruowania każdej palety barw. Lecz aby polepszyć efekt wizualny, zamiast stosowania 
czystych kolorów warto zamienić je na bardzo jasny lub bardzo ciemny odcień szarości.

Dodawanie brązów, jasnych brązów oraz pochodnych bieli jest już odrobinę trudniejsze, 
ale wraz z nabieraniem doświadczenia i tę umiejętność uda Ci się opanować. W przypadku 
brązów można użyć bardzo ciemnego czekoladowego brązu zamiast czarnego. Blade kolory 
(zbliżone do bieli) w wielu przypadkach mogą zastąpić biały lub jasnoszary. Szary możesz 
zastąpić też jasnobrązowym — aby było prościej, dodaj trochę szarości do barwy brązowej.

NAJŁATWIEJSZE W UŻYCIU PALETY BARW

Już o tym pisaliśmy: dodanie jasnego, żywego koloru do neutralnej palety jest jednym 
z najłatwiejszych sposobów tworzenia schematów kolorów. Jest to również jedno 
z najbardziej efektownych rozwiązań. Jeżeli nie jesteś pewien swoich umiejętności w zakresie 
tworzenia własnych schematów kolorów, zacznij od palet tego typu.

Poniżej znajdziesz kilka przykładów.

background image

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

101

Rysunek 7.44.

 

Użycie brązów zamiast szarości powoduje ocieplenie całego 

schematu nawet pomimo niebieskiego akcentu

background image

ROZDZIAŁ 7

102

W tego typu paletach zamiast szarego oraz brązowego można użyć dowolnego odcienia 
innego koloru, ale w celu zachowania efektu należy trzymać się bliżej szarego koloru 
w widmie. Zgodnie z ogólną zasadą zimne oraz czyste szarości najlepiej pasują do 
nowoczesnych projektów, natomiast ciepłe szarości oraz brązy do projektów tradycyjnych.

ILU KOLORÓW UŻYĆ?

Zapewne zauważyłeś, że we wszystkich przykładach w tym rozdziale używaliśmy palet 
barw z pięcioma różnymi kolorami. Piątka wydaje się dobrą liczbą: daje wiele możliwości 
zilustrowania omawianych w tym rozdziale koncepcji oraz wystarczającą liczbę kolorów 
do projektu. W zależności od potrzeb możesz jednak użyć więcej lub mniej kolorów.

Wiele stron WWW wykorzystuje tylko trzy kolory. Inne tylko dwa. A jeszcze inne mogą 
mieć osiem lub dziesięć (co jest już dość ryzykowne). Eksperymentuj i dobieraj tyle kolorów, 
ile potrzebujesz. Jednak dobrze jest rozpocząć pracę z paletą pięciu kolorów, a potem je 
dodawać lub odejmować w trakcie pracy.

Najłatwiejsza metoda wyboru kolorystyki na stronę WWW polega na rozpoczęciu pracy ze 
zdefi niowaną z góry tradycyjną paletą barw. Pozwoli to na uzyskanie bezpiecznego punktu 
wyjścia do dalszej pracy.

PODSUMOWANIE

Tak naprawdę w tym rozdziale jedynie lekko dotknęliśmy teorii barw. Specjaliści 
z tej dziedziny spędzają dosłownie lata na szlifowaniu swoich umiejętności doboru 
odpowiednich kolorów do konkretnych potrzeb.

Najlepszym sposobem na to, żeby nauczyć się, jak tworzyć piękne schematy kolorów, jest po 
prostu praktyka. Twórz palety kolorów każdego dnia. Możesz rozpocząć od użycia gotowych 
narzędzi lub zwyczajnie uruchomić Photoshopa i działać. Jeśli natrafi sz na jakiś szczególnie 
piękny lub uderzający kolor, spróbuj na jego bazie stworzyć swoją paletę barw.

Skorzystaj z jednej z wielu dostępnych w internecie aplikacji WWW pozwalających na 
przechowywanie palet barw i zarządzanie nimi. Stworzenie swojej własnej biblioteki jest 
praktyczne i przyda Ci się na przyszłość.

Cameron Chapman jest profesjonalną projektantką stron WWW oraz grafi kiem 
komputerowym z ponadsześcioletnim doświadczeniem. Pisze na wielu blogach, w tym na 
swoim własnym: Cameron Chapman On Writing (Cameron Chapman o literaturze). Jest 
również autorką 
Internet Famous: A Practical Guide to Becoming an Online Celebrity 
(Popularność w internecie: praktyczny poradnik o tym, jak zostać celebrytą online).

background image

R

O

ZDZIAŁ

 8

8

CZY TWÓJ KLIENT 

JEST TĘPY, CZY TEŻ 

PROBLEM LEŻY 

PO TWOJEJ STRONIE?

Paul Boag

POZNAJ JANKA, NASZEGO KLIENTA.

 Janek posiada sporej wielkości stronę WWW. 

Jest marketingowcem uważającym się za inteligentnego, wygadanego i profesjonalnego. 
Mimo to nie wie prawie nic na temat projektowania WWW, potrzebuje więc naszej pomocy. 
Janek przygotował listę celów biznesowych i poprosił o wycenę. Jednak to, co się dzieje, 
wprowadza Janka w zakłopotanie oraz wywołuje w nim frustrację i skrajne niezadowolenie.

background image

ROZDZIAŁ 8

104

WYJAŚNIJ, DLACZEGO PYTASZ O PIENIĄDZE

Przed ujawnieniem Jankowi wyceny prosisz o więcej szczegółów na temat projektu. Po kilku 
chwilach dyskusji pytasz go o budżet. Wydaje Ci się, że to uczciwe pytanie. W końcu 
w zależności od dostępnej kwoty ten sam problem można rozwiązać na wiele sposobów.

Bez znajomości budżetu nie masz możliwości ocenić, od czego masz zacząć. Uważasz, 
że budowanie strony WWW niewiele różni się od budowania domu. Nie znając budżetu, 
nie możesz określić liczby pokojów, na które stać klienta, ani materiałów, z jakich dom 
będzie budowany.

Janek natomiast od razu staje się podejrzliwy. Dlaczego chcesz znać jego budżet? Jedyny 
powód, jaki mu przychodzi do głowy, to taki, że wystawisz mu dokładnie taki rachunek, 
na jaki go stać. Ale w rzeczywistości on nie zna swojego budżetu. Skąd ma wiedzieć, 
ile powinna kosztować strona WWW?

Janek wychodzi zdecydowany znaleźć projektanta, który nie będzie próbował go 
wykorzystać. Na szczęście dla Ciebie wszyscy inni projektanci też nie chcieli wytłumaczyć 
mu, dlaczego potrzebują znać budżet, więc w końcu udało Ci się wygrać to zlecenie.

UZASADNIJ SWOJE ZALECENIA JĘZYKIEM, 
KTÓRY ZROZUMIE KLIENT

Gdy już zdobyłeś zlecenie, zdecydowałeś się zorganizować spotkanie, na którym planujesz 
omówić najważniejsze działania. To jednak powoduje, że Janek zaczyna żałować, że 
Cię wynajął, ponieważ sprawdzają się jego najgorsze oczekiwania. W jego oczach nagle 
próbujesz wycisnąć z niego więcej pieniędzy, skoro zdecydowałeś się na kazania na temat 
użyteczności i dostępności. Jankowi nie zależy na niepełnosprawnych użytkownikach. 
Nie spodziewa się, że tego typu użytkownicy zechcą odwiedzić jego stronę.

A jeśli chodzi o użyteczność, to przecież oczywiste, że zadanie projektanta polega właśnie 
na tym, żeby strony WWW dawało się używać. Kto potrzebuje testów użyteczności? Janek 
jest zupełnie pewny, że testy użyteczności wymagają zastosowania kosztownych narzędzi, 
jak kamery, laboratoria i lustra weneckie. Wydaje Ci się, że wystarczająco jasno wyjaśniłeś 
te kwestie. W końcu wspomniałeś o WCAG 2 i Jakobie Nielsenie. Zaczynasz podejrzewać, 
że Janek nie jest szczególnie bystry.

Być może gdybyś wspomniał o dostępności z punktu widzenia rankingu wyszukiwarek, 
a o testach użyteczności jako o narzędziach zwiększenia liczby ponownych wizyt na stronie, 
Janek chciałby słuchać uważniej. Kończy się jednak na tym, że klient stawia sprawę twardo 
i nie chce płacić za te „zbędne ekstrasy”.

background image

CZY TWÓJ KLIENT JEST TĘPY, CZY TEŻ PROBLEM LEŻY PO TWOJEJ STRONIE?

105

WŁĄCZ KLIENTA W PROCES

Wychodzisz ze spotkania zadowolony, że masz podpisany kontrakt. Ale masz przeczucie, 
że to może być jeden z tych nieudanych projektów. Ignorujesz to i próbujesz zachować 
optymizm, rzucając się w wir procesu. Prawie natychmiast otrzymujesz telefon od Janka 
z pytaniem, czy masz już coś do pokazania. Tłumaczysz, że to na razie za wcześnie i że nie 
jesteś jeszcze gotów czegokolwiek pokazać. Janek wycofuje się z rozczarowaniem w głosie.

Niedługo potem jesteś gotów zaprezentować Jankowi swój projekt. Jesteś zadowolony 
z wyniku. Zajęło to więcej czasu, niż było założone, ale było tego warte. Ostateczny projekt 
będzie niezwykle łatwy w użyciu i stanowi dla Ciebie doskonałą pozycję w portfolio.

Gdy Janek zobaczył projekt, był przerażony. Z jego punktu widzenia zupełnie 
nie zrozumiałeś, o co chodziło. Projekt nie jest kompatybilny z jego materiałami 
marketingowymi do druku i nie uderza w odpowiednie cele rynkowe. Jest też przekonany, 
że nie spodoba się jego dostawcom, i chociaż nie są oni jego klientami, ich opinia ma dla 
Janka znaczenie.

Po nerwowej telekonferencji czujesz się pokonany, ale udało się osiągnąć kompromis, który 
powinien uszczęśliwić Janka. Zastanawiasz się, czy nie lepiej byłoby wcześniej pokazać 
Jankowi swoich wstępnych pomysłów i szkiców. Być może najpierw powinniście byli 
uzgodnić szkielet projektu.

EDUKUJ KLIENTA 
W ZAKRESIE PROJEKTOWANIA

Po dużej ilości ciężkiej pracy, walki i kompromisów znów jesteś gotów zaprezentować 
wyniki Jankowi. Tym razem jest znacznie bardziej zadowolony i uważa, że zmierzacie 
w dobrym kierunku. Jednak ma kilka wątpliwości. Po pierwsze, większość podstron wymaga 
przewijania, ale po bokach jest znaczna ilość pustego miejsca. Żąda, żeby najważniejsze 
informacje przenieść w to niewykorzystane miejsce. Zauważa też, że większość jego 
klientów to młodzi ludzie płci męskiej, a projekt jest nieco zniewieściały, zleca zatem zmianę 
kolorystyki na niebieską.

Po rozmowie Janek czuje się nieco bardziej zadowolony, za to Ty jesteś zdruzgotany. Czujesz 
się, jakby próbował uczyć Cię wykonywania Twojej pracy. Instrukcje przeniesienia treści 
w inne miejsce czy zmiany koloru na inny powodują, że czujesz się sprowadzony do roli 
bezmyślnego narzędzia.

background image

ROZDZIAŁ 8

106

W tym momencie jesteś już pewny, że klient jest tępy, i zależy Ci tylko na podpisaniu 
protokołu przekazania projektu. W żadnym momencie jego realizacji nie przyszło Ci do 
głowy, aby zapytać Janka o powody decyzji dotyczących zmian. Być może gdybyś zrozumiał 
jego rozumowanie, mógłbyś wytłumaczyć koncepcje rozdzielczości ekranu i zasugerować 
alternatywę dla „korporacyjnego niebieskiego”, który jest tak nadużywany na stronach 
WWW. Zamiast tego umywasz ręce i dajesz Jankowi to, czego żąda.

REGULARNIE KOMUNIKUJ SIĘ 
Z KLIENTEM

Projekt jest gotowy, przechodzisz zatem do budowania strony. Janek na pewno nie będzie 
wtrącał się do kodu, nareszcie możesz robić rzeczy tak, jak należy.

To wielkie zadanie i zajmuje dużo czasu. Mimo że poświęciłeś go projektowi za dużo, 
a na końcu umyłeś od niego ręce, nadal masz swoją dumę. Nie masz zamiaru oszukiwać 
na jakości kodu. W końcu jakiś inny projektant mógłby do niego zajrzeć i wyrobić sobie 
negatywną opinię na Twój temat!

Pracujesz naprawdę ciężko, ponownie wkładając w to więcej pracy, niż powinieneś. Jankowi 
udaje się nawet przemycić nieco dodatkowych funkcji przy okazji demonstracji etapu 
pośredniego, które okazują się prawdziwą udręką.

W tym momencie Janek zastanawia się, co się dzieje. Nie miał od Ciebie żadnych informacji 
od miesięcy. Strona powinna już być chyba gotowa? Decyduje się wysłać Ci e-maila 
z pytaniem o postęp prac. Odpowiadasz krótkim e-mailem informującym, że wszystko idzie 
gładko. Nigdy nie lubiłeś zarządzania projektem i jesteś przekonany, że Janek wolałby, abyś 
budował jego stronę, a nie pisał szczegółowe raporty.

Janek otrzymuje wiadomość i zaczyna poważnie się frustrować. Co to znaczy: „Idzie 
gładko”? Odpisuje z żądaniem podania ostatecznej daty ukończenia, odsyłasz mu zgrubne 
oszacowanie.

Termin przemija bez słowa z Twojej strony. W końcu to było tylko oszacowanie, a po drodze 
pojawiło się kilka komplikacji, które spowodowały kilkudniowe opóźnienie. Janek w końcu 
traci cierpliwość i dzwoni do Ciebie. Informuje, że z datą oddania projektu zsynchronizował 
kampanię reklamową, a skoro nie otrzymał żadnych informacji, uznał, że wszystko 
postępowało zgodnie z terminarzem.

background image

CZY TWÓJ KLIENT JEST TĘPY, CZY TEŻ PROBLEM LEŻY PO TWOJEJ STRONIE?

107

Bronisz się tym, że w trakcie realizacji pojawiały się nowe wymagania, a także 
niespodziewane przeciwności. Tłumaczenie jednak nie jest łatwe, gdy Janek stwierdza: 
„Wystarczyłby mi jeden e-mail na tydzień z informacją na temat postępu prac”.

WYTŁUMACZ KLIENTOWI JEGO ROLĘ

W tym momencie relacja z klientem kompletnie się psuje. Kończysz pracę, strona WWW 
ma swoją premierę. Janek z niezadowoleniem płaci za fakturę, zwlekając tak długo, 
jak pozwalają na to przepisy. Ale najbardziej zdumiewa Cię stwierdzenie Janka, że jest 
kompletnie niezadowolony z wyniku. Jak to możliwe, skoro dałeś mu dokładnie to, 
o co prosił? On nie jest tępy, to po prostu idiota!

Oczywiście Janek postrzega sytuację zgoła inaczej. Zgłosił się do Ciebie z listą priorytetów 
biznesowych, a strona nie realizowała ani jednego z nich. Miał nadzieję, że po premierze 
będzie obserwował, jak strona daje spodziewane efekty, co pozwoli mu spokojnie przejść 
do kolejnych przedsięwzięć. Zamiast tego po początkowym skoku zainteresowania liczba 
użytkowników i zapytań zaczęła spadać, a strona popadła w stagnację.

Janek nie zdaje sobie sprawy z tego, że strony WWW wymagają ciągłej miłości i wsparcia. 
Nie można po prostu zbudować strony, po czym zostawić ją samej sobie. Janek musi ją 
pielęgnować, dodając nowe treści, angażując gości i planując zmiany i udoskonalenia. 
Wiedziałby o tym, gdyby tylko ktoś mu powiedział…

MORAŁ

To zdumiewające, jak łatwo przychodzi nam oceniać naszych klientów. Jako projektanci 
WWW zawodowo zajmujemy się tworzeniem przekazów werbalnych i emocjonalnych. 
Nasza praca polega na budowaniu platform komunikacji między naszym klientem a jego 
użytkownikami. Tworzymy użyteczne strony WWW, stawiając się na miejscu naszych 
użytkowników, co pozwala nam projektować w oparciu o ich potrzeby.

Dlaczego zatem tak często nie potrafi my komunikować się z naszym klientem? Być może 
nadszedł czas na zastosowanie umiejętności, które kultywujemy jako projektanci stron 
WWW, do prowadzenia dialogu z naszymi klientami?

Paul Boag jest założycielem agencji Headscape (Wielka Brytania), autorem Website Owners 
Manual i gospodarzem nagradzanego podcastu Boagworld.

background image
background image

R

O

ZDZIAŁ

 9

9

W JAKI SPOSÓB 

RADZIĆ SOBIE 

Z RÓŻNYMI 

TYPAMI KLIENTÓW

Robert Bowen

W BIZNESIE ZMYSŁ 

rozpoznawania charakterów ludzi i umiejętność odpowiedniego 

postępowania z nimi są nie do przecenienia. Potrafi ą zamienić spotkanie z klientem w szansę 
przewidzenia przyszłości projektu albo ustalenia sposobu jego prowadzenia. To jeden 
z najistotniejszych elementów owocnych profesjonalnych układów.

We współczesnym, cyfrowym świecie komunikacja przeniosła się do sieci WWW i innych 
nowinek technologicznych, przez co większość profesjonalistów rzadziej decyduje się na 
bezpośrednie spotkania. Rozpoznanie osobowości klienta w rozmowie online nie jest łatwym 
zadaniem, tym bardziej staje się więc istotnym elementem w arsenale projektanta twórcy 
stron WWW.

W pracy freelancera spotkasz kilka typów klientów. Umiejętność zidentyfi kowania ich 
pozwala zastosować właściwą strategię, aby zmaksymalizować skuteczność interakcji oraz 
zachować zimną krew. Poniżej przedstawiamy listę najczęściej spotykanych typów osobowości 
klientów, symptomy identyfi kujące każdy z typów, a także sugestie dotyczące radzenia sobie 
z nimi.

background image

ROZDZIAŁ 9

110

TYP PASYWNO-AGRESYWNY

Klient tego typu jest bardzo pasywny, jeśli chodzi o przekazywanie informacji wstępnych, 
ale po oddaniu produktu końcowego atakuje nas, żądając szczegółowych modyfi kacji, 
zarówno drobnych, jak i gruntownych. Przez cały czas wiedział, czego oczekuje, ale trzymał 
tę wiedzę dla siebie. Choć potrafi  docenić niektóre z pomysłów i elementów w trakcie 
procesu tworzenia strony, nie oczekuj od typu pasywno-agresywnego tego, że będzie o nich 
pamiętać, gdy prześle Ci ocenę gotowego produktu.

IDENTYFIKACJA

 



Na pierwszych etapach tworzenia strony komunikacja jest głównie jednostronna 
i mało pomocna.





Zgłasza uwagi typu:

 

Š

„Nie jestem pewny, czego szukam”;

 

Š

„Po prostu zrób coś, co nam się ogólnie spodoba”;

 

Š

„Chcieliśmy coś zupełnie innego niż to, co zrobiłeś”.

JAK SOBIE RADZIĆ

Cierpliwość jest kluczowa. Jeśli będziesz się spodziewał zmian na ostatnią chwilę, łatwiej 
Ci będzie przetrwać impet agresywnego zachowania klienta. Stosuj wielowarstwowy 
projekt, żeby bez problemu wprowadzić poprawki (to dość uniwersalna porada, nie tylko 
w przypadku klientów tego typu). Zadbaj o to, aby umowa defi niowała ograniczoną liczbę 
zmian projektu.

PRZYJACIEL RODZINY

Ten klient jest Ci znany od wielu lat, osobiście lub na skutek powiązań rodzinnych. 
Zlecenie wynikło właśnie dzięki tego typu nieformalnym powiązaniom. Taka przyjaźń 
zostanie poddana poważnemu testowi, a często zdruzgotana z powodu negatywnego 
wpływu, jaki tego typu sytuacja może mieć na projekt. Przyjaciel rodziny uważa, że należą 
mu się „specjalne” ceny albo nieograniczona ilość czasu. Czasem również nieumyślnie 
będzie umniejszać Twoją pracę albo traktować ją mało poważnie, ponieważ zna Cię od 
nieprofesjonalnej strony.

background image

W JAKI SPOSÓB RADZIĆ SOBIE Z RÓŻNYMI TYPAMI KLIENTÓW

111

IDENTYFIKACJA

 



Klientów tego typu łatwo rozpoznać, ponieważ… po prostu dobrze ich znasz.

 



Zgłaszają uwagi typu:

 

Š

„Możesz zrobić coś na szybko specjalnie dla mnie?”;

 

Š

„Nie chcę, żebyś myślał, że robimy ten interes tylko dlatego, że się znamy”;

 

Š

„Aż tyle? Przecież znamy się od wieków!”.

JAK SOBIE RADZIĆ

Sposób radzenia sobie z klientami tego typu zależy od tego, od jak dawna ich znasz 
i jak bardzo zależy Ci na dobrych relacjach z nimi. Pamiętaj jednak, że jeśli ktoś 
próbuje wykorzystać tego typu relację, tak naprawdę nie jest przyjacielem, zatem reaguj 
odpowiednio do sytuacji. Często przyjaźń udaje się uratować dzięki szczerej postawie. 
Od początku jednak postaraj się zbudować profesjonalną, formalną atmosferę, a istnieje 
szansa, że klient się do niej dostosuje. Jeśli obawiasz się utraty przyjaźni, możesz też 
zdecydować się, aby nie przyjąć zlecenia.

ZANIŻACZ WARTOŚCI

Podobnie jak przyjaciel rodziny, ten typ klienta ma skłonność do umniejszania wartości Twojej 
pracy. Jest jednak zasadnicza różnica: klient tego typu nie zna Cię. Ta skłonność nie ma zatem 
żadnego uzasadnienia. Zaniżacz wartości uważa, że zawsze zasługuje na „przyjacielskie” ceny 
nie dlatego, że chce się z Tobą zaprzyjaźnić, ale dlatego, że po prostu uważa, iż Twoja praca 
nie jest zbyt wiele warta… nawet jeśli nie potrafi łby jej wykonać samodzielnie. Tego typu 
postawa może wynikać z braku wiedzy na temat wartości pracy kreatywnej albo artystycznej. 
Im większe doświadczenie mamy w tej dziedzinie, tym bardziej sprawiamy wrażenie, że nasza 
praca jest lekka, łatwa i przyjemna, i taką widzi ją klient.

IDENTYFIKACJA

 



Nie odpowiada na czas na zadane pytania.

 



Zgłasza uwagi typu:

 

Š

„Przecież dla ciebie to drobnostka”;

 

Š

„Nie mógłbyś zrobić dla mnie czegoś na szybko?”;

 

Š

„Przecież to nie może być trudne do zrobienia”.

background image

ROZDZIAŁ 9

112

JAK SOBIE RADZIĆ

W tym przypadku kluczem jest pewność siebie. Wiesz, jakie są wymagania tej pracy i jak 
dobrze ją wykonujesz. Zaniżacz wartości rozpozna tę pewność siebie. Nie wycofuj się ani 
nie zmieniaj postawy wobec klienta w trakcie trwania projektu. Wytrwałość pozwoli Ci 
stworzyć profesjonalny wizerunek i wymusi szacunek, na który zasługujesz. Jeśli klient 
nie dostosuje się do tej sytuacji, najlepiej zdecyduj się na minimalizację strat i wycofaj się 
z projektu.

PEDANT

Ten klient jest zawsze niezadowolony z efektów pracy i stale czepia się drobnych szczegółów. 
Nie zdziw się, jeśli będzie żądał zmiany ciągle tego samego szczegółu aż do znudzenia. 
To często nie jest efekt braku szacunku (jak w przypadku innych klientów), ale po prostu 
natury klienta. Być może sparzył się w innym projekcie, przez co teraz jest nadmiernie 
ostrożny, wyrażając swój brak zadowolenia z każdej rzeczy, w tym również Twojej pracy.

IDENTYFIKACJA

 



Prawie ciągle narzeka na różne, niezwiązane ze sobą rzeczy.

 



Opinia osobista często jest okraszona nutą złośliwości.





Zgłasza uwagi typu:

 

Š

 „Czy to naprawdę takie trudne, żeby (tu wstaw odpowiednie określenie)”;

 

Š

„Nie jestem pewny tego elementu. Po prostu mi nie pasuje”;

 

Š

„Chyba mnie nie rozumiesz”.

JAK SOBIE RADZIĆ

Również i w tym przypadku istotna jest cierpliwość (szczególnie jeśli masz jakieś 
masochistyczne powody, aby często współpracować z tego typu klientami). Spróbuj nabrać 
dystansu do projektu, aby nie brać do siebie krytyki. W sytuacji gdy Twoja praca jest 
atakowana, łatwo jest poczuć się dotkniętym i zacząć się bronić. Możesz nawet zwątpić 
w swoje umiejętności. Zrozum jednak, że te uwagi nie dotyczą Ciebie czy Twojego talentu, 
to po prostu cecha osoby, z którą masz do czynienia. Na wszelki wypadek jednak zabezpiecz 
się w umowie.

background image

W JAKI SPOSÓB RADZIĆ SOBIE Z RÓŻNYMI TYPAMI KLIENTÓW

113

SKNERA

Ten klient ma cechy podobne do pedanta i zaniżacza, ale w tym przypadku masz do 
czynienia z rzeczywistym docenianiem Twojej pracy i umiejętności. Krytyka jest stosowana 
przede wszystkim do osłabienia Twojej pewności siebie i obniżenia ceny. W przeciwieństwie 
do niektórych innych typów klienta sknera rozumie kreatywnych ludzi i procesy ich pracy. 
Ale ludzie tego typu są po prostu skąpi i skłonni do manipulacji, a ich natarczywość będzie 
tym większa, im bardziej tego typu metody okazały się skuteczne w przeszłości. Z tego 
powodu będą starali się zmanipulować wszystkich swoich kontrahentów w nadziei na 
zaoszczędzenie każdego grosza.

IDENTYFIKACJA

 



Komplementom towarzyszą niekorzystne uwagi.

 



Odpowiedzi na pytania zajmują sporo czasu, to samo pytanie musisz często zadawać 
kilka razy.

 



Zgłasza uwagi typu:

 

Š

 „Jestem naprawdę zadowolony z twojej pracy, mam tylko kilka wątpliwości”;

 

Š

„To nie jest to, czego chciałem, ale jesteś blisko”.

JAK SOBIE RADZIĆ

Również w tym przypadku uratuje Cię pewność siebie. Dobre zrozumienie Twojej 
specjalności i zaufanie do własnej wiedzy i umiejętności pozwolą trzymać manipulacje 
klienta na odpowiedni dystans. Konsekwentne podtrzymywanie własnej opinii, a nawet 
wykorzystanie na kliencie niektórych z jego taktyk pozwolą Ci przechylić szalę na swoją 
stronę. Przygotuj się jednak na rezygnację z projektu, jeśli klient będzie uparcie kontynuował 
swoją strategię lekceważenia i manipulacji. Znajdą się nowe projekty i inni klienci.

ZŁOTA RĄCZKA

Od czego by tu zacząć? Gdy ten klient zaproponuje Ci zlecenie, jednoznacznie da do 
zrozumienia, że doskonale wie, o co chodzi, i mógłby to zrobić sam, a zleca pracę na 
zewnątrz tylko dlatego, że nie ma czasu się w to bawić. Często klienci tego typu pracują 
w większych fi rmach lub są przedsiębiorcami. Twoja rola ma polegać na wypełnieniu 
luki. Jeśli klient jest pracownikiem fi rmy, to może stawiać Cię w interesującej sytuacji. 
Prawdopodobnie został zatrudniony w związku ze swoim stylem lub pomysłami, a teraz 
Twoją rolą będzie zadowolenie dwóch rodzajów odbiorców: osoby, która Cię wynajęła, 
oraz ludzi, którzy wynajęli tę osobę.

background image

ROZDZIAŁ 9

114

IDENTYFIKACJA

 



Sprawia wrażenie osoby zapracowanej i zabieganej.





Komunikacja przyjmuje formę krótkich i gwałtownych potoków informacji.

 



Zgłasza uwagi typu:

 

Š

„Z łatwością zrobiłbym to sam, gdyby mój terminarz nie był taki napięty”;

 

Š

„Jesteś pewny? Nie wiem, czy na twoim miejscu zrobiłbym to samo, 
ale rób, co uważasz”;

 

Š

„Pamiętaj, zostałeś postawiony na moim miejscu, a to niełatwe zadanie”.

JAK SOBIE RADZIĆ

Złota rączka z pewnością potrafi  natychmiast rozpoznać Twój talent i umiejętności, właśnie 
dlatego Cię zatrudnił. Chce po prostu, żebyś wiedział, że ten projekt (a co się z tym wiąże, 
i Ty sam) go nie przerasta. I mimo że takie uwagi będą od czasu do czasu sprowadzać Cię na 
ziemię, klient pozwoli Ci się wykazać, być może czasami zgłaszając swoje uwagi i sugestie 
dotyczące ostatecznego kształtu projektu.

KONTROLER

Klient tego typu czuje się zmuszony do zarządzania każdym, najdrobniejszym szczegółem 
projektu, niezależnie od swoich kwalifi kacji w tym zakresie. Bez jego ofi cjalnej zgody 
nie mogą być podjęte żadne decyzje. Ta męcząca osobowość będzie zmuszać się do 
uczestniczenia w Twoim cyklu pracy, niezależnie od tego, czy została zaproszona, i będzie 
niepomna protestów. Będzie też wymagać Twojej dyspozycyjności na każde żądanie. 
Pojęcia granic i ścisłych procesów pracy są z łatwością naruszane przez kontrolera, który 
będzie stale zaburzać płynność przepływu. Często może się też zdarzać, że kontroler będzie 
wyrażać wątpliwości co do Twojego pełnego poświęcenia sprawie, co tym bardziej utwierdzi 
go w przekonaniu o konieczności sprawowania ścisłej kontroli.

IDENTYFIKACJA



Pierwszy kontakt polega na długim, szczegółowym, jednostronnym wywiadzie, 
z niewielkim miejscem na inicjatywę z Twojej strony.



Twoja opinia nie będzie oczekiwana na żadnym etapie projektu.



Zgłasza uwagi typu:

 

Š

„Będziemy mieć kontakt 24 godziny na dobę, 7 dni w tygodniu, na wypadek, 
gdyby ktoś z nas miał jakieś pytania”;

 

Š

„Ja wiem najlepiej, co jest ważne, a co zbędne dla projektu”;

 

Š

„Co rozumiesz przez to, że ci przeszkadzam? Jestem jedyną siłą,
która powstrzymuje ten projekt przed katastrofą!”.

background image

W JAKI SPOSÓB RADZIĆ SOBIE Z RÓŻNYMI TYPAMI KLIENTÓW

115

JAK SOBIE RADZIĆ

Jeśli nie masz innego wyjścia i jesteś zmuszony zaakceptować klienta tego typu, od razu 
pogódź się z faktem, że nie będziesz miał możliwości sterowania w żadnym momencie 
trwania projektu. Będziesz zmuszony nabrać dystansu do pracy i zaakceptować swój brak 
kontroli. Zostaniesz sprowadzony do roli konstruktora, nie projektanta, dlatego po prostu 
słuchaj zaleceń. Istnieje duża szansa, że zdecydujesz się wyłączyć ten projekt ze swojego 
portfolio.

WYMARZONY KLIENT

Ten typ klienta, często postrzegany w kategoriach mitu, w rzeczywistości istnieje i rozumie 
pełny zakres i wartość merytoryczną oraz artystyczną Twojej pracy. Docenia Twoją rolę 
i kreatywny wkład oraz chętnie oddaje Ci rolę przywódczą już na bardzo wczesnym etapie 
projektu. Na czas odpowiada na pytania i uiszcza opłaty za faktury. Faktury, których nie 
musisz „negocjować”, po prostu akceptuje je takimi, jakie je zgłaszasz. Pozytywnie reaguje 
na Twoje sugestie i ufa Twoim umiejętnościom.

IDENTYFIKACJA

 



Wyraża się z entuzjazmem na temat projektu i Twojego w nim udziału.

 



W komunikacji wyraża świadomość i szacunek dla Twojej roli.

 



 Zgłasza uwagi typu:

 

Š

„Oto krótka lista naszych oczekiwań, reszta należy do ciebie”;

 

Š

„Podoba nam się to, co widzieliśmy, i jesteśmy pewni, że zrobisz dla nas 
doskonałe rzeczy”.

JAK SOBIE RADZIĆ

Nie przechwalaj się! Ciesz się chwilą i staraj się utrzymać takiego klienta za wszelką cenę 
tak długo, jak to tylko możliwe!

PODSUMOWANIE

Umiejętność identyfi kacji typów klientów pozwala dobrze przygotować się do rozpoczynającego 
się projektu. Pomoże też zdecydować, czy w ogóle warto przyjąć zlecenie. Twoja umowa 
z klientem musi odwzorowywać oczekiwaną dynamikę projektu, dlatego im więcej wiesz na jego 
temat, tym lepiej będziesz umiał dostosować kwestie prawne do swoich potrzeb.

Robert Bowen jest dobrze zapowiadającym się autorem, cenionym twórcą podcastów, poetą, 
a ostatnio współzałożycielem i stroną kreatywną duetu projektancko-blogowego 
Arbenting 
Freebies Blog i Dead Wings Designs.

background image
background image

R

O

ZDZIAŁ

 10

10

JAK SKUTECZNIE

RADZIĆ SOBIE 

Z KRYTYKĄ

Andrew Follet

WINSTON CHURCHILL KIEDYŚ

 powiedział: „Krytyka może być nieprzyjemna, ale jest 

konieczna. Spełnia taką samą funkcję jak ból w organizmie człowieka. Zwraca uwagę na 
niezdrowy stan rzeczy”. Niezależnie od tego, gdzie lub dla kogo pracujesz, umiejętność 
przyjmowania krytyki jest częścią Twojej pracy. Czy jest to informacja zwrotna od szefa, czy 
od klienta, bardzo ważne jest odpowiednie podejście do krytyki i umiejętność efektywnego jej 
wykorzystania.

Niestety, niewiele osób lubi krytykę. W rzeczywistości wielu wypracowało sobie tarczę 
ochronną i są dumni z tego, że nie przejmują się krytyką. Jednak pomimo swojego 
negatywnego wyrazu krytyka bardzo często daje wspaniałe możliwości rozwoju dla 
projektanta. Aby można było skutecznie korzystać z krytyki, trzeba zrozumieć, jakie to 
możliwości.

background image

ROZDZIAŁ 10

118

Przyjrzyjmy się kilku ważnym aspektom konstruktywnej krytyki:



Odkrywa martwe punkty: Łatwo jest robić rzeczy, na których się dobrze znamy, 
ale nawyki, które w sobie wyrobimy, będą głęboko zakorzenione i przez to trudne 
do przezwyciężenia. Krytyka daje możliwość przyjrzenia się naszej pracy z innego 
punktu widzenia i dzięki temu odkrywa potencjalne obszary do poprawy, których 
nie jesteśmy w stanie zobaczyć sami.



Stawia wyzwania: Informacja zwrotna zachęca do bycia lepszym projektantem. 
Zamiast trzymać się własnych standardów, jesteś zmuszony do realizacji zadań 
na wyższym poziomie.



Rozwija umiejętności komunikacyjne: Radzenie sobie z krytyką może wpłynąć na 
znaczną poprawę sposobu komunikowania się — niezbędnej umiejętności w karierze 
projektanta.



Zewnętrzna motywacja: Konstruktywna krytyka często daje tzw. kopa: musisz 
nauczyć się nowych umiejętności projektowania lub poznać nowe techniki. 
Automotywacja jest wspaniała, ale każdy od czasu do czasu potrzebuje bata.



 Lekcja  pokory: Nigdy nie lekceważ znaczenia pokory. Chociaż krytyka może niszczyć 
Twoje ego, to sprowadza Cię też na ziemię, dzięki czemu możesz łatwiej pracować 
i jesteś bardziej otwarty na uczenie się od innych.

Rysunek 10.1. Pomyśl o krytyce jako o szansie rozwoju zawodowego

background image

JAK SKUTECZNIE RADZIĆ SOBIE Z KRYTYKĄ

119

Samo pozytywne spojrzenie na krytykę nie wystarczy. Musisz nauczyć się, jak skutecznie 
na nią reagować. Poniżej znajdziesz osiem wskazówek na temat tego, co robić, aby móc 
skutecznie korzystać z krytyki.

MIEJ ODPOWIEDNIE NASTAWIENIE

Projektowanie jest formą subiektywnego przekazu i jak każdy rodzaj sztuki nie ma 
sztywnych zasad. Nikt nie może powiedzieć Ci, co jest dobre, a co złe w Twojej pracy, 
ale to wcale nie oznacza, że możesz całkowicie ignorować opinię szefa lub klienta. Jeśli 
odpowiednio się nastawisz na krytykę oraz komentarze, możesz wykorzystać je na swoją 
korzyść, a nawet się nimi cieszyć.

Każdy odbiera projekt poprzez pryzmat swoich osobistych doświadczeń i jest on często 
bardzo różny od Twojego własnego. Chociaż możesz mieć wykształcenie wyższe w zakresie 
projektowania, dziesięć lat doświadczenia zawodowego, nie oczekuj, że każdy zgodzi się 
z Twoją opinią „eksperta”. Ważne jest, aby od początku mieć właściwą postawę. Bądź 
przygotowany na to, że inni mogą się z Tobą nie zgodzić, i otwarty na nowe możliwości. 
Dopasuj swoje oczekiwania i zaakceptuj to, że krytyka jest częścią procesu powstawania 
projektu. Choć ostra krytyka może głęboko dotykać, a nawet ranić, może również 
motywować, uczyć i pokazywać te wszystkie pozytywne aspekty wspomniane wcześniej.

I na koniec: spróbuj pominąć swoje ego w krytyce i spojrzeć na nią jak na komentarz 
do Twojej pracy, a nie jak na osobisty atak. Choć łatwiej to powiedzieć, niż zrobić, taka 
umiejętność jest kluczem do skutecznego reagowania. Kiedy możesz wznieść się ponad 
krytykę i odpowiadać spokojnie oraz szczerze, nie tylko zyskasz uznanie w oczach krytyków, 
ale i dobre samopoczucie. Miej odpowiednie oczekiwania, zrozum korzyści, okiełznaj ego 
i pamiętaj: właściwe nastawienie jest najważniejsze.

OKREŚL CEL

Zanim pokażesz projekt innym, bardzo ważne jest, abyś wyraźnie określił jego grupę 
docelową. Czy konsultujesz projekt z mamą podczas wizyty w kuchni? Czy jest ona 
klientem, który próbuje rozwiązać wyzwanie biznesowe poprzez projektowanie? A może 
konsultujesz projekt z przyjacielem bez doświadczenia, który nie bierze udziału w projekcie?

Niejasny lub pomieszany cel będzie zawsze skutkował nieadekwatnymi informacjami 
zwrotnymi, więc upewnij się, że wszyscy zainteresowani są zaangażowani w projekt, 
jeszcze przed podjęciem jakiegokolwiek działania.

background image

ROZDZIAŁ 10

120

Aby skutecznie reagować na krytykę, trzeba mieć pewność, że krytyk rozumie Twoje cele. 
Bądź konkretny. Pokazuj swoje cele w sposób jasny i zwięzły, a informacja zwrotna, jaką 
otrzymasz, będzie dzięki temu ukierunkowana i pewna.

Rysunek 10.2. Wyjaśnij cel swoim odbiorcom, aby otrzymać przydatne informacje zwrotne

SPRAWDŹ SWOJĄ PIERWSZĄ REAKCJĘ

W przypadku większości osób (łącznie ze mną) pierwszą reakcją na krytykę jest postawa 
obronna, a nawet atak. Jeśli to dotyczy również Ciebie, przed udzieleniem odpowiedzi daj 
sobie chwilę czasu na głęboki oddech oraz policz do dziesięciu. Ten prosty, lecz skuteczny 
sposób daje szansę na odzyskanie spokoju oraz pozwala logice zapanować nad emocjami. 
Ostatnią rzeczą, jaką chcesz zrobić, jest zareagować zbyt emocjonalnie i udzielić odpowiedzi, 
której będziesz później żałować. Pamiętaj, w większości przypadków krytyka jest po to, 
aby Ci pomóc.

background image

JAK SKUTECZNIE RADZIĆ SOBIE Z KRYTYKĄ

121

Mimo że na początku może być nieprzyjemnie, rzetelna informacja zwrotna jest bardzo 
ważna w procesie stawania się coraz lepszym projektantem. To jest bardzo istotne zwłaszcza 
w przypadku entuzjastów i początkujących w branży. Wszystkie sztuki wizualne mają 
„wbudowany” mechanizm nagradzania: im więcej tworzysz, tym większe robisz postępy.

To pętla, która trzyma wszystkich artystów w ciągłym ruchu. W momencie gdy euforia 
zostanie zmiażdżona przez większe potrzeby oraz krytykę, odzyskanie równowagi może być 
trudne. Należy jednak pamiętać, że Twoje umiejętności i spostrzegawczość w tej dziedzinie 
będą dojrzewać w czasie. Jeśli od początku masz odpowiednie nastawienie, łatwiej będzie 
o właściwą reakcję.

ODDZIEL ZIARNO OD PLEW

Niestety, nie każda krytyka bywa konstruktywna. Niektórzy ludzie, gdy mają zły nastrój, 
są zgorzkniali lub po prostu negatywnie nastawieni, wykorzystają każdą możliwość, aby 
kogoś poniżyć. Niektórzy nie mają doświadczenia i kwalifi kacji, aby udzielić Ci cennych 
wskazówek. Z powodu tego, że projektowanie ma naturę subiektywną, musisz nauczyć 
się rozróżniać nic niewarte informacje od tych ważnych. Nie ma natomiast żadnego 
usprawiedliwienia dla ignorowania komentarzy, które Ci się nie podobają. Chyba że 
uważasz, iż krytyka została dokonana w złej woli lub wynika z niewiedzy, lecz wówczas 
również nie spiesz się z jej odrzuceniem.

Oto kilka porad, jak odróżnić użyteczną, konstruktywną opinię od taniego sloganu 
i dezinformacji:



Charakterystyczna: Cenna rada jest zawsze wyraźnie określona. Jest klarowna, 
logiczna i zrozumiała. Zdania typu: „To logo jest brzydkie” albo „Nie lubię tego 
koloru” są przykładami bezużytecznych uwag (jeśli doświadczasz ich za dużo, 
zajrzyj do podpunktu „Pogłęb informacje” w dalszej części rozdziału).



Sugerująca działania: Konstruktywna krytyka powinna umożliwić podjęcie 
natychmiastowych działań. Powinieneś otrzymać jasne wskazówki na temat tego, 
co i jak poprawić, oraz zalecenia dotyczące dalszej pracy.



Obiektywna: Użyteczna opinia jest bezstronna. Daje unikalną perspektywę 
bez ukrytego motywu. Obiektywna krytyka zawsze jest spokojna i utrzymana 
w odpowiednim tonie.

UCZ SIĘ Z TEGO

Ten krok jest prawdopodobnie najtrudniejszy, ale najważniejszy. Aby krytyka mogła czemuś 
służyć, potrzebujesz ją zamienić w czyn. Nie przechodź nad nią do porządku dziennego, ale 
włóż spory wysiłek w to, aby poprawić projekt. Jedną z najwspanialszych rzeczy, jakie daje 

background image

ROZDZIAŁ 10

122

krytyka, jest to, że odkrywa martwe punkty i słabości projektu, które mogą zauważyć tylko 
inne osoby. Kiedy staniesz w obliczu krytyki, nie pozwól umknąć okazji i zanotuj wszystko, 
aby zmienić projekt na lepszy.

Jeśli ktoś krytykuje Twoje umiejętności pisania tekstów (ang. copywriting), zacznij od 
podstaw. Czytaj odpowiedniego bloga raz na tydzień. Ćwicz pisanie nagłówków przez 
dziesięć minut dziennie. Małe zwycięstwa są najszybszą drogą do sukcesu. Ostatecznie 
poprawisz swoje umiejętności i będziesz mógł podziękować swojemu krytykowi.

SZUKAJ NOWYCH POMYSŁÓW

Jeśli nie możesz nauczyć się niczego nowego, szukaj świeżych pomysłów. Inna perspektywa 
pomoże Ci popatrzeć na swoją pracę z zupełnie innego punktu widzenia. Tak jakbyś czerpał 
inspirację z wizyty w galerii lub od innego utalentowanego projektanta, możesz też znaleźć 
pomysły i inspiracje w konstruktywnej krytyce — musisz tylko trochę się cofnąć. Bądź 
ciekawski i przyjmuj krytykę obiektywnie, może być ona niezwykle przydatna.

Krytyka jest czasem jak zimny prysznic i daje możliwość, aby się przebudzić i wcisnąć 
przycisk Reset. Pamiętaj, że Twoja praca powstaje na podstawie Twoich własnych wyobrażeń 
tego, co chce klient, i musisz być zawsze przygotowany na to, że mogłeś coś przeoczyć. 
W sytuacji gdy jesteś zmuszony zacząć projekt od nowa, zadbaj o to, aby jeszcze raz omówić 
cele oraz oczekiwania klienta. Wcześniejsze wyjaśnienie może uchronić Cię od konieczności 
robienia wszystkiego od początku.

POGŁĘB INFORMACJE

Każdy otrzymał kiedyś mgliste, niejasne i zupełnie nieprzydatne informacje zwrotne. 
Takie jest życie. Niestety, dopóki nie podejmiesz inicjatywy, tego typu opinie zupełnie nie 
przydadzą się nikomu zainteresowanemu. Jednak kiedy tylko pokopiesz głębiej, możesz 
odkryć rzeczy, których nie uświadamiał sobie nawet sam klient. Zacznij od pytań otwartych 
typu: „Chciałbym zrozumieć twój punkt widzenia. Czy mógłbyś podać więcej szczegółów?” 
lub „Co mogę poprawić?”. Doprowadzą Cię one do sedna problemu. Wypytaj o szczegóły, 
a przede wszystkim bądź uczciwy. Tego typu pytania umożliwią Ci na nawiązanie otartej 
komunikacji i pozwolą odejść z konkretnymi i praktycznymi wskazówkami.

background image

JAK SKUTECZNIE RADZIĆ SOBIE Z KRYTYKĄ

123

Jeśli nie czujesz się na siłach dopytywać swojego krytyka o więcej szczegółów lub on nie 
ma ochoty Ci ich wyjaśniać, poproś o opinię osobę, którą szanujesz i której ufasz. Czy ma 
takie samo zdanie? Dlaczego? Przyjmując założenie, że ta osoba jest uczciwa i posiada 
odpowiednią wiedzę, powinieneś otrzymać w odpowiedzi to, czego potrzebujesz, aby móc 
kontynuować pracę nad projektem. 

PODZIĘKUJ KRYTYKOWI

Niezależnie od tego, czy krytyka, jaką otrzymasz, jest uczciwa, czy wręcz niegrzeczna, 
zawsze za nią podziękuj. Dziękując, nawet w przypadku najsurowszej krytyki możesz 
zrobić naprawdę dobre wrażenie, zachować pokorę i otworzyć sobie drzwi do dodatkowych 
informacji w przyszłości. Dziękując, poczujesz się również lepiej, ponieważ zdobędziesz 

Rysunek 10.3. Jeśli krytyka zawiera za mało informacji odnośnie do tego, co należy poprawić, 
poproś o więcej informacji

background image

ROZDZIAŁ 10

124

kolejne doświadczenie, co może pomóc Ci w przyszłości uniknąć sytuacji, gdy te same osoby 
będą niechętne do udzielania Ci informacji zwrotnych. Jeśli tylko będziesz przestrzegać 
tych wytycznych i zrozumiesz prawdziwą wartość krytyki, powiedzenie słowa „dziękuję” 
nie będzie dla Ciebie już nigdy więcej za trudne.

Jeśli szanujesz tę osobę oraz jej opinię, pójdź o krok dalej i spróbuj nawiązać z nią 
długoterminową współpracę opartą na mentoringu. Podobnie jak w dawnych czasach 
w przypadku rzemieślnika i ucznia, relacja z osobą, której opinię cenisz, może być bardzo 
istotna w rozwijaniu Twoich zdolności i umiejętności. Mentor może sprawić, że potraktujesz 
swoją pracę odpowiedzialnie, i pomoże Ci się stale udoskonalać.

Andrew Follett jest dyrektorem marketingu w małej fi rmie i założycielem Concept Feedback 
(
http://www.conceptfeedback.com/), internetowej społeczności projektantów i sprzedawców 
poświęconej dzieleniu się pomysłami i opiniami na temat projektów.

background image

R

O

ZDZIAŁ

 11

11

JAK 

WYKORZYSTAĆ

SIECI 

ZNAJOMOŚCI

Steven Snell

SKUTECZNE BUDOWANIE POWIĄZAŃ

 jest kluczowym elementem kariery projektanta. 

Czy chodzi o poszukiwanie nowych klientów, czy identyfi kowanie szans rozwoju 
i samodoskonalenia, dobra sieć znajomości jest niezwykle cenna. W tym rozdziale rzucimy 
okiem na potencjalne korzyści z posiadania dobrze rozbudowanej społeczności oraz 
przekażemy wskazówki dotyczące skutecznego wykorzystania sieci społecznościowych.

Budowanie społeczności polega na tworzeniu powiązań i kontaktów z ludźmi z różnych grup 
i specjalizacji, wliczając w to innych projektantów i programistów. Ten rozdział jest napisany 
z myślą o projektantach WWW, ale ogólne zasady są takie same dla wszystkich i mogą być 
zastosowane przez osoby wykonujące dowolne zawody, różnice mogą wystąpić na poziomie 
najdrobniejszych szczegółów.

background image

ROZDZIAŁ 11

126

DLACZEGO WARTO TWORZYĆ POWIĄZANIA?

Jeśli do tej pory nie korzystałeś aktywnie z sieci społecznościowych, być może zastanawiasz 
się, dlaczego powinieneś się tym przejmować. Zanim przejdę do wskazówek i sugestii 
dotyczących tego zagadnienia, zastanówmy się, jakie korzyści możesz mieć z tego wysiłku.

REFERENCJE

W przypadku wielu projektantów jednym z najskuteczniejszych sposobów pozyskiwania 
nowych zleceń są nieformalne pochwały przekazywane przez poprzednich klientów. Innymi 
słowy, im więcej osób zna Ciebie i Twoje usługi, tym większe szanse masz na uzyskanie 
referencji. Tworząc powiązania z ludźmi i utrzymując z nimi kontakt, zostawiasz ślad w ich 
pamięci, dzięki czemu jest szansa, że w rozmowie na temat projektów WWW wspomną 
o Twoich usługach potencjalnemu klientowi. Taka osoba jest skłonna zaufać osobistej
referencji uzyskanej od znajomego, którego zna i z którym współpracowała. Szansa, że 
taki potencjalny klient stanie się płacącym klientem, jest w takiej sytuacji większa niż 
w przypadku innych dróg pozyskania informacji o zleceniobiorcy.

W wielu sieciach społecznościowych projektantów WWW znajdziesz innych projektantów 
oferujących zbliżone usługi. Uzyskanie referencji od kolegi po fachu jest znacznie 
powszechniej stosowaną praktyką, niż mogłoby się wydawać. Mimo że nasze usługi mogą 
wydawać się wzajemnie konkurencyjne, każdy z nas ma silniejsze i słabsze strony oraz różne 
poziomy doświadczenia z różnymi typami klientów. Ponadto istnieją takie zlecenia, których 
niektórzy z nas po prostu nie chcą się podejmować, albo sytuacje, gdy napięte terminy 
trwających projektów nie pozwalają przyjąć danego zlecenia. W takich przypadkach często 
zdarza się, że jeden projektant WWW poleca swojego kolegę do realizacji projektu.

WSPÓŁPRACA

W przypadku freelancerów i niezależnych projektantów posiadanie solidnej sieci 
powiązań otwiera niezliczone możliwości współpracy. Taką sieć można wykorzystać do 
realizacji jednorazowego zlecenia o specyfi cznych wymaganiach, ale też może ona być 
bazą do długotrwałej współpracy. Optymalnie Twoja sieć powinna zawierać wiele osób 
o umiejętnościach uzupełniających Twoje. Dzięki temu masz możliwość, aby zapraszać
do współpracy innych ludzi, i każdy będzie robił to, na czym zna się najlepiej.

ROZWIĄZYWANIE PROBLEMÓW

Jeśli ufasz ludziom w swojej sieci i cenisz ich, z pewnością nie zawahasz się przed 
poproszeniem o pomoc w przypadku, gdy potrzebujesz porady. Czy znasz kogoś, kto 
miał do czynienia z podobnym problemem i może podzielić się swoim doświadczeniem? 

background image

JAK WYKORZYSTAĆ SIECI ZNAJOMOŚCI

127

W przypadku projektantów i programistów to może być problem natury technicznej, jak 
trudny fragment kodu, może to też być kłopot z realizacją specyfi cznych potrzeb klienta, 
a nawet porada dotycząca specyfi ki prowadzenia samodzielnej działalności gospodarczej 
w roli freelancera. Istnieje wiele projektów, które pomagają projektantom i programistom 
w rozwiązywaniu problemów projektowych i programistycznych, jak Stack Overfl ow 
(stackoverfl ow.com) — platforma dla projektantów i programistów służąca do dzielenia się 
doświadczeniem, pomysłami i przemyśleniami.

stackoverflow

SZUKANIE OKAZJI

Profesjonalista z dobrze rozwiniętą siecią powiązań z pewnością może liczyć na większą 
liczbę okazji niż podobnie utalentowana osoba, która nie ma dobrych znajomości. Być może 
dziś nie odczuwasz konieczności nawiązywania sieci kontaktów, ale w przyszłości znajomość 
z kimś, na kogo możesz liczyć, może okazać się bezcenna.

Jeśli jesteś freelancerem, może się okazać, że z czasem zechcesz znaleźć stałe zatrudnienie. 
W takim przypadku proces poszukiwania pracy będzie znacznie uproszczony, jeśli 
zbudujesz sieć znajomości: osób, które znają Ciebie i jakość Twojej pracy. Oczywiście 
z budową sieci możesz poczekać do momentu, gdy zdecydujesz się na taką zmianę formy 
zatrudnienia, ale naprawdę warto zacząć z pewnym wyprzedzeniem.

POMOC INNYM

Do tej pory skupialiśmy się na tym, jakie korzyści z sieci znajomości będziesz miał Ty sam, 
ale prawdziwe społeczności nie są zjawiskiem jednostronnym. Jedna z zalet posiadania 
znajomości polega na tym, że znajdziesz mnóstwo okazji do pomagania innym. Być 
może nie jesteś freelancerem, który szuka stałego zatrudnienia, ale znasz kogoś, kto jest 
freelancerem, oraz kogoś, kto chce zatrudnić projektanta WWW.

Rysunek 11.1. Stack Overfl ow jest serwisem WWW typu pytanie-i-odpowiedź 
redagowanym w sposób społecznościowy. W tym serwisie programiści mogą 
zasięgać i udzielać porad oraz nawiązywać kontakty. 

© 2010 stack overfl ow internet services, inc

background image

ROZDZIAŁ 11

128

PRZYJAŹŃ

Oprócz korzyści zawodowych budowanie sieci znajomości może dawać mnóstwo satysfakcji 
wynikającej ze spotykania nowych ludzi i zdobywania przyjaźni. To może być szczególnie 
cenne w przypadku freelancerów pracujących z domu. Sieć znajomości może być jedną 
z nielicznych okazji do interakcji z innymi ludźmi z branży.

WSKAZÓWKI DLA PROJEKTANTÓW

Znamy już najważniejsze korzyści z budowania sieci znajomości, czas na kilka wskazówek, 
jak to robić w praktyce.

BĄDŹ DOSTĘPNY

Jednym z kluczowych wymagań skutecznej sieci jest umożliwienie innym osobom 
skontaktowania się z nami. Oczywiście przede wszystkim chodzi o to, żebyś Ty mógł 
skontaktować się z innymi, ale należy też umożliwić innym kontakt z Tobą, gdy tego 
potrzebują. Można to zrealizować za pomocą formularza kontaktu na stronie portfolio, 
konta w sieci społecznościowej albo łącząc te techniki przez umieszczenie na stronie 
portfolio odnośników do profi li w sieciach społecznościowych. A przede wszystkim reagując 
na próby kontaktu.

SZUKAJ WSPÓLNYCH KORZYŚCI

Najskuteczniejsze powiązania to takie, które są oparte na zasadzie obustronnej korzyści. 
Jeśli chcesz, aby Twoja sieć miała znaczący wpływ na Twój biznes lub karierę, postaraj się 
znaleźć okazje do zaistnienia takiej sytuacji. Pozwolą one wszystkim uczestnikom relacji 
na utrzymanie silnych powiązań i dadzą motywację do ich udoskonalania, co w efekcie da 
rezultat znacznie lepszy, niż byłbyś w stanie osiągnąć samodzielnie.

Znajdowanie obustronnych korzyści nie zawsze jest łatwe, ale gdy lepiej poznasz inne osoby 
i ich unikalne umiejętności, łatwiej dostrzeżesz tego typu okazje. Takie powiązania mają 
szansę na stworzenie silnych, długotrwałych relacji.

PROWADŹ BLOGA

Wielu projektantów prowadzi bloga na swojej stronie portfolio lub w innej domenie. 
Blogowanie to nie tylko efektywny sposób przyciągania potencjalnych klientów, ale też 
doskonała metoda angażowania innych projektantów i budowania sieci znajomości. 

background image

JAK WYKORZYSTAĆ SIECI ZNAJOMOŚCI

129

Prowadzenie bloga ma naturę osobistą i wiąże się z komunikacją dwustronną, co 
w rezultacie tworzy liczne okazje do interakcji. Blogerzy mają skłonność do czytania blogów 
innych osób, a wśród projektantów WWW ta forma przekazu jest szczególnie popularna. 
Blogowanie to doskonały sposób na uzyskanie rozgłosu i otwarcie się na szanse nawiązania 
kontaktów z innymi profesjonalistami.

SKUPIAJ SIĘ NA GŁĘBI ZNAJOMOŚCI

W sieciach społecznościowych, jak w każdej innej dziedzinie życia, jakość jest ważniejsza od 
ilości. Posiadanie powiązań z ludźmi różnych specjalności jest z pewnością dobrą strategią. 
Z czasem przekonasz się, że najlepsze rezultaty uzyskasz z najsilniejszych związków. 
Gdy łączysz się z ludźmi, staraj się ich poznać nieco głębiej niż na poziomie uprzejmego, 
ale sztucznego zainteresowania. Ludzie, z którymi zbudujesz silne powiązania, mają szansę 
stworzyć swoisty „krąg zaufania”, z którym będziesz kontaktował się systematycznie.

BĄDŹ PROAKTYWNY

Nie siedź z boku, oczekując, że ktoś pierwszy wyciągnie rękę. Aktywnie uczestnicz 
w sieciach społecznościowych, bierz udział w lokalnych wydarzeniach, uczęszczaj na 
seminaria i szukaj kontaktu z ludźmi, których chciałbyś poznać. Jeśli bierzesz udział 
w wydarzeniu lub udzielasz się w sieci społecznościowej, inni uczestnicy prawdopodobnie są 
tam z tego samego powodu co Ty, nie wstydź się więc nawiązywania kontaktu.

Ta sama uwaga dotyczy komentowania na cudzych blogach, udziału w forach i pisaniu 
gościnnych artykułów na blogach kolegów. Twoja sieć może stać się cenną częścią Twojej 
kariery, bądź więc proaktywny i uczyń z niej coś wyjątkowego.

WIEDZ, CZEGO SZUKASZ

Jeśli w sposób proaktywny szukasz kontaktów wśród innych profesjonalistów, warto 
odpowiedzieć sobie na pytanie, czego szukasz. Dzięki temu zidentyfi kujesz właściwe osoby, 
co pozwoli na to, aby Twoje poszukiwania były bardziej efektywne. Jeśli na przykład jesteś 
studentem, który za rok skończy uczelnię, i szukasz pracy jako projektant, przydadzą Ci 
się kontakty z ludźmi, którzy zarządzają studiami projektanckimi albo pracują w fi rmach 
zatrudniających projektantów. Jeśli jesteś projektantem, który nie wykonuje pracy związanej 
z programowaniem, przyda Ci się kontakt z dobrymi programistami, którzy mogą zechcieć 
współpracować z Tobą nad projektami.

Myśl o swoich silnych i słabych stronach i o aktualnej sytuacji. Kto i co pomoże Ci dotrzeć 
do miejsca, w którym chcesz się znaleźć? Zidentyfi kuj osoby, które już się tam znajdują, 
i spróbuj się z nimi zapoznać.

background image

ROZDZIAŁ 11

130

WIEDZ, CO MASZ DO ZAOFEROWANIA

Jeśli chcesz być wartościowym członkiem społeczności, świadomość tego, co sam masz do 
zaoferowania, jest nie mniej ważna od wiedzy na temat tego, czego możesz oczekiwać od 
innych. Pomyśl, co jest unikalne i wyjątkowe w Twoich umiejętnościach i jakie możliwości 
daje to innym osobom.

Oczywiście nie oznacza to, że powinieneś biegać, wołając do wszystkich, jaki to jesteś 
wartościowy i dlaczego Cię potrzebują. Jednak świadomość własnej wartości pomoże Ci 
zidentyfi kować sytuacje, w których obie strony mogą odnieść korzyści, a także nauczy Cię, 
w jaki sposób przedstawiać siebie w korzystnym świetle.

WYKORZYSTAJ ZNAJOMOŚCI NIEBEZPOŚREDNIE

Z niektórymi osobami z sieci znajomości nie będziesz utrzymywać bezpośrednich 
kontaktów, co nie znaczy, że są one mniej cenne. Może się okazać, że znasz kogoś, kto 
zna inną osobę, która okaże się dla Ciebie szczególnie pomocna. Warto wykorzystać tego 
znajomego jako pośrednika. Twoja sieć stanie się o wiele skuteczniejsza i cenniejsza, gdy 
uświadomisz sobie, że Twoje bezpośrednie powiązania nie są jedynym cennym jej zasobem, 
ponieważ potencjalnie masz dostęp do sieci znajomych swoich znajomych.

Sieć społecznościowa LinkedIn oferuje doskonałe narzędzie obrazujące ten potencjał. 
Załóżmy, że masz 50 znajomych w serwisie LinkedIn, ale ci znajomi mają też swoich 
znajomych, których Ty nie znasz. Jeśli zatem każdy z nich zna 50 innych osób, może się 
okazać, że znajdujesz się na odległość jednej osoby od kogoś szczególnie cennego.

W praktyce, jeśli szukasz kogoś o specyfi cznych umiejętnościach czy doświadczeniu, 
porozmawiaj ze znajomymi ze swojej sieci. Spytaj, czy znają kogoś odpowiedniego. Sieci 
niebezpośrednie często bywają bardziej efektywne od tych bezpośrednich, ponieważ 
pozwalają wykorzystać sieci innych i dają możliwość uzyskania referencji od osób, 
do których masz zaufanie.

NIE CZEKAJ DO MOMENTU, 

GDY BĘDZIESZ CZEGOŚ POTRZEBOWAŁ

Sieci społecznościowe są najbardziej skuteczne, gdy nie jesteś zmuszony do uzyskania 
natychmiastowego wyniku. Proszenie przyjaciół o pomoc, gdy jesteś w potrzebie, jest czymś 
zupełnie naturalnym, ale posiadanie rozbudowanej i ustabilizowanej sieci ludzi, na których 
możesz liczyć w każdej sytuacji, daje znacznie lepsze efekty. Wykorzystanie sieci tylko 
w przypadku, gdy czegoś potrzebujesz, rzadko daje obustronne korzyści i może dać innym 
uczestnikom wrażenie, że jesteś zainteresowany wyłącznie własnym interesem.

background image

JAK WYKORZYSTAĆ SIECI ZNAJOMOŚCI

131

POMAGAJ, GDY TYLKO JESTEŚ W STANIE

Ważnym elementem sieci społecznościowych jest pomaganie innym i przedstawianie siebie 
jako cennego kontaktu i przyjaciela. Nie zawsze będziesz w stanie pomagać, ale postaraj 
się unikać pokusy wyciągania pomocnej dłoni tylko w przypadku, gdy możesz uzyskać coś 
w zamian. Sieć ludzi chętnych do wzajemnej pomocy przyniesie korzyści wszystkim jej 
członkom.

NIE WYZYSKUJ INNYCH

Jeśli szukasz nowych ludzi do swojej sieci, łatwo skupić się na tym, co inni mogą zrobić dla 
Ciebie. Jednak to nie jest efektywny sposób na interakcję i często się zdarza, że ludzie szybko 
orientują się co do prawdziwych intencji.

Najlepiej unikać wyzyskiwania ludzi, starając się znaleźć sposób udzielenia im pomocy. 
Podkreślanie własnej wartości i unikanie poszukiwania sposobu wykorzystania innych 
pomogą Ci postrzegać ich w sposób nieegoistyczny. Jeśli skupisz się na pomocy innym, 
prawdopodobnie oni zechcą pomóc Ci w zamian.

NIE POZWÓL, BY SIECI SPOŁECZNOŚCIOWE 

SZKODZIŁY TWOJEJ PRODUKTYWNOŚCI

Profesjonalne sieci powinny być integralną częścią Twojej pracy, ale nie spowodują 
bezpośrednio, że na Twoim koncie pojawią się pieniądze. Freelancerzy muszą skupiać się 
na świadczeniu usług dla swoich klientów, które to usługi pozwolą im generować przychód 
pozwalający na prowadzenie działalności. Sieci są ważne, ale nie powinny przeszkadzać 
w pracy.

Sieci online i poczta e-mail są szczególnie skutecznymi rozpraszaczami uwagi. Opracuj 
system, który pozwoli Ci kontaktować się ze znajomymi, ale bez zagrożenia dla pracy. 
Na przykład zamiast trzymać cały dzień otwarte okno Twittera i poczty elektronicznej, 
otwieraj je tylko kilka razy dziennie o ustalonych wcześniej godzinach. Każdy z nas pracuje 
nieco inaczej, więc ustal, które pory dnia są dla Ciebie najbardziej odpowiednie, abyś 
mógł kontaktować się ze znajomymi w jak najbardziej efektywny sposób i z minimalnym 
negatywnym wpływem na wydajność pracy.

NIE OCENIAJ LUDZI POCHOPNIE

Gdy skupiasz się na wzmocnieniu swojej sieci przez zawieranie cennych znajomości, łatwo 
jest zacząć oceniać ludzi w oparciu o to, jakie korzyści mogą Ci przynieść. To niebezpieczna 
skłonność, ponieważ spowoduje, że nie będziesz chciał przyjaźnić się z osobami, które nie 
mają nic cennego do zaoferowania. Może się jednak okazać, że mają one ukryte talenty, 
których nie potrafi łeś docenić na pierwszy rzut oka.

background image

ROZDZIAŁ 11

132

NIE STARAJ SIĘ BYĆ WSZĘDZIE NARAZ

W sieciach społecznościowych, szczególnie w internecie, można trafi ć na wiele ciekawych 
okazji. Możesz jednak uczestniczyć w ograniczonej liczbie działalności jednocześnie, nie 
warto rozmieniać się na drobne. Wybierz zatem tylko te aktywności sieciowe, które są 
najbardziej obiecujące, dzięki czemu będziesz mógł poświęcać im więcej czasu.

Odpowiednia aktywność w kilku wybranych kręgach da lepsze rezultaty niż zbyt mała 
aktywność w wielkiej liczbie. Zasada o wyższości jakości nad ilością ma zastosowanie 
również i w kontaktach międzyludzkich.

BIERZ UDZIAŁ W RZECZYWISTYCH SPOTKANIACH

Projektanci WWW i osoby wykonujące inne zawody związane z internetem mają to 
szczęście, że z myślą o nich organizowana jest duża liczba wysokiej jakości konferencji 
i wydarzeń, które dają doskonałe okazje do uczenia się i nawiązywania nowych kontaktów. 
Jeśli w Twojej okolicy odbywa się tego typu wydarzenie, spróbuj się na nie wybrać. 
Oczywiście jeśli lubisz podróżować, możesz brać udział w imprezach w dowolnym miejscu 
na kuli ziemskiej.

PILNUJ LOKALNYCH OKAZJI

Jedną z pułapek sieci online jest to, że mogą angażować do tego stopnia, iż nie zwraca się 
uwagi na wydarzenia pozwalające na bezpośrednie kontakty z profesjonalistami z Twojej 
okolicy. Wiele lokalnych organizacji przygotowuje konferencje, wymiany biznesowe, 
seminaria i inne wydarzenia, na których możesz nawiązywać profesjonalne znajomości. 
Śledź terminarze tego typu imprez w swojej okolicy na wypadek, gdyby pojawiło się coś, 
na co warto zwrócić uwagę i w co warto zainwestować nieco czasu.

Steven Snell projektuje strony WWW już od kilku lat. Aktywnie prowadzi własne blogi, między 
innymi 
DesignM.ag, w którym regularnie publikuje artykuły i informacje na temat ciekawych 
zasobów w internecie dla projektantów WWW.

background image

R

O

ZDZIAŁ

 12

12

WYWIAD GRUPOWY:

PORADY EKSPERTÓW 

DLA STUDENTÓW 

I POCZĄTKUJĄCYCH 

PROJEKTANTÓW WWW

Steven Snell

CZYTELNICY

 Smashing Magazine poprosili o przeprowadzenie wywiadów z ekspertami 

w dziedzinie projektowania WWW. Wspólnym tematem tych wywiadów miały być porady 
dla początkujących projektantów. Z udziałem 16 projektantów opracowaliśmy serię porad 
pomocnych w stawianiu pierwszych kroków w karierze. Każdemu z rozmówców zadaliśmy 
kilka różnych pytań, a w tym rozdziale znajdziesz ich odpowiedzi.

Oto lista osób, które wzięły udział w tym wywiadzie:



Henry Jones (Web Design Ledger);



 Wolfgang Bartelme (Bartelme.at);



 Chris Coyier (CSS-Tricks);



 Chris Spooner (SpoonGraphics, Line25);



 Soh Tanaka;



 Jon Phillips (Spyre Studios);



 Paul Boag (Boagworld, Headscape);



 David Leggett (Tutorial9, UX Booth);



 Jacob Gube (Six Revisions);



Elliot Jay Stocks;

background image

ROZDZIAŁ 12

134

 



 Brian Hof (Th

  e Design Cubicle);





Darren Hoyt;

 



Walter Apai (Webdesigner Depot);

 



 Jacob Cass (Just Creative Design);

 



 Zach Dunn (One Mighty Roar i Build Internet);

 



 Paul Andrew (Speckyboy Design Magazine).

JAKIE SZKOŁY POLECIŁBYŚ OSOBOM PLANUJĄCYM PRACĘ 
W ROLI PROJEKTANTA WWW?

David Leggett: Jeśli znajdziesz dobry program uniwersytecki, który będzie cię interesował, 
z pewnością zwiększysz swoje szanse na szybsze znalezienie ciekawych możliwości, ale na 
pewno warto zdobyć doświadczenie przed rozpoczęciem edukacji i niezależnie od niej. 
Znajdź projekty, w których możesz pomóc, zacznij własny, czytaj jak najwięcej i staraj się 
stosować zdobytą wiedzę w tych projektach. Każde dodatkowe doświadczenie się przyda, 
a w najgorszym razie przekonasz się, czy tego typu praca daje ci prawdziwą satysfakcję.

Dla jasności, osobiście nigdy nie zdobyłem wyższego wykształcenia z zakresu projektowania 
WWW, nie ukończyłem też kursów, ale jestem przekonany, że tego typu wiedza może być 
bardzo cenna, co z pewnością potwierdzą też inni specjaliści.

Wolfgang Bartelme: Uważam, że najważniejsza rada brzmi: „Ćwicz, ćwicz, ćwicz”. Jeśli 
chcesz poprawić jakość swoich prac, musisz popychać samego siebie do coraz lepszych 
efektów. Wielu doskonałych artystów to samouki. Mimo to jestem przekonany, że dogłębna 
edukacja udoskonali twoje umiejętności i pomoże zrozumieć sposoby pracy innych 
projektantów. Osobiście studiowałem projektowanie w zastosowaniach informatycznych na 
Uniwersytecie Nauki Stosowanej w Graz, skupiając się na różnych aspektach projektowania: 
na potrzeby druku i reklam, wystaw, WWW, użyteczności, fotografi i i fi lmu. Tego typu 
przygotowanie daje studentom dużą bazę wiedzy i jest w stanie rozszerzyć ich horyzonty 
poza bycie specjalistą w wąskiej dziedzinie.

W JAKI SPOSÓB STUDENT MOŻE DOWIEDZIEĆ SIĘ, 
CZY PROJEKTOWANIE WWW JEST DLA NIEGO WŁAŚCIWYM KIERUNKIEM, 
CZY POWINIEN SZUKAĆ INNEJ KARIERY?

Jacob Gube: Na to pytanie musisz odpowiedzieć sobie sam. Nie istnieją reguły czy 
algorytmy, które pozwolą ci określić, czy powinieneś być projektantem. Ważnym elementem 
jest zapał do pracy. Nawet przeciętni projektanci będą w stanie się utrzymać, ale będą 
musieli pracować ciężej, jeśli chcą konkurować ze swoimi bardziej utalentowanymi 

background image

WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW

135

i doświadczonymi kolegami. Wszystko zatem sprowadza się do tego, jak bardzo chcesz być 
projektantem i jak ciężko jesteś gotowy pracować, aby się stale rozwijać. Nie mam zamiaru 
przedstawiać sytuacji w różowych barwach: prawda jest taka, że rynek jest obecnie nasycony 
i na świecie jest więcej projektantów niż pracy dla nich, dlatego zanim zainwestujesz czas 
w naukę, upewnij się, że to zawód dla ciebie.

Henry Jones: Myślę, że chodzi przede wszystkim o pasję. Jeśli zdarza ci się siedzieć długo 
w nocy, pracując nad projektem dla samej radości z tego zadania, to znak, że ta praca nadaje 
się dla ciebie. Myślę, że jedną z najgorszych rzeczy, jakie mogą spotkać nas w życiu, jest 
być zmuszonym do robienia tego, czego nienawidzimy. Zamiłowanie do pracy oznacza, 
że będziesz to robić i myśleć o tym, nawet nie będąc w szkole albo gdy nikt ci za to nie 
płaci. Będziesz ciągle starał się rozwijać swoje umiejętności i nadążać za najnowszymi 
technologiami, co w przypadku projektantów WWW jest szczególnie istotne.

David Leggett: Sytuacja każdego z nas jest nieco inna i nie mam zamiaru sugerować, 
że to, co powiem, ma zastosowanie w każdym przypadku. Uważam jednak, że jeśli jesteś 
studentem uczelni wyższej i nie masz żadnego doświadczenia jako projektant WWW, 
znalezienie pracy w tym zawodzie może nie być łatwe. Moje przekonanie bierze się z życia: 
wielu moich znajomych ma problemy ze znalezieniem pracy w obecnej sytuacji rynkowej. 
Doświadczenie i jakieś portfolio, którym możesz potwierdzić swoje wykształcenie, mogą 
znacząco zwiększyć twoje szanse.

Oprócz tego musisz naprawdę lubić to, co robisz. Wielu projektantów i artystów, których 
znam, naprawdę dobrze się bawi w pracy, nawet wówczas, gdy kolejne zlecenia zdobywają 
z prawdziwym wysiłkiem. Nie sugeruję, że powinieneś lekceważyć swoją pracę, ale jeśli 
cieszysz się nią nawet wówczas, gdy nie zarabiasz na niej kokosów, to znak, że to był dobry 
wybór.

Wolfgang Bartelme: Najważniejsze jest to, żeby projektowanie sprawiało ci radość: 
powinieneś mieć zamiłowanie do tego, co robisz. Po drugie, powinieneś oczywiście posiadać 
odpowiednią ilość talentu i wyobraźni. Nawet jeśli na studiach przerobiłeś mnóstwo 
materiału i nabyłeś umiejętności, bez talentu i wyobraźni twoja praca będzie w najlepszym 
razie przeciętna.

Chris Spooner: W przypadku każdego zawodu zamiłowanie jest najlepszą drogą do 
sukcesu. Kariery na rynku projektantów WWW czasem wydają się bardziej fascynujące, 
niż są w rzeczywistości — w końcu przecież cały dzień głównie zmieniamy kolorki… 
Myślę, że tego typu mity przyciągają do tego zawodu mnóstwo ludzi, którzy nie są 
szczególnie kreatywni i po prostu szukają lekkiej, łatwej i przyjemnej pracy.

Tego typu osoby nie będą potrafi ły znaleźć motywacji do uczenia się nowych umiejętności 
i rozwijania ich w ramach kariery. Nie sugeruję, że jeśli jako dziecko nie przejawiałeś 
zdolności kreatywnych, nie będziesz miał szans w projektowaniu. Często zdarza się, że na 

background image

ROZDZIAŁ 12

136

różnych etapach życia rozmijamy się z pewnymi zainteresowaniami. Jeśli dziś uważasz, 
że projektowanie stron WWW to jest to, co cię kręci, powodzenia!

JAK UDAJE CI SIĘ GODZIĆ NAUKĘ Z PRACĄ?

Zach Dunn: Według moich oszacowań spędzam trzy godziny czasu pracy nad zleceniami 
na jedną godzinę pracy akademickiej. Umiejętności zawodowych w większym stopniu 
uczę się w pracy z klientem niż na uczelni. Łatwo jest zapomnieć się w pracy z klientem 
i w blogowaniu. Wręcz trudnością jest nie tracić kontaktu z otaczającą rzeczywistością. 
Interakcja z klientem czy też blogowanie to z pewnością aktywności społeczne, ale czasem 
trzeba zrobić sobie od tego przerwę i po prostu spotkać się z kumplami z uczelni. Traktuję 
to jako formę mentalnej odtrutki.

Jestem przekonany, że jeśli chcesz być kompetentnym projektantem WWW, musisz sporo 
czasu poświęcić własnym projektom. Poświęcanie dużej ilości czasu zajęciom na uczelni 
i zadaniom domowym powoduje, że traci się tempo i zostaje w tyle. Internet rozwija się 
szybko i materiał jakiejkolwiek uczelni nie jest w stanie za tym nadążyć. To, czy będziesz 
na czasie, zależy od ciebie.

Jacob Cass: Znalezienie równowagi między rodziną, przyjaciółmi, pracą i innymi aspektami 
życia zawsze będzie nie lada wyzwaniem, niezależnie od tego, jaką pracę wykonujesz. 
Musisz ustalić priorytety i cele odpowiednie do tego, co chcesz osiągnąć w życiu. Mimo 
że formalnie zakończyłem już edukację, pamiętam, że w okresie studiów największym 
wyzwaniem było dla mnie znalezienie odpowiedniej ilości czasu, który mógłbym poświęcić 
na wysokiej jakości pracę nad projektami, nieważne, czy to były projekty związane 
z uczelnią, moje własne, czy zlecone przez klientów. Czasem wydawało mi się to prawie 
niemożliwe i, szczerze mówiąc, moje studia i życie osobiste miały niższy priorytet niż praca 
na zlecenie. Dziś wierzę, że wszystko zależy od ustalenia właściwych priorytetów, celów 
i dobrego zarządzania czasem.

W JAKI SPOSÓB PRACA W CZASIE STUDIÓW PRZYGOTOWAŁA CIĘ DO KARIERY?

Zach Dunn: Prawie wszystkie historie o sukcesie i karierze po zakończeniu studiów mówią 
o pracy w czasie ich trwania. Studia są doskonałym inkubatorem kontaktów niezwiązanych
z edukacją. Cenię szkołę za inne wartości, niż zwykło się jej przypisywać. Studia pomogły 
mi na polu społecznym. Sam [Dunn] niedawno w serwisie BuildInternet.com opublikował 
artykuł Th

  e Role of College for Web Designers (Rola studiów w karierze projektanta WWW), 

który doskonale wyjaśnia nasze wyobrażenie na ten temat.

background image

WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW

137

Niektórych karier nie uda się rozpocząć przed uzyskaniem dyplomu. Na przykład prawnicy 
nie mogą mieć „hobbystycznych” klientów w czasie trwania studiów — tutaj obowiązuje 
zasada: „Wszystko albo nic”. Praca projektanta WWW nie jest w ten sposób ograniczona 
przez przepisy prawne. Tego typu kariera opiera się głównie na zbudowanym portfolio. 
Kiedy ostatnio zdarzyło się, że klient był bardziej zainteresowany tematem twojej pracy 
dyplomowej niż doświadczeniem? W tym zawodzie mamy luksus możliwości wczesnego 
startu. Lubię wykorzystywać tego typu okazje.

Nie wiem, jaka przyszłość czeka Sama i mnie, ale jestem przekonany, że przynajmniej część 
projektów, które tworzymy dziś, będą miały na nią jakiś wpływ.

Jacob Cass: Jeśli mam być szczery, więcej nauczyłem się przez sześć miesięcy blogowania 
i śledzenia blogów innych osób, niż studiując przez pełne trzy lata. Wykonywanie pracy 
poza studiami jest kluczowe.

NA CZYM POWINNI SKUPIĆ SIĘ STUDENCI I POCZĄTKUJĄCY PROJEKTANCI, 
ABY ROBIĆ POSTĘPY W KARIERZE?

Brian Hof: Studenci powinni w miarę możliwości zapisać się na zajęcia z podstaw biznesu, 
szczególnie jeśli planują zawód freelancera albo założenie własnego studia projektowego. 
Ja osobiście zawsze miałem wystarczająco dużo samozaparcia, aby uczyć się samodzielnie, 
ale żałuję, że nie zdobyłem więcej uporządkowanej wiedzy z zakresu biznesu i marketingu. 
Zalecam też kolekcjonowanie projektów. Zbudowanie biblioteki pomysłów i inspiracji jest 
bardzo ważne. Robię zdjęcia interesujących form, połączeń barwnych, projektów, a do 
organizowania tych materiałów online używam aplikacji LittleSnapper. Zawód projektanta 
grafi cznego wiąże się z nieustającą nauką.

Chris Coyier: Żaden program nauczania nie jest w stanie omówić wszystkich aspektów 
projektowania, szczególnie najnowocześniejszych zagadnień związanych z rozwojem 
technologii. Jeśli czytasz Smashing Magazine, prawdopodobnie masz dobre pojęcie o tym, 
co dzieje się w nowoczesnym projektowaniu WWW. Czytanie poradników i stosowanie 
zdobytej tam wiedzy oraz własne eksperymenty z pewnością pomogą ci osiągnąć wysoki 
poziom. Pamiętaj jednak, że twoje życie nie musi kręcić się wyłącznie wokół kariery. Dobrze 
zbalansowane życie z pewnością będzie bardzo pomocne w karierze. Być może masz hobby, 
w którym wykorzystujesz swoje talenty z zakresu projektowania. Mam przyjaciela, który 
budował stoliki do kawy i dekorował ich powierzchnie częściowo spalonymi zapałkami. 
Jeśli zechciałby zająć się pracą projektanta WWW, zachęcałbym go, aby umieścił te projekty 
w swoim portfolio.

Elliot Jay Stocks: Zbuduj portfolio. Stwórz strony WWW dla zespołów rockowych swoich 
kumpli albo dla sklepu z materiałami do szydełkowania przyjaciółki twojej mamy. Być może 
ta praca nie będzie spektakularna, ale będzie stanowić solidny początek twojego portfolio, 

background image

ROZDZIAŁ 12

138

a w każdym kolejnym projekcie zdobędziesz mnóstwo doświadczenia. Gdy ja skończyłem 
studia i zacząłem swoją pierwszą pracę, moje portfolio składało się wyłącznie z rzeczy, które 
robiłem „na boku” w czasie trwania studiów, nie było tam żadnych projektów związanych ze 
studiami. Nie zapominaj jednak, że przede wszystkim chodzi o jakość, nie o ilość, a dobre 
portfolio powinno być jednocześnie różnorodne (pokazując, że jesteś wszechstronny) 
i spójne (pokazując twoją osobowość jako projektanta).

Walter Apai: Ważne jest, abyś rozwijał swoją wiedzę w obszarach związanych 
z projektowaniem. Większość kursów projektowania koncentruje się na podstawach 
lub na sposobach użycia konkretnych aplikacji. To są jedynie podstawowe narzędzia 
dla początkującego projektanta, ale nie są w stanie uczynić kogokolwiek doskonałym 
projektantem.

Ucz się na temat sztuki, układu i kompozycji, staraj się czytać przynajmniej jedną 
książkę poświęconą projektowaniu miesięcznie, a nawet jedną na tydzień. Obserwuj 
blogi poświęcone projektowaniu, jak Smashing Magazine i Webdesigner Depot, i nigdy 
nie przestawaj się uczyć. Aktualizuj swoją wiedzę, gdy to tylko możliwe, uczestnicząc 
w konferencjach, czytając książki i magazyny i angażując się w działalność lokalnej 
społeczności artystycznej. Postaraj się zostać jak najbardziej uniwersalnym projektantem, 
a nie jedynie sprawnym operatorem Photoshopa czy innego programu do projektowania.

George Lois, inspiracja Dona Drapera z Mad Men, ujął to doskonale:

Komputery z Photoshopem wykonały doskonałą robotę przy niszczeniu kreatywności. 
Każdy teraz myśli, że jest projektantem.

Być może nieco to uogólnił, ale sądzę, że chodziło mu o to, iż nie możesz być 
projektantem bez zrozumienia podstaw sztuki i projektowania.

Jacob Gube: Gdy uczyłem się w college’u, w mojej karierze naprawdę pomogło mi 
zdobywanie doświadczenia w prawdziwej pracy freelancera na część etatu. Chodziło 
mi o uzyskanie dwóch rzeczy: doświadczenie na własnej skórze, jak to jest pracować 
z prawdziwymi klientami, którzy mogą zostać twoimi pracodawcami po zakończeniu szkoły, 
oraz zastosowanie w praktyce tego, czego nauczyłem się w szkole. To pozwala utrwalić 
wiedzę i pomaga zrozumieć ją w praktyce. Takie podejście pozwala też uzyskać kilka wpisów 
w portfolio, które możesz pokazać potencjalnym pracodawcom, no i oczywiście zdobyć 
pieniądze na drogie podręczniki.

background image

WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW

139

CO CHCIAŁBYŚ WIEDZIEĆ, GDYBYŚ MÓGŁ SIĘ COFNĄĆ W CZASIE 
DO POCZĄTKU SWOJEJ KARIERY?

Darren Hoyt: Znać swoje ograniczenia i poziom umiejętności. Przez pierwszych kilka 
lat pracy projektanta WWW (od 1998 do 2001) wiedziałem, że istotne są uniwersalne 
umiejętności, dlatego budowałem doświadczenie w zakresie projektowania, jak również 
tworzenia kodu interfejsu (HTML, CSS). Ale później popełniłem błąd, myśląc, że jeśli 
chcę zostać wszechstronnym programistą i projektantem, muszę nauczyć się Perla, Flasha 
i administracji Uniksem. Byłem kiepski w tych rzeczach, ale nadal próbowałem nieudolnie 
to ciągnąć, aż ktoś poprosił mnie, żebym przestał.

W głębi serca wiedziałem, że nie byłem stworzony do zadań tego typu. A co ważniejsze, 
nie interesowało mnie to — w każdym razie nie tak bardzo jak projektowanie. Pracodawcy 
cenią uniwersalnych pracowników, ale nie wówczas, gdy wyniki ich pracy są miernej jakości.

David Leggett: To praktycznie niemożliwe, żeby zadowolić wszystkich. Bądź przyjacielski 
wobec tych, którzy cenią sobie twoją pracę, a jeszcze bardziej przyjacielski wobec tych, 
którzy ją krytykują.

Jacob Gube: Żałuję, że nie uświadamiałem sobie, że jakość jest ważniejsza od ilości. 
Gdy zaczynałem, skupiałem się na dużej liczbie średnio płatnych zleceń, co w efekcie 
spowodowało konieczność pracy po nocach, braki fi nansowe i to, że nie miałem ani jednego 
projektu, który mógłbym pokazać w swoim portfolio. Chciałem pracować z jak największą 
liczbą osób i nad jak największą liczbą projektów, żeby nadać impet swojej karierze. 
Ale tu ma zastosowanie pewna zależność: zacząłem od szybkich i tanich rzeczy, zatem 
przychody były słabe. Gdybym nieco zwolnił i skupił się na zdobyciu zleceń, które byłyby 
dla mnie interesujące i miały wyższą jakość, z pewnością rozwijałbym się w sposób bardziej 
efektywny.

Paul Boag: Żałuję, że nie wiedziałem o tym, że ograniczenia są dla mnie dobre. Jako student 
projektowania WWW miałem nieograniczoną wolność w zakresie projektowania: robiłem, 
co chciałem i jak chciałem. Jednak prawdziwe życie takie nie jest. Gdy zaraz po skończeniu 
uczelni zatrudniłem się w fi rmie IBM, moja pierwsza praca polegała na projektowaniu 
8-bitowych ikon. Bardzo ograniczające zajęcie. Gdy zacząłem pracować z WWW, do 
dyspozycji były tylko szare tła i możliwość wyrównania tekstu do lewej, prawej lub 
wycentrowania. Moja pierwsza praca nad multimedialną płytą CD uwzględniała pliki wideo 
o rozdzielczości 160×120 pikseli.

Wówczas strasznie mnie to frustrowało. Jednak z perspektywy czasu uważam, że to było 
dla mnie bardzo korzystne doświadczenie. Wpłynęło na rozwój mojej kreatywności 
i nauczyło cierpliwości, która niezwykle przydała się w walce ze specyfi cznym podejściem 
do standardów w przeglądarkach, przede wszystkim IE6.

background image

ROZDZIAŁ 12

140

JAKIE SĄ TWOJE SUGESTIE DOTYCZĄCE POSZUKIWANIA PRACY 
PRZEZ ABSOLWENTÓW?

Soh Tanaka: Przede wszystkim przygotuj portfolio i wybierz do niego swoje najlepsze 
prace. Jeśli nie masz odpowiednich przykładów, zacznij od przygotowania projektu na 
własne potrzeby (strony internetowej poświęconej hobby, rodzinie lub przyjaciołom). 
Jako absolwent musisz udowodnić, że jesteś poważny i zaangażowany, najlepszym środkiem 
przekazu tego typu informacji jest solidne portfolio.

Po drugie, przeglądaj ogłoszenia o pracę i wyślij swoje CV i listy motywacyjne do fi rm, 
w których chciałbyś pracować. Bardzo istotna jest analiza każdej oferty i odpowiednie 
konstruowanie CV i listów motywacyjnych. Skupiaj się na wymaganiach oferty i dokładnie 
stosuj się do zaleceń. Pracodawcy otrzymują dziennie wiele ofert, a w pracy rekrutora nie 
ma nic gorszego niż nudne, ogólnikowe CV. Staraj się wyróżnić spośród reszty.

Po trzecie, rozwijaj sieci znajomości i daj się poznać. Sieć to podstawa.

Darren Hoyt: Oczywiście stale przeglądaj lokalne oferty pracy, ale także śledź blogi 
i Twittera ulubionych projektantów WWW. Studiowanie ich technik pozwoli ci zdefi niować 
drogę, jaką chcesz podążać. Jeśli potrzebujesz porady, spróbuj wysłać im e-maila. 
Ale pamiętaj, że nie każdy ma czas na to, aby ci odpowiedzieć.

Na szczęście większość projektantów, których znam, nie zdobyła pracy, wysyłając jedno 
CV do agencji. Wręcz przeciwnie, stopniowo budowali powiązania z ludźmi o podobnych 
zainteresowaniach, aż zaczęli znajdować okazje i pojawiły się oferty.

Jednak dobrze jest pamiętać, że nie warto tworzyć sieci znajomości w sposób paniczny. 
To zawsze wygląda podejrzanie i każdy zgadnie, że masz nóż na gardle. Po prostu nawiązuj 
znajomości z ludźmi, z którymi masz wspólne zainteresowania, których możesz sobie 
wyobrazić jako kumpli, a nie kontakty biznesowe. Korzyści z takiej postawy są znacznie 
większe.

Chris Coyier: Nikt nie wynajmie cię do pracy tylko dlatego, że go zapewnisz, iż masz 
umiejętności. Musisz umieć je zademonstrować, więc doskonal swoją stronę WWW albo 
zbuduj nową. Użyj tej strony w charakterze portfolio i CV, które będziesz wysyłać do 
pracodawców. Wysyłaj do fi rm, które zatrudniają, i do tych, które się nie ogłaszają. Jeśli 
fi rma nie wywiesza tabliczki: „Szukamy pracownika”, nie oznacza to, że nie przyda im się 
ktoś o odpowiednich umiejętnościach. Zachęcaj ich. Mała porada dotycząca portfolio: trzy 
niesamowite projekty są lepsze niż trzy niesamowite i sześć byle jakich pokazanych na tej 
samej stronie. Chwal się tylko najlepszymi pracami. Jakość jest ważniejsza od ilości.

background image

WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW

141

CO POCZĄTKUJĄCY PROJEKTANT POWINIEN WZIĄĆ POD UWAGĘ, 
WYBIERAJĄC MIĘDZY PRACĄ DLA AGENCJI A KARIERĄ FREELANCERA?

Elliot Jay Stocks: Rozpoczęcie kariery freelancera zaraz po zakończeniu studiów to kuszący 
pomysł. Mało brakowało, a tak bym zrobił. Ale cieszę się, że do tego nie doszło. Pracując dla 
kogoś innego, uczysz się wielu wartościowych rzeczy i jest ci znacznie łatwiej, ponieważ nie 
musisz się martwić o zdobywanie klientów. Osobiście więc doradzam pracę w fi rmie, zanim 
zdecydujesz się przejść na zarabianie na własną rękę. To doskonała okazja do zbudowania 
portfolio bez konieczności martwienia się o te wszystkie nudne rzeczy, które musisz robić, 
prowadząc własny biznes.

Soh Tanaka: Dla początkującego projektanta praca w agencji czy też w zespole to doskonała 
okazja do nauki i wyczucia rynku. Wady tej opcji są takie, że nie ustalasz własnych 
godzin pracy i z reguły nie możesz pracować z domu, do zalet natomiast należy zaliczyć 
systematyczny dopływ gotówki i ubezpieczenie zdrowotne, co stanowi solidną podstawę 
w czasach twardej ekonomii.

Wybierając pracę w charakterze freelancera, powinieneś mieć już jakieś doświadczenie 
i być gotowy do samodzielności. Istotnym czynnikiem sukcesu jest świadomość własnych 
umiejętności i dyscyplina pracy. Żywot freelancera ma swoje wady i zalety i musisz być 
dobrze zmotywowany i zdeterminowany do pokonywania przeciwności. Praca z domu 
i ustalanie własnych godzin pracy są marzeniem większości z nas, ale początkujący 
projektanci powinni wziąć pod uwagę rzeczywiste wymagania tego typu pracy, zanim 
zdecydują się wybrać tę formę. Dobrym pomysłem jest praca freelancera na część etatu do 
czasu, gdy zdobędziesz wystarczająco dużo pewności siebie, doświadczenia i świadomości 
własnych silnych i słabych stron, aby móc podejmować właściwe decyzje, będąc zdanym na 
samego siebie.

Chris Spooner: Warto poznać na własnej skórze wady i zalety pracy w agencji oraz pracy 
w charakterze freelancera, ponieważ obie formy znacznie się od siebie różnią! Oto kilka 
z nich, które przychodzą mi na myśl w pierwszej chwili.



Zalety pracy w agencji:

 

Š

Praca w agencji po zakończeniu studiów może być doskonałą formą zdobywania 
doświadczenia i poznawania mechanizmów rynku oraz metodologii prowadzenia 
projektów od początku do końca.

 

Š

W agencji pracujesz wśród kolegów o podobnym nastawieniu, od których możesz 
się uczyć i rozwijać wraz z nimi.

 

Š

Duże agencje często przyciągają wielkie korporacje i znane marki.

 

Š

Praca na pełny etat gwarantuje stałą pensję i ustaloną liczbę godzin pracy.

background image

ROZDZIAŁ 12

142



Wady pracy w agencji:

 

Š

Możesz wylądować w projektach, które nie będą dla ciebie ciekawe, a nawet być 
zmuszonym robić coś, z czym się nie zgadzasz.

 

Š

Agencje czasem mają sztywne zasady, reguły i zalecenia. Na przykład przeglądanie 
stron WWW, sprawdzanie Facebooka czy siedzenie na Twitterze mogą być niemile 
widzianymi aktywnościami w pracy.

 

Š

Agencje pracują najczęściej w godzinach od 9:00 do 17:00, będziesz musiał się 
zatem dostosować.



Zalety pracy freelancera:

 

Š

Jako wolny strzelec masz pełną kontrolę nad przyjmowanymi projektami i typem 
wykonywanej pracy.

 

Š

Nie jesteś związany ustalonymi godzinami pracy, dzięki czemu wzięcie dnia 
wolnego nie stanowi problemu.

 

Š

Jeśli możesz zapewnić sobie stały dopływ projektów, zarabianie sensownych 
pieniędzy będzie znacznie łatwiejsze niż w przypadku pracy w agencji.



Š

Możesz pracować w pidżamie!



Wady pracy freelancera:

 

Š

Jesteś osobiście odpowiedzialny za swoje dochody, co zwiększa poziom ryzyka.

 

Š

Freelancer musi umieć zarządzać swoim czasem i unikać rozpraszania uwagi.

Początkującym projektantom sugeruję, aby w pierwszej kolejności poszukali zatrudnienia 
w fi rmie, co da im doświadczenie zawodowe i niezbędną wiedzę fachową. Po jakimś czasie 
będą w stanie zdecydować, czy lepiej im będzie w agencji, czy też na własną rękę.

Jedna z ważniejszych rzeczy, które warto wziąć pod uwagę przed rozpoczęciem pracy 
w charakterze freelancera, to poziom doświadczenia: czy będziesz w stanie nie tylko tworzyć 
projekty, ale jeszcze poszukiwać zleceń, zarządzać kilkoma projektami naraz i komunikować 
się z klientami? Te dodatkowe obowiązki są czymś oczywistym w pracy freelancera, dlatego 
przed rozpoczęciem tego typu działalności warto mieć przynajmniej podstawową wiedzę na 
ich temat.

background image

WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW

143

W JAKI SPOSÓB STUDENCI I POCZĄTKUJĄCY PROJEKTANCI MOGĄ ZWIĘKSZYĆ 
SWOJĄ WARTOŚĆ W OCZACH POTENCJALNYCH PRACODAWCÓW?

Darren Hoyt: Zacznij budować swoją obecność w sieci tak wcześnie, jak to tylko możliwe, 
nawet zanim zaczniesz poszukiwać pracy. Wykup prywatną domenę i zbuduj proste 
portfolio ze stroną „O mnie” zawierającą prezentację twojej osobowości i talentów. Jeśli 
nie masz żadnych przykładów zleceń dla klientów, zaangażuj się w niepłatne projekty 
dla przyjaciół — będą stanowiły twoje portfolio do czasu, gdy zgromadzisz jakieś próbki 
komercyjne. Publiczna prezentacja tych efektów pokazuje, że jesteś dumny ze swojej pracy.

Bądź oszczędny w słowach. Pracodawcy są ludźmi jak każdy z nas: są zapracowani 
i mają nietrwałą uwagę. Nie zmuszaj ich do przekopywania się przez wielkie dokumenty 
w poszukiwaniu informacji o tobie. Umieść w portfolio tyle tekstu, ilustracji i przykładów, 
ile to niezbędne, aby zobrazować to, co chcesz opowiedzieć o sobie. Jeśli nie umiesz nadać 
autoreklamie klarowności i zwartości, trudno oczekiwać, żeby pracodawca uwierzył, 
że potrafi sz to zrobić dla innych.

Nie przesadzaj w prezentacji swoich umiejętności. Nasze życia stały się ostatnio stanowczo 
zbyt publiczne. Od przechwalania się czy olśniewania innych półprawdami znacznie 
ważniejsze jest znalezienie ludzi o podobnych potrzebach i zainteresowaniach. Jeśli 
zostaniesz zatrudniony w oparciu o fałszywe przesłanki, zmarnujesz czas swój i innych. 
Nawet doświadczeni projektanci ze wspaniałymi portfolio nie nadają się (biorąc pod uwagę 
względy osobowościowe) do każdej pracy i każdej agencji, do której wyślą swoje CV.

Wolfgang Bartelme: Jak wspomniałem wcześniej, jestem wielkim fanem podejścia 
interdyscyplinarnego. W większości fi rm będziesz musiał pracować na kilku płaszczyznach 
jednocześnie. Zajmując się projektowaniem WWW, warto umieć tworzyć estetyczne 
ikony czy przygotować prosty screencast albo wideo promocyjne. Takie umiejętności 
stają się jeszcze istotniejsze w przypadku, gdy pracujesz na własny rachunek. Co więcej, 
różnorodność pozwala uniknąć rutyny, w każdym razie tak jest w moim przypadku.

Chris Coyier: Jeśli jesteś miłą osobą, z którą dobrze się pracuje, to już dużo. Myślę, 
że pracodawcy podczas rozmowy kwalifi kacyjnej również zwracają uwagę na takie sprawy, 
o ile możliwe jest poznanie człowieka od tej strony w tak krótkim czasie. Z mojego
doświadczenia wynika, że studia projektowe są stosunkowo przyjazne i mają nieformalną 
atmosferę. I z innej beczki: staraj się być świetny w jednej rzeczy. Będziesz o wiele 
cenniejszym pracownikiem, jeśli znasz jedno zagadnienie naprawdę dogłębnie, niż ktoś, 
kto zna się na wszystkim „po łebkach”. Oczywiście jeśli znasz się świetnie na wszystkim, 
to niesamowite, ale nie gorzej wyjdziesz na tym, gdy będziesz specjalistą w wąskim zakresie.

background image

ROZDZIAŁ 12

144

Walter Apai: W kontaktach z potencjalnymi klientami niezbędne są dobre umiejętności 
interpersonalne. Projektanci powinni wiedzieć, co robią ich klienci, i oferować im jak 
najlepsze usługi.

Zachęcam wszystkich projektantów do tego, żeby starali się oferować klientom wszystko 
z zakresu projektowania WWW. Taka oferta powinna obejmować projektowanie strony 
WWW, pisanie tekstów, przygotowanie projektów do druku itp. Jeśli nie znasz się na 
niektórych z tych zagadnień, nawiąż współpracę z kimś, kto może ci pomóc.

Projektanci powinni skupić się na uproszczeniu całego procesu z punktu widzenia klienta, 
ale też powinni angażować klientów w niektóre decyzje, dzięki czemu będą się oni czuli 
częścią projektu.

Sugeruję zadawać klientom wiele pytań i starać się poznać szczegóły ich biznesu, dzięki 
czemu zrozumiesz, co będzie dla nich właściwe. Im lepiej zrozumiesz klienta i jego projekty, 
tym skuteczniejszy będziesz w swojej pracy i tym większa szansa, że w przyszłości klient 
zdecyduje się wybrać właśnie ciebie do nowych zleceń.

Projektant to też człowiek. Stań się dobrym projektantem, poznaj swoje medium, edukuj się 
i staraj się być wszechstronną osobą o wysokich ambicjach.

Zdefi niuj standardy dla siebie i swojej pracy. Właściwi klienci będą chętniej nawiązywać 
współpracę z kimś, kto szanuje siebie i swoją pracę.

NA CZYM POWINNI SIĘ SKUPIĆ POCZĄTKUJĄCY PROJEKTANCI 
W PIERWSZYCH MIESIĄCACH SWOJEJ KARIERY?

Paul Andrew: Zbuduj sobie biznesplan. Naprawdę żałuję, że nie miałem go, gdy sam 
zaczynałem. Rzuciłem się na oślep i nieźle się sparzyłem. Zabolało. Być może między 
innymi właśnie ta porażka napędza mnie do dnia dzisiejszego. Ten okres miał negatywny 
wpływ nie tylko na moje fi nanse i pewność siebie, ale też poważnie naruszył moją reputację. 
Coś takiego trudno jest odzyskać. Uważam, że z czasem udało mi się odbudować utracone 
wartości, ale było ciężko i mogłem tego uniknąć przy odrobinie dobrego planowania 
i strategii biznesowej.

Nie wystarczy mieć strategię w głowie, trzeba ją przenieść na papier. Musisz ją czytać, 
widzieć i żyć z nią. Czytaj ją co jakiś czas, żeby wrócić na właściwy tor. Za jakiś czas znów ją 
przeczytaj, a poprawki wprowadzaj wyłącznie, gdy jest to konieczne.

Twój osobisty biznesplan może mieć na przykład następującą postać:



opisz swoje cele biznesowe, kierunek rozwoju i pozycję rynkową za kilka miesięcy;



wymień wszystkie potencjalne pułapki i sposoby ich uniknięcia;



określ cele w sposób uczciwy i realistyczny, zastosuj pewną dozę elastyczności;

background image

WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW

145



wraz z rozwojem biznesu analizuj swoje osiągnięcia i porównuj je z celami 
biznesowymi;



ustal limity fi nansowe do oceny tego, czy biznes zarabia (lub traci);



opisz, w jaki sposób planujesz prowadzić biznes w celu osiągania celów fi nansowych.

Każda osoba i każdy biznes są inne. Zapisz, co jest dla ciebie właściwym i osiągalnym celem, 
i bądź uczciwy — w końcu to twój biznes. Trzymaj się planu!

Brian Hof: Zanim zdecydowałem się na zawód freelancera, przepracowałem prawie trzy 
lata w fi rmie. W biurze spędzałem czas od 9:00 do 17:00, wracałem do domu, jadłem obiad, 
wykonywałem działania marketingowe (blog), szukałem nowych zleceń, ogłaszałem się 
i pracowałem od 19:00 do około północy. Dobra orientacja w tym, co cię czeka, jest bardzo 
ważna, zanim rzucisz się w wir pracy na własny rachunek.

Nie mniej ważne jest oszczędzanie pieniędzy. Każdy biznes, nieważne w jakiej branży, 
przechodzi przez okresy posuchy. Pieniądze odłożone na przetrwanie ciężkich chwil to 
konieczność. Nie każdy nadaje się do zawodu freelancera. Działalność tego typu na część 
etatu przy stałej, systematycznie płatnej pracy na etacie pomoże zdobyć rozeznanie.

Chris Spooner: Uważam, że w karierze freelancera najważniejsze są nie pierwsze miesiące, 
ale czas, zanim zaczniesz. Jako freelancer będziesz potrzebował solidnego przepływu zleceń, 
aby systematycznie generować przychód, dlatego wcześniej musisz ciężko pracować nad 
promocją i budowaniem marki. Gdy jesteś gotowy rzucić pracę, musisz być przygotowany 
na to przełączenie się: z pracy na etacie na pracę na własny rachunek.

W okresie budowania zaplecza dla pracy w charakterze freelancera musisz stworzyć 
swoją markę — przede wszystkim stronę WWW, na której będziesz prezentował swoje 
dokonania i umiejętności. Budowanie prestiżu w branży może odbywać się z użyciem 
bloga, pisania gościnnych artykułów dla innych serwisów i budowania sieci na Twitterze 
(oraz bezpośredniej sieci znajomości na rynku lokalnym) oraz przez przyjmowanie zleceń, 
które będziesz realizować nocami. Utrzymanie stałej, dziennej pracy i prowadzenie zleceń 
freelancerskich może być niełatwym zadaniem, ale gdy liczba zleceń osiągnie odpowiedni 
poziom, możesz szybko przełączyć się na pracę freelancera w pełnym wymiarze. Tak będzie 
o wiele bezpieczniej, niż zdecydować się z dnia na dzień i być skazanym na jedzenie fasoli
z grzankami do czasu, gdy zbudujesz portfolio i zdobędziesz odpowiednią liczbę klientów.

Jon Phillips: Uważam, że pierwsze miesiące są krytyczne, szczególnie biorąc pod 
uwagę konieczność rezygnacji z pracy i poświęcenia całego czasu na zawód freelancera. 
Na początku to może być nieco przerażające. W tych pierwszych miesiącach musisz zrobić 
wiele rzeczy, ale oczywiście wiele błędów, jakie popełnisz, da się później odkręcić. Jeśli 
podejmiesz błędną decyzję, zawsze masz możliwość naprawienia tego z czasem. Mocno 
sugeruję stworzenie solidnej strony portfolio, nawet jeśli nie masz za wiele do pokazania — 
pokaż to, co możesz. Wykorzystaj dobry system do fakturowania, nawiąż kontakty z innymi 

background image

ROZDZIAŁ 12

146

freelancerami na Twitterze, Facebooku, forach i blogach dla projektantów, a nawet załóż 
własny blog.

Elliot Jay Stocks: Pracuj dla kogoś innego! Jeśli chcesz osiągnąć sukces już w pierwszych 
miesiącach, musisz mieć odpowiednią liczbę zleceń, dlatego ważne jest, abyś zdobył je, 
zanim w pełni poświęcisz się pracy na własny rachunek. Sugeruję też znalezienie dobrego 
księgowego oraz dobrego systemu do śledzenia stanu fi nansowego. Ważna jest też strona 
WWW.

NA JAKICH ZAGADNIENIACH ZWIĄZANYCH Z PROWADZENIEM 
WŁASNEGO BIZNESU NALEŻY SIĘ SKUPIĆ NAJBARDZIEJ?

Paul Andrew: Przez lata otrzymywałem różne porady związane z pracą freelancera. 
Niektórzy sugerowali mi, żeby skupiać się na stronie biznesowej, bo tam są pieniądze i to 
pozwoli mi utrzymać się na powierzchni. Inni sugerowali natomiast, że najważniejsza jest 
sfera zawodowa i że powinienem skupiać się na tym, co mi daje satysfakcję, a biznes zadba 
sam o siebie.

Obie te fi lozofi e są ciekawe, ale niestety w rzeczywistym świecie po prostu nie działają. 
Jedyne skuteczne podejście stanowi zdrowa równowaga między nimi oboma. Biznes i praca 
muszą być traktowane osobno, ale muszą też się wzajemnie uzupełniać. Pomyśl o nich jak 
o dodatnim i ujemnym ładunku baterii. Bateria działa tylko wówczas, gdy obydwa bieguny
są połączone (a decyzję o tym, co jest plusem, a co minusem w odniesieniu do pracy 
freelancera, podejmiesz sam).

Gdy spotykasz się z potencjalnymi klientami, pierwsze wrażenie naprawdę się liczy 
i powinieneś starać się wypaść w sposób profesjonalny. Nie ma znaczenia, jak dobre jest 
twoje portfolio albo kim jesteś, liczy się to, jak wypadniesz z punktu widzenia biznesowego. 
W końcu negocjujesz transakcję biznesową.

Tak, to niestety wiąże się z koniecznością zerwania ze stereotypem projektanta WWW 
noszącego T-shirty i dżinsy na rzecz gładko ogolonego, noszącego garnitur i dbającego 
o maniery. Noś wizytówki, a nawet aktówkę. Zrób wszystko, co konieczne, żeby klient
uwierzył, że traktujesz biznes poważnie.

Niektórych problemów nie musisz dźwigać na własnych barkach i należą do nich między 
innymi kwestie fi nansowe. Bądźmy realistami: kto rozumie takie rzeczy, jak podatki czy 
przepisy fi nansowe? Ja nie i, szczerze mówiąc, nie martwię się tym. Znajdź sobie dobrego 
księgowego. Nie są aż tak drodzy, być może kosztują twoją tygodniówkę w skali roku. 

background image

WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW

147

Jeśli weźmiesz pod uwagę potencjalne wysokości kar wynikających z błędnego rozliczenia 
podatków, księgowy okaże się dobrą inwestycją.

W świecie idealnym każdy twój kontrahent byłby uczciwy. W prawdziwym świecie 
zabezpieczenie integralności biznesu, pracy i ciebie samego powinno znaleźć się na 
kolejnym miejscu listy priorytetów. Należy uwzględnić to, że w pewnym momencie ktoś 
zechce wykręcić się z części albo z całości płatności za realizację kontraktu. Z tego powodu 
twoje umowy muszą być maksymalnie szczelne. W każdym kraju przepisy dotyczące usług 
tego typu są inne, upewnij się więc, że dobrze rozumiesz te przepisy, które dotyczą cię 
bezpośrednio.

Wynajęcie prawnika do napisania od zera wzoru umowy to dość kosztowny luksus. 
Można tego uniknąć, pisząc taki wzór samodzielnie. Ja tak zrobiłem. Poprosiłem o radę 
kilku projektantów, poszperałem w serwisach prawniczych online i w końcu udało mi się 
opracować szkielet umowy. Następnie poprosiłem prawnika o weryfi kację. Takie podejście 
było znacznie tańsze od zlecenia prawnikowi napisania wszystkiego. Szczerze mówiąc, 
mimo wszystko nadal było dość drogo, ale opłaciło się.

Podsumowując: ubierasz się ofi cjalnie i elegancko, fi nanse fi rmy są w bezpiecznych rękach, 
jesteś prawnie zabezpieczony — zostało zatem robienie tego, do czego się wyszkoliłeś: daj 
upust kreatywności, niech pasja wypełni twoje projekty. Przed tobą długa droga.

Brian Hof: Z pewnością warto zadbać o marketing. Otrzymuję wiele e-maili z pytaniem 
o to, w jaki sposób prowadzę swój biznes freelancerski i jak znajduję klientów. Moja
odpowiedź jest następująca: musisz o to ciężko zabiegać. Klienci nie przyjdą do ciebie. 
Pokaż wszystkim, co robisz, prowadź blog, bierz udział w wydarzeniach i konferencjach 
branżowych, kontaktuj się z klientami bezpośrednio. Prowadzenie biznesu to ciężki 
kawałek chleba. Możesz zapomnieć o 40-godzinnym tygodniu pracy. Ja pracuję siedem dni 
w tygodniu. Zdarza mi się nawet zdobywać nowe kontrakty, rozmawiając z kimś w barze 
(czego nie polecam). Musisz mieć odpowiednią osobowość, a uda ci się osiągnąć sukces 
w roli freelancera.

Jon Phillips: Bycie freelancerem to konieczność realizacji wielu funkcji. Warto spędzić nieco 
czasu na stronach rządowych i spotkaniach z księgowym, aby dobrze zrozumieć przepisy 
podatkowe. Oczywiście wielu projektantów jako ludzie kreatywni zapomina, że prowadzą 
biznes (mnie to się zdarza często). Musisz spędzać czas na rozliczeniach księgowych, ale też 
budując swoją sieć powiązań i reklamując swój biznes. W pierwszych miesiącach efekty będą 
skromne, ale w dłuższym okresie to ci się opłaci. Musisz być tak samo dobry w podliczaniu 
słupków liczb jak w obsłudze Photoshopa.

background image

ROZDZIAŁ 12

148

JAKIE SĄ NAJLEPSZE METODY, ŻEBY ZNALEŹĆ KLIENTÓW?

Henry Jones: Mogę opowiedzieć o moim doświadczeniu. Tuż przed rozpoczęciem 
pracy w charakterze freelancera w pełnym wymiarze czasu umieściłem moje portfolio 
w kilku popularnych galeriach szablonów CSS. Od tego momentu zaczęli zgłaszać się 
klienci. Byłem bardzo zaskoczony tym, jak wiele osób korzysta z tego typu galerii, aby 
znaleźć projektantów. Gdy już miałem kilku klientów i kilka ukończonych projektów, 
zaczęło się pojawiać coraz więcej zleceń. A więc: pracuj ciężko, aby stworzyć wspaniałe 
portfolio, i umieść je w galeriach projektów. To najlepsza i najłatwiejsza metoda, aby się 
zaprezentować. Jest też mnóstwo stron z ofertami pracy dla projektantów, na których 
możesz znaleźć odpowiedni projekt pod swoje możliwości.

Jon Phillips: Uważam, że wspaniałym miejscem, żeby zacząć, są takie strony jak Twitter. 
Tam właśnie znalazłem wielu moich klientów. Forum projektantów jest również doskonałym 
miejscem do tworzenia sieci przyjaciół, dającym możliwości znalezienia pracy. Młodzi 
projektanci mogą mieć ochotę na powalczenie o zlecenie w konkursach i crowdsourcingu, 
ale ja osobiście uważam to za psucie rynku i nie polecam tego. Nawet jeśli nie masz zbyt 
wielu projektów w portfolio, istnieją inne możliwości zdobycia kontraktu. W sieci możesz 
znaleźć wiele stron WWW z ogłoszeniami o pracę, na przykład na Smashing Magazine lub 
na FreelanceSwitch. Warto nawet pomyśleć o zakupie banera reklamowego na stronach 
internetowych związanych z projektowaniem. Ale twój budżet na marketing na początku 
kariery może być mocno ograniczony, więc portale społecznościowe, strony z ogłoszeniami 
o pracę oraz fora dyskusyjne będą dla ciebie najlepszym miejscem na początek.

Jacob Cass: Sprzedawaj swoje nazwisko. Zacznij pisać blogi. Pokaż swoją pracę. Zaglądaj 
na strony WWW z ogłoszeniami o pracę. Wypytuj przyjaciół, rodzinę, lokalne organizacje 
charytatywne. Czytaj książki i blogi. Informacji jest wszędzie pełno. Twoja praca jest na 
wyciągnięcie ręki!

Walter Apai: Sieci społecznościowe są jednym z najlepszych sposobów, ale również jednym 
z najbardziej znanych. Sugeruję, żeby rozmawiać ze wszystkimi znajomymi i wykorzystać 
każdą szansę, aby dowiedzieć się, co robią i jak zarabiają na życie. 

Pewnego razu tylko wspomniałem, że jestem projektantem stron WWW (wówczas nawet 
nie szukałem zleceń), a mój rozmówca natychmiast przypomniał sobie, że zna kogoś, 
kto potrzebuje zmienić projekt strony. Możliwości są wszędzie, trzeba je tylko umieć 
wykorzystać.

Należy również wspomnieć, że nie powinno się polegać tylko na samej sieci znajomości 
lub innym pojedynczym „systemie”. Zachęcam nowych projektantów do kompleksowego 
podejścia do swojej kariery.

background image

WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW

149

Możliwości zdobycia klientów są nieograniczone. Oferty na tablicach ogłoszeń, tych online, 
jak również i offl

  ine, jak gazeta lub lokalne czasopisma, to tylko przykłady mediów, które 

możesz wykorzystać. Osobiście uważam, że rozpoczęcie działalności od lokalnego rynku 
jest najlepsze. Dzięki temu zdobędziesz doświadczenie, pracując nad projektami z osobami, 
które możesz spotkać osobiście w swoim własnym mieście. Jest to dobry pomysł na zdobycie 
doświadczenia.

Paul Boag: Zacznij od przyjaciół oraz rodziny. Dzięki temu będziesz mógł zbudować swoje 
początkowe portfolio. Następnie, aby zdobyć doświadczenie z rzeczywistym klientem, 
zgłoś się do lokalnej organizacji charytatywnej. Zobaczysz, że dzięki kontaktom, jakie tam 
nawiążesz, niebawem cały wysiłek zacznie procentować i przy odrobinie szczęścia znajdziesz 
pracę. A co najważniejsze, inni dowiedzą się, że w ogóle szukasz pracy. Zadziwiające jest to, 
że freelancerzy na swoich stronach WWW, które przeglądałem, nie informują, czy aktualnie 
szukają pracy.

Uważam, że jeśli jesteś świeżo po studiach, powinieneś rozpocząć pracę dla małej agencji, 
zanim zaczniesz pracować na własny rachunek. Bycie freelancerem wymaga wielu 
umiejętności biznesowych, których nie uczą na uniwersytecie.

JAKICH WSKAZÓWEK DOTYCZĄCYCH BUDOWANIA SIECI SPOŁECZNOŚCIOWYCH 
UDZIELISZ POCZĄTKUJĄCYM PROJEKTANTOM?

Henry Jones: Jedną z opcji jest branie udziału w konferencjach dotyczących projektowania, 
lecz dla młodych projektantów może to być zbyt kosztowne. Polecam więc zaangażowanie 
się w projekty społecznościowe. Zacznij od czytania i komentowania popularnych 
blogów o projektowaniu. Załóż konto na Twitterze i zamieszczaj tam ciekawe materiały. 
W zależności od tego, jakim czasem dysponujesz, możesz również założyć swojego 
własnego bloga o projektowaniu. Prowadzenie bloga jest, według mnie, bardzo ważne 
i głęboko wierzę, że to najlepsza metoda, aby dać o sobie znać i poznać innych projektantów. 
Bez względu na to, jaką drogę wybierzesz, pamiętaj, aby zawsze starać się być pomocnym 
i autentycznym, tylko wtedy będziesz mógł zbudować wartościowe relacje.

Paul Andrew: Jeśli jesteś młody, będziesz chciał szybko odnieść sukces. W każdym 
biznesie, a zwłaszcza w naszym, potrzebujesz przyjaciół, kontaktów i, co najważniejsze, 
profesjonalnych relacji. Sieci kontaktów nie da się zbudować ot tak, to wymaga czasu 
i cierpliwości.

Najlepszy czas na rozpoczęcie tworzenia sieci znajomych jest właśnie teraz. Nawet jeśli jesteś 
jeszcze na studiach lub nawet jeśli jeszcze nie ukończyłeś szkoły średniej, zacznij działać 
już teraz. Nigdy nie jest za wcześnie, aby pozwolić innym poznać swoje nazwisko. Jest 
ono twoim ważnym narzędziem, czymś, co będzie się kojarzyć z osobą. Praca się znajdzie, 
obiecuję.

background image

ROZDZIAŁ 12

150

Najmocniejsze relacje tworzą się między kolegami z klasy. Bez względu na to, co się potem 
wydarzy, oni są twoją podstawową siecią kontaktów. Możecie sobie pomóc nawzajem, 
dzieląc się wiedzą i kontaktami oraz ucząc się od siebie.

Najlepszy sposób na poszerzenie sieci znajomych poza swoje wewnętrzne kręgi polega 
na nawiązaniu kontaktów z doświadczonymi projektantami. W większości przypadków 
projektanci są dość bezinteresowni oraz uwielbiają się dzielić wiedzą i pomagać, kiedy tylko 
mogą. Mając to na uwadze, ułóż listę projektantów, na których chcesz się wzorować, oraz 
takich, którzy mają już dość spory dorobek. Wyślij im e-maila wraz ze swoim portfolio, 
wyjaśniając, że jesteś młodym projektantem, który dopiero zaczyna i szuka porad. Zapytaj 
ich, jak rozpoczęli swoją karierę, i poproś o wskazówki. Doświadczeni projektanci również 
powinni rozbudowywać swoje sieci, więc zapewne zareagują na Twoje zaproszenie i pytania.

Kiery rozpoczynałem swoją karierę jako projektant, wysłałem list (z moim portfolio oraz 
wizytówką) do lokalnej agencji reklamowej — niekoniecznie największej czy najbardziej 
prestiżowej — i przedstawiłem się jako chętny do nauki młody projektant. Zapytałem, czy 
mogę wpaść na dzień lub dwa, aby dowiedzieć się co nieco o prowadzeniu projektu i zdobyć 
doświadczenie w tym zakresie. Szczęśliwie wyrazili zgodę i spędziłem u nich trzy dni na 
zadawaniu pytań, zbierając wizytówki i spotykając się z klientami. To było ponad dziesięć 
lat temu, a ja wciąż korzystam z tych kontaktów. Jak do tej pory był to dla mnie najbardziej 
wydajny i skuteczny okres w rozwijaniu sieci kontaktów.

Oczywiście nie każda agencja reklamowa będzie tak otwarta jak ta, do której ja napisałem, 
ale warto próbować. Nie ma nic złego w zadawaniu pytań.

Warto zapamiętać, że sukces nie jest określony przez liczbę kontaktów, a przez ich jakość. 
Nawet jeśli najlepszy projektant na świecie wysłał Ci uprzejmą odpowiedź, to wcale nie 
oznacza, że jesteś już w kręgu jego znajomych lub on w twoich. Wartościowe kontakty 
tworzą się, kiedy ktoś udzieli ci osobistej odpowiedzi i naprawdę stara ci się pomóc. 
Właśnie o takie kontakty musisz dbać. To jest twoja sieć.

Na koniec, nie obawiaj się, że twoja młodość i brak doświadczenia w jakimś stopniu cię 
ograniczają. Młodość daje ci przepustkę do zadawania pytań, nauki i rozwoju kontaktów 
osobistych.

Paul Boag: Odejdź od komputera. Komunikowanie się z ludźmi online jest fajne, nic jednak 
nie zastąpi kontaktu bezpośredniego. Bierz udział w konferencjach i poznawaj ludzi. Potem 
utrzymuj te znajomości na portalach społecznościowych, jak Twitter lub Facebook.

background image

WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW

151

Nie trzymaj się zbytnio jakiegoś z góry założonego planu. Jeśli już musisz, to bądź zawsze 
szczery i otwarty. Zbyt wielu ludzi tworzy sieci tylko po to, żeby zdobyć pracę lub stać się 
„gwiazdą internetu”. Zamiast tego twórz sieci, aby poznać podobnie myślących ludzi, którzy 
będą cię inspirować i motywować do pracy.

Soh Tanaka: Bierz udział w wydarzeniach branżowych, seminariach oraz wszelkiego 
rodzaju spotkaniach towarzyskich. Wykaż zainteresowanie, ucz się, a we właściwym czasie 
pozwól innym siebie poznać: kim jesteś i co potrafi sz. Noś zawsze przy sobie wizytówki 
i bądź zawsze przygotowany do prezentacji. Nigdy nie wiadomo, kiedy możesz spotkać 
potencjalnego klienta lub pracodawcę. Budowanie sieci społecznościowej jest jedną 
z metod poszerzania swoich możliwości, a w pracy projektanta taka umiejętność jest 
bardzo ważna.

Steven Snell projektuje strony od kilku lat. Aktywnie prowadzi kilka blogów, między innymi 
DesignM.ag, w którym regularnie publikuje artykuły na temat projektowania stron WWW.

background image

152

Skorowidz

A

accessibility, Patrz: dostępność
Ainley Nik, 27
Airey David, 34
AJAX, 63
Andrew Paul, 134
animacja, 17
Apai Walter, 134
aplikacja WWW, 56

biznesowa, 56, 61
cechy wspólne, 64
innowacyjność, 70, 71, 72, 73
otwarta, 56
raport, Patrz: raport
standardy, Patrz: projektowanie standardy
tabela, Patrz: tabela
zamknięta, 56

Apple, 51
arkusz stylów, Patrz: CSS
Arystoteles, 51

B

Bartelme Wolfgang, 133
barwa, Patrz: kolor
behavioral design, Patrz: projektowanie 

behawioralne

Bennett-Chamberlain Jesse, 32
biznesplan, 144
blog, 16, 27, 31, 35, 128
blok wprowadzający, 13, 14
Boag Paul, 133
Bordwell David, 51
budżet, 104
Buxton Bill, 59

C

Campbell Joseph, 38
Cass Jacob, 134
Cederholm Dan, 35
Chastain Cindy, 42, 46, 50
Cloninger Curt, 43, 46
CMS, 7, 8, 31, 56
Colbow Brad, 57
content management systems, Patrz: CMS

Cooper Alan, 44
Coyier Chris, 133
CSS, 71, 72, 73, 78
czat, 21

D

dane kontaktowe, 17
dashboard, Patrz: deska rozdzielcza
deska rozdzielcza, 64, 66
discount usability testing, Patrz: przecenione 

testy użyteczności

dostępność, 62, 104
Dunn Zach, 134

E

efekty przejścia, 17
emocje, 39, 40, 41, 50
experience theme, Patrz: motyw 

doświadczenia

F

Flash, 16, 17, 30, 78
fold, Patrz: linia zagięcia
forgiveness, Patrz: zasada wybaczenia
formularz, 64, 66

kontaktowy, 56
zamówienia projektu, 21

G

Gilroy Dan, 
Godin Seth, 34
Gregory Jamie, 30
grupa docelowa, 4, 119
Gube Jacob, 133

H

HBO, 52
hierarchia

stron, 26
wizualna, 26

Hof Brian, 134
Hoyt Darren, 134
HTML, 78

background image

SKOROWIDZ

153

I

interaktywność, 56, 65
interfejs użytkownika, 55, 57, 60

projektowanie, 58

J

JavaScript, 16, 17, 31, 73, 78
Jones Henry, 133
Jung Carl, 39

K

klient, 19, 28, 29, 34, 57, 67, 103, 109, 110, 111, 

112, 113, 114, 115

kolor, 81, 99

beżowy, 89, 91
biały, 88, 91, 100
brązowy, 89, 91, 100
ciepły, 82, 84
czarny, 87, 91, 100
czerwony, 83, 90
fi oletowy, 85, 86, 90
kość słoniowa, 90, 91
kremowy, 90, 91
neutralny, 87, 100
niebieski, 85, 86, 90
odcień, 99
podstawowy, 82, 85, 85
pomarańczowy, 83, 90
pośredni, 83, 85
szary, 88, 91, 100
zielony, 85
zimny, 85
żółty, 84, 90

komunikat potwierdzenia, 63
koszt utrzymania, 30
Krug Steve, 9, 57, 60
krytyka, 117, 120

konstruktywna, 118, 121

L

La Nick, 34
Laurel Brenda, 51
Leggett David, 133
linia zgięcia, 14, 24
logo, 13, 32
Lucas George, 38

M

marketing zorientowany na odbiorcę, 29, 42
McKee Robert, 51
metodologia zwinna, 58, 78
Meyer Kyle, 25
mitologia porównawcza, 38
Moll Cameron, 4
motyw doświadczenia, 42

N

nawigacja, 15, 25, 30

w formie menu, 13

Nielsen Jakob, 60
Nielsen Norman Group, 40
Norman Donald, 40

O

odbiorca, 28, 29
opcja wycofania operacji, 63
opinie klientów, 34
opowieści, 37, 41, 45, 46, 49, 50, 51
osobowość, 43, 49, 57
out-of-the-box layouts, Patrz: układ pływający

P

paleta, 91

analogiczna, 93
dopełniająca, 94
monochromatyczna, 92, 97
niestandardowa, 96
rozszerzona dopełniająca, 94
tetriada, Patrz: tetriada
triada, Patrz: triada
tworzenie, 97

Pellow Barbara, 29
persona, Patrz: osobowość
Phillips Jon, 133
podstrona

Jak pracujemy, 20
Klienci, 19
Kontakt, 20, 21
O nas, 18
Pytania i odpowiedzi, 21
Realizacje, 19
Usługi, 19

pokaz slajdów, 17
pole wyszukiwania, 16, 56

background image

SKOROWIDZ

154

portfolio, 11, 23

błędy, 24
cele, 26, 119
promocja, 35
reguły, 26
zarządzanie, 31

projektowanie

behawioralne, 40
budżet, Patrz: budżet
narratywne, 47
odwzorowawcze, 40
organiczne, 40
reguły, 60
standardy, 69, 77
wzorce, 65
zwinne, 58, 59, 78

prototyp, 60
przecenione testy użyteczności, 60

R

Rabinowitz Dorelle, 45, 53
raport, 65
referencje, 21, 126
refl ective design, Patrz: projektowanie od wzo-

ro waw cze

Robinson Matthew, 30
Roosendaal Marius, 31

S

Saatchi & Saatchi, 49
Saylor Christian, 42, 48
Schechner Richard, 48
SEO, 30
serwis społecznościowy, 5, 36, 125, 126, 131
Shedrof Nathan, 48
sieć społecznościowa, Patrz: serwis 

społecznościowy

Spooner Chris, 133
Stocks Elliot Jay, 133
storytelling, Patrz: opowieści
strona fi rmowa

cele 6, 119
kolorystyka 12
mapa 21
nagłówek 13
projektowanie 12

statyczna 31
zarządzanie 3, 7

studium przypadku, 16
system zarządzania treścią, Patrz: CMS
szkic, 59
szkielet, 59

T

Ta’eed Collis, 24, 28
tabela, 65
Tanaka  Soh, 133
testimonials, Patrz: opinie klientów
testy użytkowników, 7
tetriada, 95
Th

  e Six Scents, 51

triada, 95
Tuft e Edward, 

U

układ

blokowy, 13
pływający, 12, 16

user experience, Patrz: użytkownik 

doświadczenia

użyteczność, 104
użytkownik, 67

doświadczenia, 37, 41, 44, 45, 46, 50, 51
identyfi kacja, 43, 48, 57
interfejs, Patrz: interfejs użytkownika

V

Veen Jeff rey, 30
visceral design, Patrz: projektowanie 

organiczne

W

wireframe, Patrz: szkielet
Wroblewski Luke, 26, 64
wycofanie operacji, 63
wzorzec, Patrz: projektowanie wzorce

Z

zasada wybaczenia, 63
Zeldman Jeff rey, 2, 3


Document Outline