Po několika případových studiích zaměřených na PPC reklamní kampaně a Facebook aplikace jsme připravili case study týkající se vývoje firemní webové prezentace. Jako ideální volba se ukázal jeden z našich zahraničních klientů, belgická poradenská a konzultační společnost Squaris s.p.r.l.
2. Cíle projektu
• Vytvořit novou webovou prezentaci, jež zajistí:
• vyšší počet objednávek nabízených služeb,
• zvýšení povědomí o značce a pozitivní zpětnou vazbu,
• vyšší návštěvnost webu pomocí
• moderního designu,
• kvalitního obsahu,
• přehledné struktury,
• intuitivního ovládání,
• validního kódu stránek,
• optimalizovatelnosti pro vyhledávače.
3. Počáteční stav
Původní webová prezentace trpěla několika nedostatky:
• nemoderní design,
• absence redakčního systému,
• využití tabulkového layoutu místo pozicování pomocí CSS,
• absence vyhledávání,
• nevalidní kód stránek,
• netextové elementy bez alternativního popisku,
• absence nadpisů v odpovídající struktuře,
• absence optimalizace stránek pro vyhledávače
• a další.
5. Jak jsme postupovali
Dle naší metodiky prochází každý SW projekt následujícími fázemi:
• analýza požadavků a cílů,
• stanovení kritérií úspěšnosti,
• specifikace řešení,
• návrh informační architektury,
• návrh uživatelského rozhraní,
• návrh grafické podoby webu,
• implementace webu,
• uživatelské testování,
• prezentace klientovi a ostrý provoz stránek.
6. Analýza požadavků a cílů
• Analýza byla první a z pohledu výsledku nesmírně důležitá fáze projektu.
• Měla za cíl získat od klienta maximum možných informací ohledně jeho
požadavků a cílů.
• Chtěli jsme znát cílovou skupinu, informace o nabízených službách a další
faktory, které nám následně pomohou při tvorbě webu.
• Získané informace jsme analyzovali a přistoupili ke stanovení kritérií
úspěšnosti.
7. Stanovení kritérií úspěšnosti
• Zaměřili jsme se na konkrétní kritéria, která povedou k dosažení cílů
stanovených v předchozí fázi, tedy kritéria, při jejichž splnění bylo možné
projekt po dokončení považovat za úspěšný.
• Jako u jiných projektů jsme se přednostně zaměřili na exaktně měřitelné
cíle:
• zvýšení návštěvnosti,
• zvýšení počtu objednávek poskytovaných služeb.
8. Specifikace řešení
• Vytvořili jsme typické scénáře použití webu (tzv. user stories).
• Přesně jsme definovali funkce, které by měl web poskytovat.
• V dalších krocích procesu specifikace řešení jsme navrhli informační
architekturu webu a uživatelské rozhraní.
• Výsledkem procesu byla podrobně zpracovaná projektová
dokumentace.
9. Návrh informační
architektury (IA)
• V návrhu informační architektury jsme specifikovali, jaké informace budou
na webu přístupné a jak budou uspořádané.
• Pomocí odpovídajících nástrojů web získal konkrétní strukturu, vyjádřenou i
vizuálně.
• Klient měl samozřejmě možnost se k návrhu vyjádřit a předložit případné
připomínky a náměty na úpravy.
• Výsledný návrh informační architektury můžete zhlédnout na dalším
snímku.
11. Návrh uživatelského
rozhraní (UI)
• Pro každou z unikátních stránek vytváříme tzv. wireframe, který klientovi
poskytuje vizuální představu připravovaného webu.
• Přesně si specifikujeme, kde na stránce budou umístěny jednotlivé prvky.
• Dokončením návrhu uživatelského rozhraní byl také dokončen proces
přípravy kompletní projektové dokumentace.
14. Návrh grafiky webu
• Grafik na základě vytvořených wireframů připravil konkrétní grafický návrh
stránek.
• Klientovi se v tuto chvíli poprvé dostal do rukou návrh finální vizuální
podoby webu.
• Po několika málo úpravách na přání klienta byla grafika hotova,
schválena a předána vývojářům.
• Začal proces implementace webu.
15. Implementace webu
• Grafika byla sice hotova, ale před samotnou implementací webu jsme
ještě museli stanovit přesný plán implementace včetně několika milníků.
• Hotovou grafiku nařezal kodér do HTML a CSS šablon.
• Připravené šablony jsme předali k propojení s redakčním systémem a
dokončení dalších prací.
• Průběh práce jsme neustále porovnávali s projektovou dokumentací, aby
vše odpovídalo zadání.
16. Uživatelské testování
• Po dokončení implementace byl web naplněn zkušebním obsahem (klient
si nepřál web naplnit reálným obsahem) a plně otestován dle
specifikovaných scénářů užití (user stories).
• S pětičlennou skupinou jsme otestovali použitelnost webu.
• Kompletně jsme otestovali funkčnost webu.
• Na základě výsledků testování jsme pak provedli dodatečné úpravy.
• Web prošel také finální kontrolou dle checklistu výstupní kontroly webu.
17. Výstupní kontrola
• Každý z našich webů prochází na konci vývoje pečlivou výstupní
kontrolou, při které znovu hodnotíme:
• Použitelnost webu (návštěvník nesmí být nucen přemýšlet nad
tím, jak s webem pracovat, vše musí být maximálně intuitivní).
• Přístupnost webu (moderní web musí být dobře přístupný i z
prostředí, která nejsou příliš běžná, a především musí být
schopni s webem pracovat i handicapovaní uživatelé).
• Validitu kódu stránek (kód stránek nesmí obsahovat chyby).
• SEO on-page faktory (SEF URL adresy, vyplněné meta tagy,
odpovídající struktura nadpisů, alternativní popisky
netextových prvků apod.)