Co pozwala tworzyć lepsze strony internetowe? - Vena Art

Co pozwala tworzyć lepsze strony internetowe?

W branży kreatywnej niekiedy proces tworzenia bywa żmudny i skomplikowany. Produkt końcowy zależy od bardzo wielu czynników, które determinują jakość, termin ukończenia prac oraz oczywiście cenę. Proces ten można uprościć stosując tzw. brief (czyt. /briːf/). To elementarny dokument zawierający zestaw informacji, wskazówek i sugestii niezwykle użytecznych z punktu widzenia realizacji zlecenia.

Brief strony internetowej — z nim czy bez niego?

Jak anglojęzyczna nazwa wskazuje, brief na pewno nie powinien być elaboratem. Raczej bywa zwięzłym nakreśleniem, czym według klienta powinien być produkt końcowy, jak powinien działać, jak wyglądać, jakie pełnić funkcje.

Rzecz jasna, strona internetowa teoretycznie może powstać bez takiego dokumentu, istnieje jednak pewne ryzyko, że bez niego proces twórczy ulegnie niepotrzebnemu przedłużeniu. W konsekwencji, taka sytuacja może być źródłem niemałych frustracji i nieporozumień pomiędzy klientem a wykonawcą. Przyczyna jest bardzo prosta — ponieważ wizja finalnego efektu obu stron może się, mówiąc eufemistycznie, co nieco różnić.

Brief to nie tylko cenne wytyczne dla zleceniobiorcy, lecz również swego rodzaju zabezpieczenie dla zleceniodawcy. To właśnie na tym etapie precyzuje się i określa zadania, które stoją przed wykonawcą.

Dzięki briefowi oszczędzamy czas

Brief strony internetowej pozwala zaoszczędzić czas

Każda szanująca się agencja reklamowa powinna dla swoich klientów przygotować szablon briefu do wypełnienia. Najczęściej ma on postać ankiety, gdzie zlecający zaznacza poszczególne pola i odpowiada na różne pytania. Owszem, na wypełnienie jej trzeba poświęcić trochę czasu, zazwyczaj od kilkunastu do kilkudziesięciu minut, tym niemniej czas na to poświęcony na pewno zaprocentuje.

Dzięki rzetelnemu namysłowi, czas w przyszłości de facto zaoszczędzimy — i sobie, i firmie dla nas pracującej. Dodatkowo, co chyba nawet ważniejsze, korzystający z naszych usług otrzymają dokładnie to, czego oczekują. Świadomość potrzeb, celu oraz tego, co klient preferuje, pozwoli agencji reklamowej lepiej wykonać swoje zadanie. Mając więcej danych i więcej szczegółów, istnieje mniejsze prawdopodobieństwo tego, że efekt końcowy naszych działań nie spodoba się zamawiającemu.

Czy modernizując istniejącą stronę WWW potrzebujemy briefu?

Brief to istna skarbnica wiedzy, która niesie za sobą same korzyści. To rewelacyjny punkt wyjścia, a więc dobry początek, który zwiększa Twoje szanse na powodzenie. I to nie tylko w przypadku, gdy pragniesz stworzyć zupełnie nową stronę internetową, ale także gdy chcesz zmodernizować już istniejącą.

W tym drugim przypadku również warto zastosować brief, podchodząc do tego poważnie i konkretnie, nie pozostawiając żadnych wątpliwości, co i w jakim zakresie należy zmienić.

Standardowe elementy briefu przy tworzeniu strony internetowej

Brief strony internetowej i jego standardowe elementy

Briefy agencji reklamowych mogą oczywiście się od siebie różnić. Jedne mogą być bardziej rozbudowane, inne mniej, lecz pewne elementy zawsze pozostają wspólne, a przynajmniej powinny.

Podstawowe dane zleceniodawcy

