Spis treści

Rozdział 1.

Przykra prawda o fi rmowych stronach internetowych

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

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

Nie chodzi o to, aby budować od zera

Twoja strona WWW nie musi podobać się wszystkim

Marnujesz pieniądze na serwisy społecznościowe

Twoja strona WWW nie jest tylko dla Ciebie

Powinieneś doceniać swój zespół WWW

Projekt WWW utworzony przez komitety jest samobójstwem

CMS nie jest cudownym rozwiązaniem

Za dużo treści

Podsumowanie

Rozdział 2.

Studium projektowe „Portfolio”
— wzorce oraz najnowsze trendy

Jasny czy ciemny projekt

Ile kolumn?

Blok wprowadzający

Wyrównanie układu

Położenie nawigacji

Pole wyszukiwania

Elementy Flash

Gdzie umieścić dane kontaktowe

Podstrona „O nas”

Podstrona „Klienci”

Podstrona „Usługi”

Podstrona „Realizacje”

Podstrona „Jak pracujemy”

Podstrona „Kontakt”

Specjały i dodatki

Inne odkrycia

Podsumowanie

SPIS TREŚCI

viii

Rozdział 3.

Tworzenie efektywnego portfolio online

Pułapka 1. Przegadanie

Pułapka 2. Za dużo informacji naraz

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

Pułapka 4. Nietypowa nawigacja

Pułapka 5. Bałagan wizualny

Reguły efektywnego projektu portfolio

Zdefi niuj swoje kryteria i strategie sukcesu

Rozważ stworzenie kilku portfolio

Zdefi niuj swojego odbiorcę

Ustal priorytet na użyteczność

Użyj właściwej technologii

Zaplanuj projekt

Ogranicz zakres i typ promowanych projektów

Informacje, dokumentacje i objaśnienia

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

Zawrzyj w projekcie swoją osobowość

Promuj swoją pracę

Opracuj cele długofalowe

Rozdział 4.

Uzyskanie lepszego user experience za pomocą opowieści

Wszystko zaczyna się od opowieści

Opisywanie projektu w opowieściach

Siła emocji

Podstawy wykorzystania opowieści do udoskonalania

user experience

Scalanie zespołów

Orientacja na użytkownika

Defi niowanie użytkownika

Zalety

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

Kilku gawędziarzy ery internetu

Dorelle Rabinowitz

Curt Cloninger

Christian Saylor

Cindy Chastain

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

Opakowanie: Apple

Marketing: Perfumy Six Scents

Architektura: Sklep HBO

Dane: Taxi 07: Roads Forward

Koniec jest początkiem tej opowieści

SPIS TREŚCI

Rozdział 5.

Projektowanie interfejsu użytkownika
na potrzeby biznesowych aplikacji WWW

Serwisy a aplikacje WWW

Różne typy aplikacji WWW

Poznaj swoich użytkowników

Jak zidentyfi kować użytkowników

Proces projektowania

Szkicowanie

Prototypowanie

Testowanie

Reguły projektowania

Nikt nie lubi niespodzianek

Użytkownicy powinni mieć możliwość

efektywnej pracy

Pomocy!

Brak satysfakcji

Kluczowe elementy aplikacji WWW

Formularze

Widok ogólny i szczegółowy

Deski rozdzielcze

Tabele

Raporty

Nie zapominaj o wzorcach projektowych

Studium przypadku: aplikacja banku online

Podsumowanie

Rozdział 6.

Stopniowe udoskonalanie i standardy WWW
nie ograniczają projektów

Nowiutkie technologie a stare dobre praktyki

Bałagan zwany WWW

Tworzenie celebrytów i miejsc,

w których chcielibyśmy być

Hollywood i reklamy niczego nas nie nauczą

Mit innowacji przez rozwój technologii

W innowacji nie chodzi o nowe zabawki

Korporacyjne wypaczenie innowacji i jego konsekwencje

Syndrom sztokholmski złych interfejsów

Nie chodzi o technologię albo projekt

Gdzie jest piękno sieci WWW?

Jeszcze raz: nasze problemy

SPIS TREŚCI

Dlaczego standardy mają znaczenie i co oznacza

„przestrzeganie standardów”

Stopniowe udoskonalanie działa

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

Razem możemy tego dokonać

Rozdział 7.

Teoria kolorów dla profesjonalnych projektantów

Ciepłe kolory

Czerwony (kolor podstawowy)

Pomarańczowy (kolor pośredni)

Żółty (kolor podstawowy)

Zimne kolory

Zielony (kolor pośredni)

Niebieski (kolor podstawowy)

Fioletowy (kolor pośredni)

Kolory neutralne

Czarny

Biały

Szary

Brązowy

Beżowy i jasnobrązowy

Kremowy i kość słoniowa

W skrócie

