New York – co go łączy z projektowaniem stron i zarabianiem pieniędzy w sieci

Wróciłem właśnie z Nowego Jorku i wciąż słyszę w głowie jego rytm: światła przy alejach, stukot metra, zapach kawy rano jak obietnica, że „coś się wydarzy”. To miasto jest zjawiskowe, ale najbardziej pociąga mnie to, co można w nim odkryć i ile różnych porównań, inspiracji generuje on dla odwiedzających. Dla mnie Nowy Jork poza osobistymi emocjami i spełnieniem marzeń, okazał się także inspiracją do tego co w sztuce tworzenia marki robimy dla Was, czyli projektowaniem stron internetowych i produktów cyfrowych. Mógłbym napisać przewodnik po atrakcjach, ale wolę pokazać Ci to miasto z innej perspektywy, takiej, która przekłada się na decyzje klientów i wyniki na Twojej stronie WWW — tej, którą może kiedyś zrobimy wspólnie. Przejdziemy się po siatce ulic jak po układzie strony, zajrzymy na High Line jak do mądrego redesignu i zjedziemy metrem jak po dobrej nawigacji; na końcu wyjdziesz z prostymi wnioskami do wdrożenia. Przy tym zwizualizuję Ci to niesamowitymi zdjęciami, które są w pełni autorskie.

Gotowy/a? Ruszamy.

Fundamenty: bez nich nie ma wieżowca ani oferty

Zanim wbije się pierwszą stal, sprawdza się grunt. W biznesie tym gruntem jest jasne odpowiedź na pytanie, dla kogo jesteś i jaki efekt dowozisz. Na stronie www tą odpowiedzią jest pierwsze zdanie, które definiuje od razu kim jesteś i przekonuje klienta do pójścia dalej. Tak jak Nowy Jork – kiedy wypowiadasz te nazwę od razu wiesz co to znaczy: wielkość, klasa, najbardziej międzynarodowe miasto świata i wiele wiele innych skojarzeń, które sprawiają, że prawie każdy na świecie chce tam być. Gdy tego brakuje, klient kręci się jak turysta bez mapy. Gdy to jest — idzie prosto, bo rozumie, co go czeka.

Grid 1811: siatka, która trzyma porządek i nerwy w ryzach

Plan Manhattanu to siatka. Dzięki niej łatwo skręcić w lewo, potem w prawo i dojść tam, gdzie trzeba. Na stronie siatka to prosty układ kolumn i powtarzalne odstępy. Dzięki temu każdy nagłówek, zdjęcie i przycisk „oddycha”. Nie ma zatorów. To ważne szczególnie na telefonie, gdyż nasze kciuki lubi prostą trasę. Gdy układ jest przewidywalny, człowiek nie myśli o układzie — myśli o Twojej ofercie.

Nowy Jork jako mapa dobrej strony: fasada, konstrukcja i metro

Fasada = pierwsze wrażenie. W Nowym Jorku to witryny przy Piątej Alei i światła Times Square, które zatrzymują przechodnia. Na stronie tę rolę pełnią zdjęcia, krój pisma i drobne animacje. Mają szybko powiedzieć „tu warto wejść” — bez przeciążania szczegółami.

Konstrukcja = porządek w środku. Wieżowiec działa, bo ma logiczny plan pięter i dobrze widoczne drzwi. Na stronie to kolejność treści, jasne nagłówki i czytelne „wejścia”: przyciski, formularz, numer telefonu w miejscach, gdzie naturalnie pada wzrok i ląduje kciuk. Jeśli układ jest sensowny, odbiorca bez wysiłku dociera do tego, po co przyszedł.

Metro = nawigacja, która dowozi. Nowojorskie metro nie musi błyszczeć — ma wozić ludzi z punktu A do B prostymi liniami i czytelnymi tablicami. W sieci tak działa menu strony www,  Użytkownik nie szuka mapy — po prostu jedzie właściwą linią. Im mniej zgadywania, tym częściej klika w „Wyślij”, a nie „Wstecz”.

High Line: jak robić redesign bez burzenia wszystkiego

Miasto zamieniło stare tory tory kolejowe na wiadukcie w park, który żyje. Twoją stronę też da się ożywić bez wywracania firmy do góry nogami. Często wystarczy nowa kolejność sekcji, lepsze zdjęcia, krótszy formularz i doprecyzowanie oferty. Nie zawsze potrzebujesz nowej bryły. Czasem wystarczy nowe życie w tej, którą masz.