Chodzi nie tylko o nazwę firmy, oferowane produkty, usługi czy branżę, w której ona działa, ale także o misję, grupę docelową, jej pozycję na rynku oraz współistniejącą konkurencję. W tym miejscu należy też wskazać osobę kontaktową. Najlepiej, by była to jedna, góra dwie–trzy osoby, które odpowiadają za komunikację i podejmowane decyzje, by nie rodzić tzw. szumu komunikacyjnego.

Cel i zadania stawiane przed stroną WWW

Czymś rudymentarnym jest zdefiniowanie, do czego witryna webowa jest w danym przypadku potrzebna. Mogą to być cele wizerunkowe (np. „wizytówka” firmy, strona korporacyjna), cele sprzedażowe (platforma e-commerce), informacyjne (np. portal, serwis). Może to być także landing page (promocja jakiegoś produktu czy usługi).

Zakres działań zleceniobiorcy

Zakres działań zleceniobiorcy określany przez brief — architektura informacji / makiety użyteczności (makiety UX)Niebagatelną rzeczą jest określenie, czego w istocie dotyczy zlecenie albo jakie składowe wchodzą w jego zakres. Należy dokonać deliberacji, czy w grę ma wchodzić przygotowanie architektury informacji / makiet użyteczności, innymi słowy makiet UX (ang. user experience, czyt. /ˌjuːzə(r) ɪkˈspɪəriəns/), a może od razu ma to być projekt szaty graficznej (ang. layout, czyt. /ˈleɪaʊt/).

Naturalną konsekwencją jest stworzenie strony internetowej w oparciu o wypracowane wcześniej aspekty wizualne, o których nieco więcej za chwilę. Docelowo może to być albo strona statyczna (i nie chodzi tutaj wcale o brak ruchu czy animacji, tylko — upraszczając i nie wchodząc w szczegóły — o brak systemu zarządzania treścią), albo strona dynamiczna, czyli witryna oparta na CMS-ie, w pełni edytowalna z poziomu panelu administracyjnego, zazwyczaj bez znajomości zaawansowanych technologii programistycznych.

Może się tak zdarzyć, że klient posiada już projekt graficzny serwisu WWW stworzony przez kogoś innego. Jeżeli grafika wykonywana jest razem z kodowaniem / programowaniem, ma się w takiej sytuacji pewność, że zostanie to wdrożone w pełni poprawnie i bezproblemowo. Natomiast jeżeli kto inny przygotował layout, mógł to zrobić nie do końca dobrze, nie uwzględniając pewnych szczególnych aspektów albo nie będąc świadomym różnic i zawiłości technicznych środowiska uruchomieniowego (przeglądarek internetowych).

Wytyczne dotyczące sfery wizualnej

Wytyczne dotyczące sfery wizualnejCzynnością godną pochwały jest doprecyzowanie oczekiwanej stylistyki koncepcji. W tym miejscu możemy zdecydować, czy stylistyka ma być minimalistyczna, czy wręcz przeciwnie — z dużą ilością grafiki. Czy ma być elegancka i poważna, stonowana, czy wesoła, wręcz zabawna. Być może odpowiada nam styl vintage / grunge? Może jednak bardziej zadowoli nas spora ilość zdjęć, ewentualnie duża i wyrazista typografia… OK, a co z kolorystyką? Proszę bardzo!

Jedni mogą preferować ciemną kolorystykę, drudzy jasną, a jeszcze inni — by na stronie nie było zbytniego miszmaszu kolorystycznego. Do tego może dochodzić stylistyka zdjęć — np. biznes, technologia, ludzie, styl życia, krajobrazy, zwierzęta, natura itp.

Funkcjonalności witryny internetowej

Wykaz funkcjonalności uzależniony jest w rzeczywistości od celu, jaki ma spełniać nasz nowy webowy „protagonista”. Liczba wersji językowych oraz to, czy na stronie ma być formularz kontaktowy, pole z możliwością zamówienia newslettera, system wpisów (blog) czy wyszukiwarka zależy w dużej mierze od zadań stawianych przed witryną WWW.