Tradycyjne palety barw

Monochromatyczna

Analogiczna

Dopełniająca

Rozszerzona dopełniająca

Triady

Podwójnie dopełniające (tetradic)

Niestandardowe

Tworzenie palet barw

Dlaczego odcienie są tak istotne

Dodawanie kolorów neutralnych

100

Najłatwiejsze w użyciu palety barw

100

Ilu kolorów użyć? 102

Podsumowanie

102

SPIS TREŚCI

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

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

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ół

ZDZIAŁ

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

ROZDZIAŁ 1

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.

PRZYKRA PRAWDA O FIRMOWYCH STRONACH INTERNETOWYCH

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.

ROZDZIAŁ 1

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

PRZYKRA PRAWDA O FIRMOWYCH STRONACH INTERNETOWYCH

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

ROZDZIAŁ 1

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

PRZYKRA PRAWDA O FIRMOWYCH STRONACH INTERNETOWYCH

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!

ROZDZIAŁ 1

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.

PRZYKRA PRAWDA O FIRMOWYCH STRONACH INTERNETOWYCH

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.

ZDZIAŁ

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.

ROZDZIAŁ 2

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 nas, Klienci, Usługi, Portfolio,
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

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

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.

ROZDZIAŁ 2

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

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

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%)

ROZDZIAŁ 2

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

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

Liczba wystąpień

łożeni

e o

ośnik

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

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.

W prawym pasku

W lewym pasku

W lewym górnym rogu

Brak strony z danymi kontaktowymi

W stopce

W prawym górnym rogu

Na środku strony

Liczba wystąpień

łożeni

e o

ośnik

ROZDZIAŁ 2

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

Rysunek 2.6. Warianty nazwy odnośnika do strony kontaktowej

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%)

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

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

ROZDZIAŁ 2

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.

STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY

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.

ROZDZIAŁ 2

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.

ZDZIAŁ

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ć.

ROZDZIAŁ 3

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). Podsunie Ci on doskonałe pomysły na temat
wykorzystania siatki do prezentacji dużej ilości informacji.

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

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) prezentuje 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ć

ROZDZIAŁ 3

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) Luke 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) omawia 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ń.

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

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). Jego 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.

ROZDZIAŁ 3

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

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

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.

ROZDZIAŁ 3

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.

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

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

ROZDZIAŁ 3

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.

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

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.

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

ROZDZIAŁ 3

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ść.

TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE

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.

ROZDZIAŁ 3

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.

ZDZIAŁ

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.

ROZDZIAŁ 4

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.

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

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”

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

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

ROZDZIAŁ 4

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.

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

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ą.

ROZDZIAŁ 4

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

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

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;

ROZDZIAŁ 4

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.

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

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)

ROZDZIAŁ 4

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.

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

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.

ROZDZIAŁ 4

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.

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

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.

ROZDZIAŁ 4

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.

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

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.

ROZDZIAŁ 4

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

UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI

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). Dokument 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

ZDZIAŁ

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.

ROZDZIAŁ 5

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.

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

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/).

ROZDZIAŁ 5

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ę.

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

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

ROZDZIAŁ 5

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

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

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ą.

ROZDZIAŁ 5

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.

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

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.

ROZDZIAŁ 5

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

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

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.

ROZDZIAŁ 5

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.

PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA

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.

ZDZIAŁ

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.

ROZDZIAŁ 6

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.

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

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?

ROZDZIAŁ 6

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.

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

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”.

ROZDZIAŁ 6

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;

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

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?

ROZDZIAŁ 6

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.

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

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:

ROZDZIAŁ 6

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

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.

STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW

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.

ZDZIAŁ

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.

ROZDZIAŁ 7

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ę

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

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

ROZDZIAŁ 7

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.

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

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

ROZDZIAŁ 7

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ść)

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

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

ROZDZIAŁ 7

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ść.

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

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ą

ROZDZIAŁ 7

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

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

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

ROZDZIAŁ 7

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

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

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

ROZDZIAŁ 7

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

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

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

ROZDZIAŁ 7

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

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

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)

ROZDZIAŁ 7

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ść

TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW

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

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.

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

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).

ZDZIAŁ

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.

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”.

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.

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.

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.

ZDZIAŁ

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.

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.

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”.

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.

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ę.

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ą!”.

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.

ZDZIAŁ

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.

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

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.

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.

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

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.

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

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.

ZDZIAŁ

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.

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?

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.

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.

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ć.

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.

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.

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.

ZDZIAŁ

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;

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

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

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.

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,

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.

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.

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.

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.

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.

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.

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;

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

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.

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.

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.

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ę.

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.

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.

152

Skorowidz

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

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

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

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

efekty przejścia, 17
emocje, 39, 40, 41, 50
experience theme, Patrz: motyw

doświadczenia

