Case Studies

Projekt strony dla agencji SEO – Delante

W 2017 roku Delante dopiero zaczynało swoją przygodę jako agencja SEO. Prężnie rozwijało się i zdobywało kolejnych klientów. Spółka trafiła do nas w momencie, kiedy chciała gruntownie przebudować swoją stronę internetową tak, aby poziomem dorównywała największym markom w branży SEO. Dodatkowo zależało im na znacznym zwiększeniu konwersji na stronie.

Klient
Delante
Cel
stworzenie kompletnej strony internetowej
Okres współpracy
2017
Liczba sprintów
5
Liczba osób w projekcie
5

Efekty projektu po dwóch latach (stan na 21 maja 2020)

Strona Delante na podstawie przygotowanego przez nas designu została zaimplementowana ponad 2 lata temu, a dokładnie 22 lutego 2018 roku. Od tego czasu zespół Delante podjął wiele działań wpływających na liczbę wizyt na stronie oraz na poziom zadowolenia użytkowników, z czego bardzo się cieszymy i gratulujemy :). Do takich działań należy szeroki content marketing, wprowadzenie wielu przemyślanych zmian, takich jak baza wiedzy dla treści oraz sukcesywne działania social media, oraz SEM. 

Choć trudno było nam wyciągnąć liczby tylko z naszej pracy, ponieważ często są one powiązane z innymi działaniami, to zmierzyliśmy wpływ redesignu strony na rozwój firmy. Staraliśmy się uwzględnić wartości procentowe wskaźników, czyli ile osób ze 100 dokonało jakiejś akcji, bądź o ile czas danej akcji się wydłużył, bądź skrócił.

Doszliśmy do wniosków:

Dzięki temu Delante może cieszyć się z większej liczby klientów i projektów, a my z dobrze wykonanej pracy. 🙂

Sprint Pierwszy

Warsztaty zespołowe z uwzględnieniem priorytetów projektu strony

Pracę rozpoczęliśmy od warsztatu, w którym uczestniczył każdy członek zespołu: UI&UX Designer, Frontend Developer, Product Owner, Copywriter oraz Facylitator spotkania z naszej strony. Ponadto na to spotkanie zaprosiliśmy głównego prezesa spółki, szefa działu sprzedaży oraz szefa SEO. Każdy z nich pełnił określoną rolę i dostarczał kompletną wiedzę w swoim zakresie.

Przygotowując warsztat mieliśmy ściśle ustalone cele.

  • Zależało nam na poznaniu celu biznesowego nowej witryny.
  • Chcieliśmy zebrać oczekiwania każdego interesariusza.
  • Celem była również analiza stanu obecnego oraz poznanie person/użytkowników strony.

Aby zrealizować powyższe cele zastosowaliśmy narzędzie o nazwie Business Model Lean Canvas. Pozwoliło nam to na poznanie kluczowych partnerów, unikalną wartość i aktywności wykonywanych przez firmę, dowiedzieliśmy się o sposobie pozyskiwania klientów oraz zrozumieliśmy, na co dzielą się główne koszty i jakie strumienie przychodów występują. 

Wszystkie te elementy były niezwykle istotne, gdyż rzutowały na dalszy proces prac.

 

Wpływ sprzedaży relacyjnej na wygląd projektu strony internetowej

Klient zdobywał kontrahentów poprzez aktywny udział na konferencjach i spotkaniach branżowych. Bardzo często dokonywał sprzedaży relacyjnej. W tego typu wydarzeniach potencjalny kontrahent dostawał pokaźną ilość wizytówek. Zdecydowaliśmy umieścić wizerunek osoby nawiązującej kontakt ze strony Delante bezpośrednio na owej wizytówce. Osoby, które otrzymywały kartonik, łatwiej zapamiętywały z kim podczas takich wydarzeń rozmawiały. Co więcej, te same zdjęcia zastosowaliśmy jako jeden z pierwszych elementów po otworzeniu strony internetowej.

 

Różni odbiorcy:

Podczas warsztatów przyjrzeliśmy się również blisko 100 klientom, z którymi współpracuje firma. Po przeanalizowaniu danych mogliśmy już określić konkretny wzorzec grupy odbiorców. Dla każdego z nich wyodrębniliśmy kluczowe czynniki decyzyjne przy wybieraniu agencji SEO. 

Teraz także możesz skorzystać z Business Canvas, Persona Canvas i 30+ innych szablonów i narzędzi w swojej firmie. Za darmo