Przeczytaj także: Minimalizm vs. przepych – który design działa

Schody domów, na których siadasz — czyli sygnały zaufania

Brooklyńskie kamienice, ale nie tylko, również w Greenwich, West czy East side  mają schody, na których ludzie przysiadają i rozmawiają. Na stronie taką rolę pełnią krótkie historie klientów, zdjęcia Twojej pracy i proste odpowiedzi na pytania. To nie jest „chwalenie się”. To pokazanie, że umiesz zaopiekować się człowiekiem od pierwszego kontaktu do finału. Wtedy rozmowa zaczyna się sama.

Downtown i Midtown: gdzie robić show, a gdzie dać spokój

Times Square ma świecić. Dzielnice mieszkalne mają służyć. Na stronie podobnie. Strona główna i oferta potrzebują czystości. Blog i realizacje mogą mieć więcej życia i koloru. To nie jest sprzeczność. To strategia. Dajesz energię tam, gdzie buduje emocję, a porządek tam, gdzie zapada decyzja.

Logo jak numer domu: musi być czytelne, nawet po zmroku

Logo samo nie sprzedaje, ale bez niego wszystko wygląda jak budowa. Dobry znak to ten, który „nosi się” wszędzie: na telefonie, w stopce, w miniaturze. Gdy jest proste i spójne z charakterem marki, prowadzi jak numer na fasadzie. Nawet gdy jest ciemno, wiadomo, że to Ty. W nowym Yorku jest mnóstwo logo i wiele z nich jest rozpoznawalnych od razu, bo zbudowały światową lub nowojorską świadomość. Kiedy nowojorczyk czy odwiedzający je widzi od razu wie z czym ma do czynienia.

Zobacz także: Jak logo staje się podpisem cyfrowym marki

Manhattan: plan z 1811 r. i „cofnięcia” z 1916 r. — prosty przepis na dobrą stronę WWW

Najpierw plan. Manhattan dostał w 1811 roku prostą siatkę ulic: ponumerowane ulice i aleje, równe bloki, jasne zasady. Po co? Żeby łatwo się poruszać i bez chaosu rozbudowywać miasto przez kolejne dekady. Ten „Commissioners’ Plan” uporządkował przestrzeń powyżej Houston St. aż do 155. ulicy i dał miastu przewidywalną strukturę. (Wikipedia)

Potem zasady światła i powietrza. Gdy wieżowce zaczęły rosnąć, w 1916 roku wprowadzono przepisy, które kazały budynkom „cofać się” schodkowo wraz z wysokością. Cel był prosty: na ulicy ma być jasno, a dolne piętra i chodniki mają mieć dostęp do światła i powietrza. Stąd wzięła się charakterystyczna, „tortowa” sylwetka wielu nowojorskich budynków z lat 20. i 30. XX w. (Wikipedia)

Jak to przełożyć na stronę WWW?
– Plan 1811 = mapa treści i stały układ. Najpierw układasz siatkę: co po czym następuje (np. obietnica → dowody → oferta → kontakt), jak nazywają się sekcje i gdzie użytkownik skręca. Dzięki temu każdy szybko „czyta” stronę i nie błądzi — jak po nowojorskiej siatce.
– Zasada 1916 = odstępy i jeden główny akcent na ekran. Sekcje „cofają się” wizualnie: zostawiasz światło (whitespace), ograniczasz liczbę elementów konkurujących o uwagę i prowadzisz wzrok do jednego działania (CTA). Zero „ściany cienia”, dużo czytelności — tak jak na ulicach, które nie toną w mroku dzięki schodkowym bryłom. (thegreatestgrid.mcny.org)

W praktyce oznacza to: zrób prostą mapę serwisu (jak grid), trzymaj spójne nagłówki i nawigację, a w widokach „nad zgięciem” pokaż jedno najważniejsze działanie. To jest ten sam porządek, który pozwolił zbudować Nowy Jork — najpierw reguły i przejrzystość, dopiero potem wysokość i efekty.

Miasto, które chcesz zbudować dla swoich klientów

Wyobraź sobie swoją stronę jak własną dzielnicę. Niech będzie w niej jasno jak na Broadwayu, wygodnie jak na High Line i przewidywalnie jak w metrze. Niech są drzwi, które łatwo się otwierają, i adres, którego nie da się pomylić. Wtedy ludzi nie trzeba gonić reklamą. Sami zaglądają, bo widać, że tu się da normalnie porozmawiać.