Graficzne projektowanie stron internetowych. Wywiad z grafikiem, Grzegorzem Bratkiem (cz.1)

Zapraszam do lektury I-szej części wywiadu ze świetnym grafikiem, Grzegorzem Bratkiem. Grzegorz posiada ogromne doświadczenie, ma na koncie około 300 zrealizowanych projektów.

Swoje portfolio zbudował projektując dla firm takich, jak: Grupa TVN, PTK Centertel, Polkomtel SA, PTC Sp. z o.o., Grupa Onet.pl.

Jak wygląda u Ciebie proces graficznego projektowania strony internetowej?

Projektowanie zaczynam od zapoznania się z dobrze napisanym, szczegółowym briefem. A przynajmniej chciałbym, żeby zawsze tak było.

Zdarza się jednak, że klienci nie potrafią skonkretyzować swoich potrzeb, nie mają pomysłu na własną stronę – wtedy staramy się wspólnie wypracować jakąś wizję, którą będę mógł przelać na wirtualny papier.

Kolejny etap to poszukiwanie i dobieranie odpowiednich zdjęć, tekstur, fontów, form i kolorów, w oparciu o które będę budował stronę. Jednocześnie staram się rozrysować różne koncepcje rozkładu elementów, by odnaleźć ten optymalny.

Nie jestem zwolennikiem projektowania kilku różnych wersji tej samej strony – moim zdaniem jest to strata czasu designera i pieniędzy klienta.

Następny krok to konsultacje z klientem i nanoszenie ewentualnych poprawek. Ta część pracy nierzadko jest najdłuższa i najbardziej stresogenna.

Potem – w oparciu o zaakceptowany projekt strony głównej – projektuję kolejne podstrony, by na końcu przekazać wszystko w ręce kodera wdrażającego projekt graficzny w działającą witrynę internetową.

Na każdym etapie pracy nieodzowne okazuje się też oglądanie projektu z wszelkich możliwych odległości i różnych perspektyw (z tego co wiem, jest to bardzo popularny „tik” u designerów stron www) oraz – co jest już działaniem w pełni uzasadnionym – wyświetlenie strony na różnych monitorach, najlepiej różnej klasy.

Pozwala to dobrać odpowiednią temperaturę barw oraz kontrast, który pozwoli zachować wysoką czytelność strony także na słabszym lub nieskalibrowanym sprzęcie.

Jakbyś zdefiniował dobry projekt? Po czym poznać projekt udany od średniego?

Dobry projekt to taki, który chętnie umieszczę w portfolio. Z przemyślaną, intuicyjną  nawigacją, czytelny, spełniający wszelkie wymagania postawione w briefie, a przy tym atrakcyjny wizualnie. Projekt udany zatrzymuje internautę na dłużej, średni nie pozostawia śladu w pamięci.

Czy i jak (jakie) wykorzystujesz siatki?

Solidnie przygotowany grid to podstawa dobrego projektu. Dzięki niemu nawet najbardziej zagmatwane wizualnie strony pozostają czytelne i łatwe w odbiorze.

Przyznam, że jestem w tym względnie niemiłosiernie pedantyczny. Bywa, że klientów to irytuje – najczęściej w sytuacji, kiedy nie chcę powiększyć ich logo, tłumacząc się właśnie zaburzeniem siatki.

Stosuję bardzo różne siatki , wszystko zależy od konkretnego projektu, zawartości i przeznaczenia strony . Najczęściej jednak jest to standardowe, szeroko znane i lubiane 960 px (ze względu na swoją podzielność) oraz 970 px – zwłaszcza w przypadku sklepów internetowych.

Na czym polega wg Ciebie równowaga projektu graficznego?

Projekt graficzny jest idealnie zrównoważony, kiedy strona przyciąga wzrok internauty, jest charakterystyczna i zapamiętywalna,  a jednocześnie pozwala mu skupić się na prezentowanej treści.

W procesie projektowym nie wolno zapomnieć, że to właśnie treść (rozumiana jako tekst, informacja, prezentacja usługi, produktu) jest najważniejsza, a cała oprawa graficzna to „tylko” tło.

Na czym polega jedność? spójność?

Spójność projektu można rozpatrywać na dwóch płaszczyznach. Z jednej strony jest to zachowanie jednolitego stylu graficznego, co przejawia się w wykorzystywaniu tylko ustalonej palety barw, typografii, form geometrycznych, podobnych stylistycznie zdjęć, czy ikon.

Druga kwestia to zgodność oprawy wizualnej z zawartością strony – treść musi znaleźć swoje odzwierciedlenie w grafice. Inaczej będzie wyglądać strona korporacyjna koncernu paliwowego, a inaczej blog nastoletniej fanki Tokio Hotel.

