Proces tworzenia stron internetowych we FROGRIOT

Adam Mucha
Proces tworzenia stron internetowych

Wielu klientów, którzy rozpoczynają z nami współpracę lub zlecają wycenę projektu, nie zdaje sobie sprawy z tego, jak skomplikowany i rozbudowany jest proces tworzenia stron internetowych. Wymaga on intensywnej pracy, co najmniej kilku specjalistów z dziedziny Digital marketingu: project menagera, UX designera, grafika, kodera, programisty i copywritera.

Wiedza całego zespołu przenika się nawzajem dając finalnie wysokiej jakości produkt, skrojony idealnie wedle wymagań klienta i jego klientów. Poniższy wpis ma za zadanie przybliżyć, co we FROGRIOT rozumiemy pod pojęciem odpowiedzialnego tworzenia stron internetowych, jak wygląda cały ten proces i dlaczego warto zainwestować w produkt, który przyniesie rzeczywiste zyski.

 

Krok I – Analiza wymagań klienta, rozmowy i briefy

Pierwszy etap prac nad stroną rozpoczyna się tak naprawdę jeszcze przed wyceną! Zazwyczaj zapoczątkowany jest tym, że klient wysyła do nas brief lub ewentualnie przesyła ogólne zapytanie w odpowiedzi na które, my wysyłamy brief do wypełnienia. Następnie przechodzimy do pytań i rozmów, które doprecyzują projekt. Nie bądź zdziwiony, jeżeli pytań będzie sporo – to naturalna część procesu. Zawsze staramy się poznać klienta jak najlepiej, a nic nie jest na to lepszym sposobem, niż zrozumienie jego wizji i oczekiwań. Na tym etapie prac osoba kontaktowa w firmie (np. account manager) rozpoczyna dyskusję z zespołem. Już w tym momencie określa się wstępne cele oraz tworzy pierwszą wizję i zarys strony.

 

Krok II Wycena

Na podstawie analizy dokonujemy wyceny strony internetowej wskazując, ile zasobów ludzkich oraz materiałów pochłoną poszczególne funkcjonalności i części strony. Przedstawimy to klientowi w przejrzysty sposób, tak, żeby sam mógł zobaczyć, ile osób finalnie weźmie udział w projekcie i na jakie wsparcie może liczyć. Często wycena zawiera klauzulę informującą o tym, że finalna cena produktu może ulec zmianie o +/- 30% . Sytuacja taka to również specyfika tej branży, sam produkt klaruje się bowiem w procesie UX Design’u (User Experience Design o którym napiszemy poniżej). Dopiero po jego zakończeniu możemy poznać finalny kształt, a tym samym również koszt strony internetowej. Po wycenie przechodzimy do podpisania umowy i zaczynamy pracę nad projektem. Tę natomiast rozpoczyna się od UX’ów.

 

Krok III – UX/UI design

We FROGRIOT uważamy, że UX design, to najważniejsza część całego procesu tworzenia strony internetowej. W zależności od budżetu przeznaczonego na stronę www, UX design może trwać od zaledwie kilku dni do nawet kilku tygodni. User Experience jest tak ważne, ponieważ to właśnie na tym etapie, na podstawie zebranych informacji i wymagań, powstaje szczegółowa koncepcja witryny. Sukces Twojej strony zależy w dużej mierze właśnie od UX’ów. Jako nasz klient zawsze bierzesz udział w tym procesie, im bardziej jesteś w niego zaangażowany, tym lepiej dla finalnego wyniku prac.

Cały proces zaczynamy od zbierania wymagań i rozmów z interesariuszami. W zależności od projektu, część wymagań zebranych będzie już na etapie briefu, a pozostała część dopiero na tym etapie. Dzięki temu możemy dobrze poznać produkt lub usługę naszego klienta oraz określić szczegółowe cele i sposoby mierzenia ich sukcesu. W tym momencie dokonujemy również analizy działań bezpośredniej konkurencji, tworząc listę użytecznych i złych praktyk.

Następny etap UX design to generowanie pomysłów. Obejmuje on rozmowy o potencjalnie najlepszych rozwiązaniach dla naszego klienta, takich, które warto wykorzystać podczas tworzenia szkiców czy szablonów.  W celu ustalenia architektury informacji, przygotowujemy mapę witryny. Na jej podstawie możemy stworzyć ogólną nawigację i najważniejsze szablony (mockupy) strony, które staną się bazą wyjściową dla całej witryny. W tym momencie na użytkownikach strony, można również wykonać testy powstałych szkieletów i upewnić się, czy zmierzamy we właściwym kierunku. Na podstawie najważniejszych szablonów opracowujemy wszystkie niezbędne do dziania witryny szablony i przechodzimy do projektowania graficznego.

 

Proces UX / UI Design

Proces UX / UI Design

 


[quote text_size=”medium”]

Proces UX Design dla moose.pl

