Etapy projektowania strony internetowej
3 min
3 min
Na skróty
Za sukcesem każdej strony, która plasuje się na czołowych miejscach w wynikach wyszukiwania i zamienia kolejnych odwiedzających w stałych klientów firmy, stoją web designerzy. Przedstawiamy, jak — krok po kroku — wyglądają kolejne etapy projektowania strony internetowej: od kontaktu z klientem do przekazania projektu programistom.
Niezależnie od tego, czy mówimy o projekcie strony internetowej, czy na przykład nowego biurowca w centrum miasta — pierwszym krokiem zawsze jest… rozmowa.
Poznanie oczekiwań klienta, zrozumienie jego potrzeb, zaproponowanie realnych do wdrożenia rozwiązań oraz wspólne określenie celów projektu — zanim zespół web designerów otworzy Sketcha i Figmę, musi przejść wraz ze zleceniodawcą przez wszystkie wymienione kroki. Większości informacji powinien na tym etapie dostarczyć szczegółowy brief, zawierający wytyczne klienta oraz wskazówki dotyczące docelowych odbiorców witryny.
Od strony wizualnej, warto, aby projektanci mieli możliwość jak najlepiej poznać charakter marki — czyli jej identyfikację wizualną. Jest to konieczne, aby późniejszy projekt rzeczywiście był spójny z wizerunkiem firmy oraz jej pozostałymi działaniami marketingowymi (na przykład kampaniami reklamowymi offline).
Na tym etapie niezwykle ważne jest także, aby klient w stu procentach zrozumiał kierunek, jaki zamierza podjąć designer. To zresztą jest jednym z największych wyzwań dla zespołu projektowego — pogodzenie własnej wizji z wizją zleceniodawcy. Zazwyczaj wykonawca przedstawia klientowi swoje inspiracje (zaczerpnięte chociażby z konkurencyjnych projektów) i na ich podstawie ustalają razem spójny kierunek projektu.
Zanim zespół projektowy przystąpi (wreszcie) do pracy, konieczne jest przygotowanie planu kolejnych etapów procesu projektowego. To szczególnie ważna kwestia przy okazji projektów, w które zaangażowane jest kilka zespołów — UX designerzy, graficy, specjaliści od SEO i copywriterzy.
Plan realizacji projektu strony internetowej może mieć strukturę kaskadową (waterfall) — polegającą na tym, że kolejne etapy realizowane są „jeden po drugim”, bądź zwinną — umożliwiającą jednoczesną pracę na przykład zespołu projektowego i programistycznego.
Pojęciem-kluczem dla zrozumienia procesu projektowego strony internetowej jest UX design — czyli projektowanie nakierowane na doświadczenia użytkownika. We współczesnych projektach pierwszoplanową rolę odgrywa wcale nie warstwa graficzna (choć jej absolutnie nie ignorujemy!), a funkcjonalność strony. Układ poszczególnych obszarów i zakładek, przygotowanie buttonów i zaprojektowanie intuicyjnego menu — to zadania właśnie dla UX designera.
Aby zachować pełną przejrzystość architektury informacji oraz łatwość dostępu do kolejnych obszarów strony, projektanci opierają się na tym etapie o tzw. user flows — czyli schematy określające to, w jaki sposób użytkownicy witryny będą poruszać się pomiędzy kolejnymi jej treściami i funkcjonalnościami. Zdefiniowanie „ścieżek użytkownika” jest prawdopodobnie najważniejszym wyzwaniem na tym etapie projektowania — i tym, od którego zależy, czy przyszli użytkownicy będą wracać na stronę z satysfakcją… czy tylko z przymusu.
Etapem, który nie zawsze uwzględnia się we właściwym procesie projektowym jest przygotowanie treści. To poważny błąd — ponieważ to właśnie wartościowych treści poszukują odwiedzający witrynę użytkownicy.
W wielu projektach teksty, które mają zostać umieszczone na stronie trafiają do jej wykonawców dopiero w ostatnim etapie prac — po zaprojektowaniu struktury strony oraz jej szaty graficznej. I oczywiście; trudno oczekiwać, że agencja SEO przygotuje pełen pakiet treści, zanim jeszcze powstanie chociaż wstępny szablon witryny. Generalnie jednak dobrą praktyką jest, aby jeszcze przed rozpoczęciem prac nad strukturą witryny projektanci wiedzieli przynajmniej, jakie formy treści — i o jakim charakterze — mają trafić na stronę. O ile dodanie artykułów i opisów podstron nie będzie stanowiło problemu nawet na zaawansowanym etapie prac, tak już na przykład slogany i hasła reklamowe warto uwzględnić w projekcie jak najwcześniej.
O szacie graficznej zdecydowaliśmy się powiedzieć dopiero teraz — co nie oznacza, że jest to mniej istotny etap projektowania strony internetowej. Wręcz przeciwnie.
To, jak strona się prezentuje — czy stawia na minimalizm, czy raczej na rozbudowane animacje; z jakiej palety kolorów korzysta czy nawet… jakich używa czcionek — ma bardzo duży wpływ na postrzeganie stojącej za nią marki. Wspomnieliśmy już o identyfikacji wizualnej — witryna internetowa jest jej kluczowym elementem.
Z reguły firmy zlecające budowę (lub redesign) strony mają już swój wypracowany przez dział marketingu wizerunek. Szata graficzna ich „własnego miejsca w internecie” powinna zatem z nim współgrać w stu procentach. Na tym etapie niezwykle przydatny okazuje się opracowany przez klienta brand book — czyli przewodnik po stylu i tożsamości marki — oraz, oczywiście, pakiet materiałów graficznych — logotypów, czcionek, zdjęć, itp.
I na tym kończą się etapy projektowania strony internetowej — ostatnim krokiem czekającym zespół projektowy jest przedstawienie layoutu witryny klientowi, uzyskanie akceptacji (i naniesienie ewentualnych poprawek) oraz przekazanie projektu web developerom. A więc programistom, którzy zamienią schematy, makiety i grafiki na kod HTML, CSS i JavaScript.
Zawodowy copywriter oraz student psychologii na Uniwersytecie Warszawskim. W świecie marketingu internetowego równie mocno, co chwytliwe (i wartościowe) treści interesuje go dobry design. Gdy nie zajmuje się tworzeniem contentu, odkrywa perełki kina niezależnego i pracuje nad własnymi opowiadaniami.