Dobrą praktyką klienta w tym miejscu jest przedstawienie stron referencyjnych, które jemu się podobają (często konkurencyjnych, choć nie jest to wcale regułą). To może pomóc i ułatwić proces twórczy, o ile zostanie dokładnie wskazane, co akurat w danej witrynie się podoba, a nie tylko tyle, że ogólnie strona jest fajna.

Zawartość strony, czyli „wsad” (materiały)

Zawartość strony, czyli "wsad" (materiały)Treści i zdjęcia to kolejny must-have. Istotne jest, czy w ogóle posiadasz logo, SIW (system identyfikacji wizualnej), własne zdjęcia i teksty. Może się bowiem okazać, że trzeba zlecić wykonanie profesjonalnej sesji zdjęciowej tudzież napisanie stosownego contentu (ang. content — zawartość) przez agencyjnych copywriterów.

Rzecz jasna, wszystko to musi odbywać się w kontekście konstrukcji całej witryny, z podziałem na poszczególne pozycje w menu nawigacyjnym. Taka systematyka z pewnością ułatwi autorom przedsięwzięcia zrobienie podstron i połączeń pomiędzy nimi.

Termin wykonania oraz przewidywany budżet

Jakość wykonania, termin oraz budżet to powiązane ze sobą zagadnienia. Nie ulega wątpliwości, iż wymarzonym dla klienta scenariuszem byłoby otrzymać, jak najlepszy efekt naszych prac, jak najszybciej, przeznaczając na to, jak najmniej pieniędzy.

Od razu zaznaczmy, że nigdy te trzy czynniki nie wystąpią ze sobą w koniunkcji, a co najwyżej dwa. Innymi słowy, strona, sklep czy aplikacja, która zostanie wykonana szybko i tanio, nigdy będzie najwyższej jakości. Z kolei ekspresowo zrealizowana witryna najwyższych lotów, nigdy nie będzie tania. Umówmy się, trzecią możliwość możecie rozszyfrować sami… 😉

Kwestie techniczne i technologiczne

Kwestie techniczne i technologicznePowinniśmy zastanowić się, pod jaką domeną (tj. pod jakim adresem URL) witryna sieciowa będzie działać, pod którą być może działa dotychczasowa, stara, którą będziemy zmieniać. Ponadto, na jakim serwerze zostanie umieszczona (tzw. hosting). Koniec końców, czymś niezwykle korzystnym i wartościowym jest zorientowanie się w sprawie technologiisystemu zarządzania treścią (CMS), na bazie których zostanie całość wykonana. Od tych właśnie części składowych zależy końcowy sukces całego projektu, łącznie z pojawianiem się na wysokich pozycjach w wyszukiwarce Google.

Pobierz interaktywny brief

A Wy jakie macie doświadczenia z briefami stron internetowych? Wypełnialiście kiedykolwiek taki dokument? Jakie jeszcze pytania, Waszym zdaniem, powinny się w briefie dotyczącym stworzenia strony WWW znaleźć?

Zapraszam do dyskusji na naszym facebookowym fanpage’u!

Web Developer (programista stron, sklepów i aplikacji internetowych) / Mobile App Developer (programista aplikacji mobilnych) / Game Developer (programista gier) oraz Graphic & Web Designer (grafik komputerowy) w jednej osobie. Absolwent m.in. Instytutu Matematyki, Informatyki i Architektury Krajobrazu Katolickiego Uniwersytetu Lubelskiego (KUL) Jana Pawła II w Lublinie. Specjalizuje się w JavaScript, jQuery, AngularJS, Vue.js i innych front-endowych technologiach webowych. Równocześnie rozwija swoje talenty dydaktyczne, prowadząc profesjonalne zajęcia w jednej z ogólnopolskich akademii programowania. Pasjonat gier wideo oraz pisania / czytania książek. Anglojęzyczny licencjonowany pilot wycieczek. Były koszykarz, na co dzień uprawia kalistenikę.