W przypadku projektu dla MOOSE Centrum Języków Obcych, klient zgłosił się do nas ze zleceniem redesignu jego aktualnej strony, która była zbyt przestarzała i nieefektywna sprzedażowo. Proces analizy wymagań i UX designu wykazał, że potrzeba jest znacznie głębsza. Po ok. 3 tygodniach intensywnych prac, zaproponowaliśmy klientowi całkowicie inne podejście – pierwszą w Polsce stronę dla szkół językowych ze wsparciem procesu sprzedaży. Po kolejnych 2 tygodniach posiadaliśmy już gotowe cele, makiety, ścieżki użytkowników i przystąpiliśmy do dalszych działań. Więcej o ich efekcie można przeczytać tutaj.

[/quote]


 

Krok IV – Projektowanie graficzne

Moment powstawania pierwszych projektów graficznych, to zazwyczaj etap, który najbardziej podoba się klientom. W tym momencie widzą oni, że nasza praca nabiera formy i realnych (a co ważne – atrakcyjnych) kształtów. W zależności od wcześniejszych ustaleń, przygotowujemy zadaną liczbę alternatywnych projektów głównej strony serwisu. Klient wybiera jeden z projektów i dopracowujemy go wedle wspólnie ustalonych wytycznych. Następnie płynnie przechodzimy do projektu graficznego w wersji dla różnych szerokości ekranów (czasem wykorzystujemy podejście Mobile First, innym razem tradycyjnie tworzymy widok desktopowy, a później widok mobilny). W podobny sposób powstają sukcesywnie projekty kolejnych podstron.

Dla nas we FROGRIOT, bardzo ważne jest, aby grafik brał udział w części procesu UX/UI – mamy wtedy pewność, że dobrze rozumie cele stawiane projektowi, a także markę i wizerunek w jaki tworzona witryna ma się wpisać.

 

Krok V – Kodowanie, programowanie i CMS

Praca programistów rozpoczyna się już na etapie UX Design, biorą oni udział w testach użyteczności, dzięki czemu podobnie jak graficy, mogą lepiej poznać klienta i cele stawiane przed projektem. Po ukończeniu prac graficznych, rozpoczynają się prace nad zakodowaniem widoków graficznych do HTML’a. Często już w tym momencie tworzymy niezbędne elementy bazujące na technologii JS. Równolegle do kodowania rozpoczynamy prace programistyczne oraz konfigurujemy i modyfikujemy system CMS, który spełni wszystkie wymagania. Ostatnim zadaniem jest natomiast połączenia CMS’a z zakodowanymi widokami i stworzenie finalnej strony internetowej.

W ramce poniżej znajdują się informacje mówiące o tym, dlaczego kodowanie kodowaniu nierówne i od czego może zależeć finalny efekt prac. Przedstawione zostało to na przykładzie projektu realizowanego dla Meroway.pl.


[quote text_size=”medium”]

Programowanie front-end dla Meroway.pl

Dla Meroway.pl stworzyliśmy stronę WWW, która w założeniu miała być przeznaczona na wszelkie przenośne urządzenia, w tym głównie tablety. Szybko zauważyliśmy, że warto dodać do niej coś ekstra i zdecydowaliśmy się nieco zanimować elementy strony, bo bardzo dobrze współgrałoby to z jej duchem. Potencjalnie mogliśmy zakodować stronę tak, żeby elementy, które się na niej znajdują, były statyczne i spełniały warunki umowy. Jednak we FROGRIOT zawsze dążymy do tego, aby doświadczenie korzystania z naszych stron było wielowymiarowe i satysfakcjonujące. Odbiór strony, na której pewne elementy są ruchome i wizualnie spójne, jest zupełnie inny niż w przypadku strony martwej. Zawsze zwracamy uwagę na takie detale, o których nasi klienci zazwyczaj nie myślą lub których nie biorą pod uwagę. Pomysł zanimowania strony okazał się strzałem w dziesiątkę. Wynik naszych koderskich prac można zobaczyć choćby na stronie głównej serwisu czy stronie wypraw.

[/quote]


We FROGRIOT szczególną uwagę przywiązujemy do optymalizacji serwisu internetowego – zależy nam na tym, aby witryna działała jak najszybciej i była dostępne na jak największej gamie urządzeń. Część praktyk optymalizacyjnych stosujemy jeszcze w trakcie tworzenia kodu, a pozostałe już po jego ukończeniu, w ramach „czyszczenia”. Obszerny artykuł na temat optymalizacji, napisał nasz senior developer – Paweł i zapoznać można się z nim tutaj (wpis wkrótce).

 

Krok VI – Przygotowanie contentu

Równolegle do prac graficznych i programistycznych, trwają prace nad zawartością witryny. Dysponujemy bazą copywriterów, którzy tworzą dla nas historie, materiały i teksty, które będą sprzedawać produkty lub usługi naszych klientów. Czasami klienci kompletnie zapominają o aspekcie materiałów, które wypełnią stronę – my wiemy, że jest to być może najważniejszy element danej witryny. Im lepsze będą materiały, tym lepiej będzie działać strona, a użytkownicy wyniosą z niej więcej korzyści. Z kolei nawet najładniejsza i najlepiej zakodowana strona, bez odpowiedniego contentu, nie będzie działała tak, jak powinna. Dlatego zawsze gorąco zachęcamy naszych klientów, aby proces tworzenia zawartości witryny traktować priorytetowo i przeznaczyć na niego odpowiedni budżet. Zdarzyć się może, że będzie on nawet większy, niż sam budżet na stworzenie strony.

 