Dołącz do naszego newslettera i zyskaj dostęp do Biblioteczki Narzędzi Lean!



    Zgadzam się na przetwarzanie moich danych osobowych przez Project: People Sp. z o.o. w celu komunikacji marketingowej, a tym samym wysyłania mi newslettera, informacji o usługach, promocjach lub nowościach zgodnie z Polityką prywatności

    Pierwsza personą był Bartek – właściciel sklepu e-commerce, który chce zwiększyć widoczność swojego serwisu. Jest on osobą analityczną, bazującą na danych. W firmie zazwyczaj pełni wysokie stanowisko i ma pełną samodzielność. Preferuje zdecydowanie kontakt mailowy.

    Drugą osobą była Magda pracująca w przedsiębiorstwie produkcyjnym. Szuka ona wsparcia dla sprzedaży tradycyjnej swoich produktów. Bazuję na relacjach i znajomościach. Ma problem z imionami i skojarzeniem. Nie pamięta, jak wyglądają osoby, z którymi rozmawiała. Zdecydowanie woli rozmawiać przez telefon. 

    Przy projektowaniu strony należało wziąć pod uwagę preferencje obu tych grup. Strona więc koniecznie powinna posiadać, jak najwięcej danych i rzetelnych informacji, ale musi zawierać wątek personalny. 

     

    Cele główne i poboczne

    Podczas warsztatu przedyskutowaliśmy również wszystkie cele, które ma pełnić strona główna. 

    Cel główny: 

    • nakłonienie do kontaktu.

    Cele poboczne:

    • uwiarygodnienie potencjalnemu klientowi profesjonalizmu firmy Delante,
    • pokazanie doświadczenia i kompleksowej wiedzy Delante w branży, między innymi poprzez pokazanie efektów pracy z dotychczasowymi klientami,
    • zaprezentowanie zespołu Delante w celu przedstawienia kompetencji,
    • pokazanie sposobu i kultury pracy firmy Delante dostosowanych do konkretnego klienta,
    • wykreowanie wizerunku specjalistów i zaprezentowanie kompleksowej wiedzy.\

    Cele optymalizacyjne:

    • maksymalne ułatwienie działowi sprzedaży pracy codziennej w pozyskiwaniu klientów, m.in. poprzez pokazanie jak wygląda proces, jakie są kolejne kroki dla klienta,
    • maksymalne ułatwienie działowi sprzedaży pracy codziennej w pozyskiwaniu klientów m.in. poprzez udostępnienie przykładowych raportów osobie wchodzącej na stronę,
    • maksymalne ułatwienie działowi sprzedaży pracy codziennej w pozyskiwaniu klientów m.in. poprzez dostarczenie odpowiedzi na najczęstsze pytania zadawane przez klientów,
    • ułatwienie dostępu klientowi do danych o firmie,
    • kontekstowe pokazywanie treści w zależności od miejsca, w jakim jest potencjalny klient na stronie,
    • uporządkowanie architektury informacji.

    Po zebraniu wszystkich informacji o projekcie, spokojnie mogliśmy przejść do kolejnych kroków.

     

    Research i analiza alternatywnych rozwiązań 

    W drugiej połowie tygodnia przeszliśmy do analizy zebranych materiałów i ustaliliśmy, czego jeszcze nie wiemy.

    Zaczęliśmy od stworzenia competition canvas. Narzędzie to pozwoliło nam zebrać wszystkie podstawowe i istotne dla nas informacje o konkurencji. Badaliśmy tutaj zarówno polskie, jak i zagraniczne serwisy.

    Przeszukaliśmy również sieć oraz porozmawialiśmy z osobami zbliżonymi do naszych person (idealnych klientów), aby bardziej zrozumieć ich potrzeby. 

    Z etapu researchu dowiedzieliśmy się, że…

    • Osoby, poszukujące specjalistów SEO w tak zwanym “długim ogonie” (specjalizacja klienta) miały już wcześniej do czynienia z inną agencją SEO, oczekiwały więc bardzo dużej transparentności i jasności w raportach, a także codziennych działaniach.
    • Klienci byli zainteresowani procesem, którym odbywa się pozycjonowanie.
    • Bardzo często SEO było jedną z usług, którą chętnie by zlecili. Należało zaprezentować ofertę w taki sposób, aby potencjalnie skorzystali i mieli świadomość istnienia pozostałych usług.
    • Wielu aktualnych klientów poznało Delante przez wpisy na blogu. Należy poprawić w szczególności konwersję na tej stronie.

     

    Analiza pozyskania użytkownika

    Ze względu na różne persony oraz różne preferencje podsumowaliśmy możliwe aspekty pozyskania klienta. Ułatwiło to rozstawienie elementów na stronie w późniejszym etapie.

    Sprint Drugi – przed Designem 

    Projekt strony na makietach

    Po merytorycznym przygotowaniu do tematu, w końcu mogliśmy przystąpić do tworzenia makiet. Dlaczego makiety? Wydawać by się mogło, że struktura strony nie jest zbyt skomplikowana. Dochodzi jednak kilka innych czynników, które wpływają na zapotrzebowanie na szkice. Usługi są złożone, a co więcej każdy z głównych interesariuszy miał swoje założenia przy tworzeniu nowej wersji witryny i swoje cele, które chciał realizować. Do pracy użyliśmy więc UXpin i w tydzień przygotowaliśmy Architekturę Informacji oraz Makiety Low-fi, mające za zadanie szybkie zwizualizowanie treści.

    W czasie projektowania robiliśmy testy korytarzowe, aby upewnić się że struktura strony jest poprawna. Testy polegały na pokazywaniu widoków osobom z otoczenia i sprawdzeniu, jak rozumieją daną funkcjonalność. W ten sposób natychmiastowo eliminowaliśmy proste i głupie błędy.

    Linki do makiet:
    Invision Homepage
    Invision Case Studies
    Invision Single Case Study
    Invison About
    Invision Offer
    Invision Offer Presentation
    Invision Blog
    Invision Blog Single Post
    Invision Contact

     

    Moodboard projektu strony

    Po wykonaniu makiet, nasz projekt powoli przechodził w fazę designu. W celu uniknięcia sytuacji, kiedy nasza wizja graficzna jest inna od tej wykreowanej przez właścicieli, zebraliśmy kilka inspiracji graficznych do przedyskutowania z interesariuszami. Pokazując gotowe realizacje (niekoniecznie nasze) skutecznie można zdefiniować, jakie oczekiwania ma klient wobec wyglądu strony.

    https://projects.invisionapp.com/boards/E43VR79Q6J8/

     

    Spotkanie z interesariuszami agencji SEO

    Po wykonaniu opisywanych widoków ponownie spotkaliśmy się w składzie z pierwszych warsztatów. Dzięki zwizualizowaniu treści mogliśmy jeszcze raz przedyskutować poszczególne elementy

    Podczas spotkania przedyskutowaliśmy:

    • rekomendacje z perspektywy SEO,
    • rozbudowę zakładki kariera,
    • priorytetyzacja treści dla sprzedaży m.in przesuniecie sekcji z procesem wyżej w widokach,
    • prezentację zespołu na stronie,
    • kierunek graficzny projektu.

    Spotkanie było efektywne, gdyż klient dostał informacje o postępach, a my w szybki sposób przeprowadziliśmy niezbędne ustalenia, i przeszliśmy do kolejnego etapu. Oczywiście w czasie spotkania dostaliśmy kilka poprawek, które natychmiast wprowadziliśmy W ten oto sposób otrzymaliśmy kompletny widok ekranów do fazy designu.

    Sprint 3 i 4: Design

    Projektowanie finalnego wyglądu strony to coś, co zazwyczaj klient oczekuje, że zadzieje się od pierwszego dnia współpracy. Jak zapewne zauważyliście jest to etap, który odbywa się dopiero po dwóch tygodniach pracy w projekcie. Dlaczego od razu nie przystąpiliśmy do niego? 

    Przede wszystkim przystępując do zadania dopiero teraz, mamy jasno określone wszystkie widoki. Każdy w zespole wie, czego się spodziewać po stronie, a i liczba zmian w tym momencie jest marginalna – wszystkie poprawki dokonaliśmy już wcześniej. Co więcej, wiemy już w jakim kierunku graficznym pójść. 

    Należy tutaj zaznaczyć, że logo zostało dostarczone przez klienta. W zaleceniach od innego grafika otrzymaliśmy zestaw kolorów, które powinniśmy używać. Problem był jednak taki, że kolory te przygotowane były pod druk, a te znacznie różnią się od zestawu kolorów dostępnych na ekranach urządzeń elektronicznych. Postanowiliśmy wprowadzić drobne usprawnienie kolorystyczne na potrzeby sieci. 

    Na początku oczywiście zaczęliśmy od “upiększania” strony głównej. Po zaprojektowaniu tego widoku ponownie spotkaliśmy się na kilku-minutową aktualizację z właścicielami. Wprowadziliśmy odpowiednie poprawki i zamknęliśmy tak zwany styleguide, czyli ogólną stylistykę, w której została wykonana strona.

    W momencie, kiedy zatwierdziliśmy ogólny styl, przeszliśmy do projektowania kolejnych podstron. Na sam koniec stworzyliśmy widoki na urządzenia mobilne. W drugim tygodniu prac programista zaczął równorzędnie z nami pracę nad stroną. Konsultowaliśmy z nim na bieżąco zachowania poszczególnych elementów. W czasie trwania naszych prac dobraliśmy również animacje na stronie, czyli to w jaki sposób mają się zachowywać poszczególne elementy.

     

    Rozliczenie godzinowe – Copywriting

    W ostatnim etapie, podczas prac programistycznych okazało się również, że klient potrzebuje stworzyć teksty na swoją nową stronę. Etap ten nie można było zamknąć w krótkim okresie jednotygodniowym ze względu na ograniczoną dostępność zarządu oraz specjalistyczną wiedzę tematyczną, która wymagała obecności specjalisty SEO. Zaproponowaliśmy tutaj rozliczenie godzinowe i w miarę możliwości procesowanie poszczególnych podstron. 

    W rezultacie stworzyliśmy tekst do każdej podstrony i sekcji z wyłączeniem bloga. Krótko potem strona ujrzała światlo dzienne pod adresem https://delante.pl.

    Podsumowanie

    Na pierwszy rzut oka, strona internetowa mogła być postawiona dużo szybciej i taniej, na gotowym szablonie WordPress, tak jak miało to miejsce w poprzedniej wersji strony. Dlaczego jednak warto zainwestować w nieco bardziej skomplikowany proces tworzenia witryny?

    Poniżej prezentujemy główne powody Delante:

    • Klient zgłaszając się do nas złapał trakcję. Jego głównym celem było skalowanie i usystematyzowanie działań. Poznanie procesów panujących w firmie pozwoliło  ułatwić codzienna pracę. 
    • Klient wyspecjalizował się w określonej dziedzinie (e-commerce oraz Long-tail SEO), stworzenie spersonalizowanej strony pozwoliło uwypuklić co wyróżnia go na tle konkurencji.
    • Firma “gubiła” potencjalnych klientów na stronie poprzez nieprzemyślaną architekturę. W nowej wersji w każdym możliwym punkcie styku wspieramy  konwersję.
    • Jednym z głównych priorytetów Delante było pokazanie marki jako profesjonalnej firmy. Uzyskaliśmy to poprzez indywidualną stronę we własnej stylistyce. 

    Skąd wiemy, że dobrze wykonaliśmy naszą pracę? Przede wszystkim klient sam zgłosił nam znaczący wzrost w każdym z obszarów który zdefiniowaliśmy. Zleceniodawca sam wystosował nam odpowiednie rekomendacje:

    Stronę oceniamy bardzo dobrze. Zrealizowała swój cel jakim było pokazanie nas jako nowoczesnej firmy i zwiększyła konwersję na zapytania sprzedażowe (to było mocno odczuwalne). Współpraca z Wami była sprawna i czuliśmy że rozumiecie nas i popychacie temat do przodu. Polecamy Was znajomym.

    Jacek Blaut, Head of Growth Delante

    Narzędzia wykorzystane w projekcie

    • Business Model Canvas
    • Sketch
    • Zeplin
    • React
    • Moodboard
    • User Journey Map
    • Competitors Canvas

    Case study to za mało?

    Chcesz poznać cały proces i dowiedzieć się, jak mógłby wyglądać w Twojej organizacji?

    Umów się na bezpłatną konsultację

    Zespół projektowy, czyli kto za co odpowiadał

    Autor Case Study

    Tomasz Osowski Lean UX & Service Designer w Project: People
    Pomaga firmom stworzyć doskonałe doświadczenie użytkownika zapewniając jednocześnie odpowiednią rentowność biznesu. Jego zdanie to stworzyć produkt i usługi, które są potrzebne i przynoszą satysfakcję zarówno odbiorcom jak i właścicielom biznesu.Certyfikowany Trener Biznesu i rozwoju osobistego, Certyfikowany moderator Design Thinking. Przedsiębiorca od 6 lat szczerze zakochany w metodologii Lean. Zawsze stara się dostarczyć produkt jak najszybciej na rynek przy najmniejszym udziale kapitałowym.Współpracował z firmami: T-mobile, Ecard, inPost, ING, Nationale Nederlanden, Brainly, Publicis, Netguru. Organizator DesignWays Conf.