Na czym polega wyróżnienie?

Wyróżnienie polega na wizualnym wyeksponowaniu elementów, na które chcemy zwrócić szczególną uwagę widza. Osiąga się je na wiele sposobów – najczęściej na zasadzie kontrastu, akcentu.

Przykładem może być różnica w wielkości, zastosowanie innego fontu, kolor spoza gamy barw użytej na stronie czy odmienna tekstura tła.

Ważne, aby nie przesadzać z ilością jednocześnie eksponowanych elementów. Po pierwsze może to zdezorientować internautę („Hej, kliknij tutaj!”, „Nie, lepiej tutaj!”, „Nie, czekaj! Tutaj jest najlepsza promocja!”).

Po drugie mnogość wyróżnionych w podobnym stylu informacji sprawia, że takie wyróżnienie traci swoją moc i w efekcie staje się po prostu kolejnym (jednym z wielu na stronie) sposobem na prezentację treści.

W takim przypadku pojawia się  niebezpieczeństwo, że internauta pominie informację, którą staraliśmy się mu za wszelką cenę przekazać.

Jakie są najpopularniejsze układy stron? Jak je oceniasz?

Dawno temu niepodzielnie królował układ trójkolumnowy z główną, szeroką kolumną środkową i wąskimi bocznymi – lewą i prawą. Do tego oczywiście nagłówek i stopka. Nie można mu odmówić funkcjonalności, ale chyba wszystkim się nieco przejadł ;-)

Dzisiaj strony mają często dużo ciekawszą i bardziej zawiłą konstrukcję. Niektórzy projektanci w oparciu o te skomplikowane formy wypracowali nawet swój charakterystyczny, łatwo rozpoznawalny styl.

Ja zawsze staram się być elastyczny, w związku z czym stosuję bardzo wiele różnych układów – zależnie od typu strony: od prostych, jednokolumnowych galerii, po skomplikowane wielokolumnowe „konstrukcje” na potrzeby wortali i branży e-commerce.

Od pewnego czasu w projektowaniu stron modne stało się także wykorzystanie złotego podziału, z czego zresztą bardzo się cieszę – efektem są bardziej harmonijne projekty.

Co Cię inspiruje?

Prawdopodobnie w dobrym tonie byłoby powiedzieć, że inspiruje mnie piękno otaczającego nas świata, ekologia oraz muzyka klasyczna, jednak – choć wstyd się przyznać – dla mnie inspiracją często są magazyny dla kobiet (te z nieco wyższej półki) :-)

Po prostu jest w nich pełno świetnie zrobionych reklam, same w sobie też są bardzo dobrze zaprojektowane, a że ich męskich odpowiedników nie kupuję, to korzystam z zasobów żony.

Poza tym codziennie przeglądam Internet, a to zdecydowanie najlepsze i najczęściej aktualizowane źródło inspiracji.

Jak rozpoznajesz potrzeby klienta?

Wczytuję się w brief.  Niestety czasami  to nie wystarcza i rzeczywiste potrzeby klienta wyczytuję dopiero z korespondencji zawierającej litanię poprawek.

Jakie są ograniczenia w projektowaniu stron www? Rozdzielczość, waga grafiki, czy jeszcze coś innego?

Kwestie techniczne mogą oczywiście nieco „podcinać skrzydła” designerowi, ale generalnie od momentu, kiedy Internet Explorer zaczął sobie radzić z przezroczystością w plikach .png, można projektować dość swobodnie.

Nie obawiam się już dzisiaj klątw ciskanych w moim kierunku przez rozeźlonych koderów. Jakiś czas temu nieraz miało to miejsce, gdy trzeba było wdrożyć mniej standardowy projekt, a klient akurat zażyczył sobie bezwzględną kompatybilność z IE6.

Problem zbyt dużej wagi plików graficznych pojawia się dzisiaj głównie przy projektowaniu stron, które docelowo mają odnotowywać bardzo duży ruch.

Przy setkach tysięcy odwiedzin dziennie każdy zbędny kilobajt jest mocno niepożądany, trzeba więc nadal stosować sztuczki typu powtarzalne tło, czy mocną kompresję grafiki.

W przypadku pozostałych stron, dzięki coraz szerzej dostępnym i tańszym szybkim łączom internetowym, mało kto wzdryga się już na wieść o potrzebie załadowania np. rozbudowanego pliku tła o „masie” kilkuset KB, można więc graficznie poszaleć.

Tak naprawdę największym ograniczeniem nadal pozostaje wyobraźnia projektanta i w tej materii raczej nieprędko coś się zmieni.

PS
Kolejna część wywiadu już wkrótce.