Krok VII – Testy

Po wykonaniu wszystkich prac, nadchodzi moment ostatecznych testów. We FROGRIOT zawsze uwzględniamy testy w wycenie. Testy polegają na sprawdzeniu poprawności działania wszystkich funkcjonalności oraz poprawności wyświetlania strony www na urządzeniach mobilnych. W pierwszej kolejności testujemy stronę samodzielnie, przy pomocy oprogramowania jak i fizycznych urządzeń, później natomiast przetestowaną przez nas stronę www, przesyłamy do klienta. Zbieramy ostateczny feedback, wprowadzamy niezbędne usprawnienia, finalne poprawki i przygotowujemy się do premiery.

 

Krok VIII – Wstawienie serwisu online

Premiera strony www to zawsze niezwykle ekscytujący moment. Cała praca wykonana przez zespół i naszego klienta, ujrzy w końcu światło dzienne. Dodatkowo wszyscy niecierpliwie oczekują pierwszego feedbacku od odbiorców, który bywa tak różny, jak różne są gusta ludzi. Ale bez obaw – przy dobrze przeprowadzonej fazie UX designu, zazwyczaj udaje się uniknąć wszelkich mielizn czy problemów, natomiast nie jest to jeszcze koniec prac.

 

Krok IX – Dalsza obsługa i nowe funkcjonalności

We FROGRIOT wierzymy, że praca nad projektem to ciągły proces. W momencie ukończenia projektu (premiera strony czy aplikacji) zamykamy tylko pewien cykl. Cykle te zaś regularnie się powtarzają, jeżeli do projektu podeszło się w sposób odpowiedzialny. Po premierze dostajemy całą masę informacji o tym, jak użytkownicy poruszają się po naszej stronie lub na jakich podstronach z niej wychodzą. Takie dane pozwalają na wyciąganie odpowiednich wniosków, które stają się przyczynkiem do wprowadzenia szlifów lub nowych funkcjonalności. Świat digital marketingu zmienia się bardzo szybko, cały czas pojawiają się nowe urządzenia, przeglądarki, technologie i rozwiązania. My musimy trzymać rękę na pulsie, wiedzieć, co warto ulepszyć, które rozwiązanie jest już przestarzałe i wymaga zmiany. Z przyjemnością oferujemy naszą wiedzę i każdego dnia tworzymy coraz lepsze produkty webowe.

infografika_web-design

 

Na co jeszcze warto zwrócić uwagę?

Istnieje jeszcze kilka elementów, o których powinien wiedzieć klient. Warto wymienić chociażby:

  • Przekazywanie pełnych praw autorskich, które pozwalają naszym klientom na dowolne dysponowanie swoim projektem.
  • Podpisywanie umowy, która odpowiednio zabezpieczy obydwie strony.
  • Udzielenie gwarancji – zawsze projektując stronę udzielamy rocznej gwarancji i w jej ramach poprawiamy wszelkie znalezione usterki.
  • Terminy – w umowie zamieszczamy zapis o płatności na rzecz klienta, za każdy dzień zwłoki z naszej strony i w całej naszej historii nigdy żaden z naszych klientów nie musiał z niego skorzystać!

 

Jak możemy pomóc Twojej firmie w odniesieniu sukcesu w digital marketingu?

Powyżej opisano pełen proces, jakiemu poddawane są wszystkie projekty we FROGRIOT. U nas nic nie jest dziełem przypadku, wszystkie działania mają uzasadniony cel i są wynikiem odpowiednich analiz. Odpowiedzialne tworzenie stron internetowych, to tworzenie produktów, które zawsze stanowią bazę dla całej strategii digital marketingowej naszych klientów. Jeżeli oczekujesz pełnego wsparcia, kreatywnych rozwiązań, ale przede wszystkim ludzi, którzy zjedli zęby na tym, co robią – to trafiłeś pod odpowiedni adres.

Powyższy opis ukazuje, jak skomplikowane i długotrwałe są prace nad przygotowaniem efektywnego i przyciągającego uwagę serwisu. Te kilka akapitów nie oddaje w pełni ogromu pracy, jaki każdego dnia wkładamy w to, żeby strona naszego klienta cieszyła się popularnością i przynosiła zyski. Jednakże strategia, jaką opracowaliśmy, nie ma sobie równych. Jest dokładna, efektywna i gwarantująca sukces.

Jeżeli więc szukasz kogoś, kto zagwarantuje Ci najlepszą jakość wykonania, przestań szukać – już znalazłeś.

 

 

Adam Mucha

Jak możemy Ci pomóc?

Skontaktuj się z nami, aby dowiedzieć się więcej!
POROZMAWIAJMY O WSPÓŁPRACY
Korzystanie z witryny oznacza zgodę na wykorzystywanie plików cookie.