Webové stránky pro specialistu na PPC - Michal Lysek

O projektu

Michal Lysek je profesionál na volné noze, se kterým spolupracuji již dlouhou dobu. Jednou jsme se na schůzce bavili o webových stránkách a Michal mě požádal, jestli bych mu nepomohl s tvorbou jeho webu. Sestavili jsme cíle webu, dohodli se na rozpočtu a pustili se do práce.

‍

Co jsem na projektu udělal

• Výzkum (5 hloubkových rozhovorů s klienty Michala)
• Obsahová strategie
• Vytvoření první verze textů
• Wireframy
• Vizuální identita
• Fotografování
• Postprodukce fotografií
• Návrh uživatelského rozhraní
• Vývoj webových stránek ve Webflow
• Uživatelské testování
• Nastavení měřicích nástrojů

Využil jsem metod

• Hloubkové rozhovory
• STDC framework
• Vytváření prototypů
• Testování použitelnosti

Proces projektu

1. Uživatelský výzkum
2. Obsahová strategie(STDC framwork)
3. Návrh uživatelského rozhraní
4. Vývoj webu (Webflow)

01 - Uživatelský výzkum

Nejprve jsem se potřeboval dozvědět více o Michalově podnikání a jeho klientech. Cílovou skupinu jsme definovali jako majitele provozovaných e-shopů, kterým je 30-50 let (nevyrůstali s PC), jejich e-shopy mohou mít certifikát "Ověřeno zákazníky" od Heureky.

Požádal jsem Michala o kontakty na jeho současné klienty a zavolal jim. Připravil jsem si pro ně otázky a podle STDC framework jsem zjišťoval, jak vnímají a popisují Michala v různých fázích spolupráce.

Klíčová zjištění

• Zjistil jsem, že je důležité, aby si klienti mohli spolupráci vyzkoušet (ideálně zdarma), než se zavážou k dlouhodobé spolupráci.
• Zjistil jsem, že pokud je první spolupráce úspěšná, nemají problém platit za Michalovy služby, protože ho platí ze zisku.
• Jedna z klíčových odpovědí z uživatelského výzkumu, která se opakovala: "Kdyby nám nenabídl analýzu zdarma, pravděpodobně bychom nespolupracovali."

Jakmile jsem zjistil, co cílovou skupinu zajímá, mohl jsem definovat obsah webu.

02 - Obsahová strategie

V obsahové strategii jsem modeloval cestu zákazníka přes webové stránky. Definoval jsem, jaké stránky by měl web mít a jaké informace by měly být na každé stránce pomocí STDC framework.

STDC framework pro Michala Lyska

Zjistil jsem, že abychom byli schopni odpovědět na všechny otázky majitelů e-shopů ve všech 4 fázích STDC, které mohou mít, budeme potřebovat 11 sekcí, které rozdělíme na 6 stran. Poté, co jsme se s Michalem dohodli na obsahové strategii, jsem vizualizoval obsah pomocí wireframů. Wireframy nám mimo jiné pomohly zjistit, kolik fotografií budeme potřebovat.

Fotografování

Michal Lysek potřeboval pořídit fotografie. Definovali jsme styl fotografování a strávili jsme jeden den fotografováním v ateliéru.

Texty

První verzi textů jsme dali dohromady s Michalem, ale s finální verzí jsme se obrátili na profesionálního copywritera.

‍

03 - Návrh uživatelského rozhraní

Pro vytvoření návrhu uživatelského rozhraní webu jsem potřeboval definovat vizuální identitu. S Michalem jsme prošli několik možností a nakonec jsme se na jedné shodli.

‍

Vizuální identita

Vlastní ikony

Uživatelské rozhraní webových stránek

V obsahové strategii jsme definovali, k čemu by měly sloužit jednotlivé sekce webu. Každá část webu má svůj účel.

‍

04 - Vývoj webu

Webové stránky jsem vytvořil pomocí Webflow.

‍

Animace

Abych zvýšil pravděpodobnost, že návštěvník příspěvek otevře, přidal jsem animace při najetí myší.

Uživatelské testování

Uživatelské testování je nezbytnou součástí návrhu webu. Během testování jsme přišli na několik věcí, kterých jsem si při návrhu nevšiml. Například, že některé mezery mezi sekcemi jsou tak velké, že na mobilním telefonu vzbuzují dojem, že tam stránka končí. Tyto chyby jsme opravili a web spustili. 🎉

Výsledek si můžete prohlédnout zde: www.michallysek.cz

‍

Heatmaps from first 1000 visits

‍

Recenze klienta

V prvních dvou měsících po spuštění byla průměrná doba na stránce 1 minuta 49 sekund a 1,29 % návštěvníků webu si objednalo bezplatný audit e-shopu.

‍

‍

‍

‍

‍

‍

‍