Flash, 16, 17, 30, 78
fold, Patrz: linia zagięcia
forgiveness, Patrz: zasada wybaczenia
formularz, 64, 66

kontaktowy, 56
zamówienia projektu, 21

Gilroy Dan,
Godin Seth, 34
Gregory Jamie, 30
grupa docelowa, 4, 119
Gube Jacob, 133

HBO, 52
hierarchia

stron, 26
wizualna, 26

Hof Brian, 134
Hoyt Darren, 134
HTML, 78

SKOROWIDZ

153

interaktywność, 56, 65
interfejs użytkownika, 55, 57, 60

projektowanie, 58

JavaScript, 16, 17, 31, 73, 78
Jones Henry, 133
Jung Carl, 39

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

La Nick, 34
Laurel Brenda, 51
Leggett David, 133
linia zgięcia, 14, 24
logo, 13, 32
Lucas George, 38

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

nawigacja, 15, 25, 30

w formie menu, 13

Nielsen Jakob, 60
Nielsen Norman Group, 40
Norman Donald, 40

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

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

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

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

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

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,

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

Veen Jeff rey, 30
visceral design, Patrz: projektowanie

organiczne

wireframe, Patrz: szkielet
Wroblewski Luke, 26, 64
wycofanie operacji, 63
wzorzec, Patrz: projektowanie wzorce

zasada wybaczenia, 63
Zeldman Jeff rey, 2, 3

Document Outline

SPIS TREŚCI
Rozdział 1. PRZYKRA PRAWDA O FIRMOWYCH STRONACH INTERNETOWYCH
Rozdział 2. STUDIUM PROJEKTOWE „PORTFOLIO” — WZORCE ORAZ NAJNOWSZE TRENDY
Rozdział 3. TWORZENIE EFEKTYWNEGO PORTFOLIO ONLINE
Rozdział 4. UZYSKANIE LEPSZEGO USER EXPERIENCE ZA POMOCĄ OPOWIEŚCI
Rozdział 5. PROJEKTOWANIE INTERFEJSU UŻYTKOWNIKA NA POTRZEBY BIZNESOWYCH APLIKACJI WWW
Rozdział 6. STOPNIOWE UDOSKONALANIE I STANDARDY WWW NIE OGRANICZAJĄ PROJEKTÓW
Rozdział 7. TEORIA KOLORÓW DLA PROFESJONALNYCH PROJEKTANTÓW
Rozdział 8. CZY TWÓJ KLIENT JEST TĘPY, CZY TEŻ PROBLEM LEŻY PO TWOJEJ STRONIE?
Rozdział 9. W JAKI SPOSÓB RADZIĆ SOBIE Z RÓŻNYMI TYPAMI KLIENTÓW
Rozdział 10. JAK SKUTECZNIE RADZIĆ SOBIE Z KRYTYKĄ
Rozdział 11. JAK WYKORZYSTAĆ SIECI ZNAJOMOŚCI
- DLACZEGO WARTO TWORZYĆ POWIĄZANIA?
- WSKAZÓWKI DLA PROJEKTANTÓW
Rozdział 12. WYWIAD GRUPOWY: PORADY EKSPERTÓW DLA STUDENTÓW I POCZĄTKUJĄCYCH PROJEKTANTÓW WWW
SKOROWIDZ

Wyszukiwarka

Podobne podstrony:
informatyka podrecznik projektantow www smashing magazine smashing magazine ebook
informatyka podrecznik projektantow logo smashing magazine gareth hardy ebook
Podrecznik freelancera Tajniki sukcesu niezaleznego projektanta stron WWW Smashing Magazine podfre
Podrecznik freelancera Tajniki sukcesu niezaleznego projektanta stron WWW Smashing Magazine
informatyka podrecznik freelancera tajniki sukcesu niezaleznego projektanta stron www smashing magaz
Podrecznik freelancera Tajniki sukcesu niezaleznego projektanta stron WWW Smashing Magazine podfre
Podrecznik freelancera Tajniki sukcesu niezaleznego projektanta stron WWW Smashing Magazine
Podrecznik freelancera Tajniki sukcesu niezaleznego projektanta stron WWW Smashing Magazine 2
Android UI Podrecznik dla projektantow Smashing Magazine andrui
Android UI Podrecznik dla projektantow Smashing Magazine
Android UI Podrecznik dla projektantow Smashing Magazine
Podrecznik HTML5 Smashing Magazine 2
Podrecznik HTML5 Smashing Magazine tfanh5
Projektowanie witryn internetowych User eXperience Smashing Magazine
Projektowanie witryn internetowych User eXperience Smashing Magazine 2
Projektowanie witryn internetowych User eXperience Smashing Magazine

więcej podobnych podstron

Podręcznik projektantów WWW Smashing Magazine

Document Outline