Projektując stronę internetową często inspirujemy się zagraniczną modą, trendem aktualnie obowiązującym w tworzeniu stron www np. jakiś czas temu był to flat design obecnie wprowadzony przez Google styl material design zdaje się robić karierę. Próbujemy podpatrywać lepszych od siebie kolegów czy firmy po fachu, przeglądać liczne strony/banki zdjęć prezentujące zbiory tych topowych realizacji stron www.

Są to bardzo dobre nawyki szukania inspiracji bo opatrzenie się i wyciąganie wniosków oraz mądre analizowanie tego co można zrobić i co aktualnie się projektuje to potężne narządzie do własnego samorozwoju jako grafik, artysta czy projektant w jakiejkolwiek branży.

Poznanie potrzeb odbiorcy wchodzącego na stronę www

Przed designerem stoi nielada trudne wyzwanie stworzenie marki / brandu, wymyślenie wzoru linii produktu czy całego interfejsu graficznego mającego realizować określone funkcje. Projektant taki nie tylko ma za zadanie ładnie ‚narysować’ temat, choć generalnie większość z nich tak podejdzie do tematu, jednak rzetelne wykonanie usługi projektowania strony www, aplikacji czy jakiegokolwiek interfejsu graficznego wymaga kilku wcześniejszych zadań bez których w naszej ocenie dobre wykonanie pracy graficznej jeż niemożliwe i mija się z celem, chodzi o :

  1. poznanie Klienta i odbiorców jego produktu,
  2. zorientowanie się najlepiej briefem na potrzeby konkretnych funkcji i ustalenie ich ważności dla potencjalnego użytkownika,
  3. testy, testy, testy tego co robimy – a najlepiej podzielenie pracy na etapy po których zawsze następuje konfrontacja z Klientem i analiza pomysłów przez obie strony.

Metody doboru środków w tworzeniu strony internetowej

Dobrym sposobem jest dzielenie pracy na etapy, wg. nas na minimum 3 etapy:

  1. etap zbierania danych – to etap na którym powstaje makieta i brief zlecenia, tutaj zadajemy pytania i organizujemy dane wejściowe tworząc spójną informację dla Klienta celem akceptacji planu zlecenia i tego co wspólnie chcemy zrobić,
  2. projektowanie grafiki strony internetowej, aplikacji : włączając w to etap testowania i rysowania bloczków / schematu graficznego modułów, ich rozmieszczenia i ułożenia na stronie
  3. kodowanie i wdrażanie projektu w życie – przygotowywanie kodu html z projektowanej strony (pliki .psd), montaż na serwerze i testy mające na celu sprawdzenie poprawności całej aplikacji.

Podczas projektowania strony możemy również korzystać z aktualnych dobrodziejstw internetu, które pomogą nam przejść proces kreacji grafiki na poziomie tworzenia wszsystkiego od początku i przelaniu naszych pomysłów na’ papier’. Dobrym rozwiązaniem jest dobrze zaprojektowana strona internetowa – tarnowskiego studio Hauer Mateusza przy okazji gromadząca również sama w sobie inspiracje dla grafików, webdesignerów czy osób lubiących ciekawie zestawione ze sobą pixele.

Tworzenie poszczególnych warstw projektu graficznego strony :

  • dobór modułów i ich organizacja pomoże nam : axure.com
  • doboru palety kolorów pomogą nam różnego typu generatory kolorów np. coolors.co, mrmrs.io/gradients/, uigradients.com/
  • doboru czcionek – tutaj z pomocą przychodzi nam google fonts,
  • zestawieniu zdjęć – liczne banki zdjęć od darmowych po płatne jak istockphoto.com czy fotolia.pl,
  • wybraniu układu strony internetowej – np. model bootstrap, własne kodowanie, czy material design,

Przedstawienie projektu strony Klientowi

Finalnie by freelancer, agencja interaktywna mogła przedstawić projekt wystarczy go opublikować np. w photoshopie i wysłać jpg w mailu. Jeżeli będzie to dobrze przygotowana grafika, trafiająca w gust oraz opisana w kilku zdaniach to taki zabieg prezentacji na pewno się powiedzie, ale możemy sobie pomóc w prezentacji naszej grafiki przedstawiając ją na różnego typu makietach ilustrujących np. trzymanie ipada czy smartfona w ręku wyświetlającego naszą realizację, ciekawej scenerii w której umieszczony jest ekran komputera czy tabletu ilustrujący nasz projekt np. stare biuro, natura, ciekawy pejzaż etc… to poprawi prezentację naszej pracy i z pewnością zaciekawi oglądającego jeszcze bardziej.

Możemy w przypadku prezentacji stron internetowych posłużyć się również prezentacją online projektu wykorzystując do tego celu np. invisionapp.com, które da rzeczywisty podgląd oglądającemu 1:1 na projekt, w którym to ani czcionka ani zdjęcia nie będą ściśnięte jak w podglądzie .jpg w windowsie, gdzie nie bardzo widać ani proporcje ani wielkości poszczególnych części zaprojektowanej tak sumiennie przez nas strony www.