Přejít k obsahu  Přejít k hlavnímu menu

Firemní weblog poradenské společnosti H1.cz

Zobrazit všechny články
Zpět

Jak postupovat při návrhu malého webu s omezeným rozpočtem?

Aukcejinak.cz

V této případovce se nechceme jen pochlubit provedeným redesignem. Ale především vám chceme na konkrétním případě ukázat jednotlivé postupy při návrhu malého webu včetně všech průběžných výstupů (skicy, fotky, prezentace i wireframy).

Kdo je náš klient

Aukcejinak.cz - Návrh webu od H1.czSpolečnost ARCH consulting s.r.o. poskytuje poradenství a zastupování klienta v oblasti optimalizace a snížení nákladů prostřednictvím moderních nástrojů.

Jinak řečeno, svým zákazníkům prostřednictvím aukcí nabízí snížení výdajů za služby jako plyn,
elektřinu či telekomunikační služby. Podrobnější informace o tom, jak a proč dokáže ceny snížit, najdete na stránkách společnosti.

Firma se prezentuje na adrese aukcejinak.cz, což je v rámci obsahu opravdu malý web do 20 stránek. Hlavním účelem webu je zejména poskytnutí podrobnějších informací potenciálním zákazníkům a budování důvěry. Neslouží tedy primárně jako prodejní web.

 Aukcejinak.cz - Návrh webu od H1.cz

Takto vypadal web ve své původní podobě.

První zadání od klienta

Pro hlubší vhled do celého procesu pro vás máme i detaily v podobě úplně první poptávky a zadání od našeho klienta:

Dobry den,

 

na zaklade naseho telefonu bych vas rad pozadal o nabidku formy spoluprace na prepracovani soucasneho webu www.aukcejinak.cz tak aby odpovidal dnesnim potrebam. Cilem by melo byt navrzeni vhodne struktury web, aby se zakaznik dobre orientoval a pomohl jim s vyberem nasich sluzeb. Zakladni rozdeleni je Verejna Sprava, Podnikatele, Domacnosti, Software, Firma. Vystupem by asi mohly byt wireframy s funkcnimy bloky (ponecham na Vas).

 

Vetsinu veci tam jiz v nejake podobe mame, neni tedy treba vymyslet kompletne novou funkcnost od nuly, ale spise se jedna o logicke usporadani, flow ucesani apod. Samozrejme si take radi nechame poradit ve vsem co uznate za vhodne.

Potom bychom urcite mohli spolupracovat na medializaci a PPC pro domacnosti.

 

S pozdravem,

Robert Smol

Řešení – postup návrhu webu

Součástí zadání byl i rozpočet, který se pohyboval v řádu desetitisíců na samotný návrh. I pro tak malý web byl poměrně omezující (například prozkoumání cílové skupiny už tam prakticky nebylo možné realizovat). Proto jsme se rozhodli získat maximum informací přímo od klienta. A to formou půldenního workshopu, během něhož nám klient vyšel vstříc perfektní spoluprací. Data z workshopu společně s analýzou klíčových slov se stala podkladem pro návrh obsahu, stránek a struktury nového webu.

Celý postup zakázky vypadal následovně:

  1. Seznámení se s projektem
  2. Workshop s klientem
  3. Analýza klíčových slov
  4. Návrh obsahu, stránek a struktury webu
  5. Skici a wireramy
  6. 1 iterace – konzultace k návrhům

Jak vypadal workshop s klientem

Aukcejinak.cz - Návrh webu od H1.cz

Workshop byl nejdůležitější částí celého návrhu, a proto jsme mu věnovali maximální pozornost. Nejprve bylo potřeba si definovat, co chceme získat za informace:

  1. Role webu v dosahování cílů firmy
  2. Kdo je uživatelem webu a jaké má potřeby

         Aukcejinak.cz - Návrh webu od H1.cz

Brainstorming nad potřebami zákazníků.

3. Jak lze naplněním potřeb uživatelů dosáhnout cílů webu a firmy

Aukcejinak.cz - Návrh webu od H1.cz

Postup pro generování nápadů na obsah, který bude dosahovat stanovených cílů.

4. Jak se lze odlišit od konkurence

Takto vypadal naplánovaný harmonogram:

  • 8:30 úvod
  • 9:00 cíle firmy
  • 9:15 cíle webu
  • 9:30 kdo je uživatelem
  • 9:45 seskupení
  • 10:05 pauza – kafe + prioritizace
  • 10:35 – obsah – jak cílů dosáhnout
  • 11:15 – popsat každého lístečky
  • 11:45 – konkurenční výhody
  • 12:15 – diskuse
  • 13:00 časová rezerva

 Aukcejinak.cz - Návrh webu od H1.cz

Náš klient během workshopu.

Předem připravená prezentace pak moderátorovi pomohla účastníky workshopu všemi kroky hladce provést a zajistit informace, které pro nás byly důležité. Pokud se chcete seznámit s podrobnějším průběhem workshopu, stáhněte si celou původní prezentaci.

Aukcejinak.cz - Návrh webu od H1.cz 

Poznámky s postřehy z workshopu.

Co pro vás bylo z workshopu nejzajímavější?

Obsah a struktura webu

Nejprve jsme začali uvažovat nad obsahem webu, kdy jsme primárně vycházeli z informací získaných na workshopu a z analýzy klíčových slov. Obsah jsme vhodně seskupili do logických celků. U každého obsahového bloku jsme brali v potaz přemýšlení návštěvníka a jeho průchod webem. Zaměřili jsme se na to, co mají návštěvníci v danou chvíli udělat, jaké informace mají vidět, kam chceme, aby následně pokračovali. Soustředili jsme se i na to, jaká je jejich motivace a jak ji můžeme využít či podpořit. Z těchto poznatků jsme vytvořili návrh struktury webu.

 Aukcejinak.cz - Návrh webu od H1.cz

První návrh struktury – díky malému rozsahu probíhala práce s obsahem na jednom papíře.

 

 Aukcejinak.cz - Návrh webu od H1.cz

Takto vypadala finální struktura v Excelu.

Návrh jednotlivých stránek webu

Nakonec nás čekalo navržení jednotlivých stránek webu. Na tom, zda umíte, nebo neumíte kreslit, příliš nezáleží. Jak ostatně můžete vidět z následujících stránek. Důležité je zachycení myšlenky v jejím vývoji.

 Aukcejinak.cz - Návrh webu od H1.cz

Průběžné nápady jsme si zaznamenávali na papír formou skic.

Už v průběhu předchozích prací jsme skicovali různé nápady. Měli jsme tak představu o ztvárnění jednotlivých částí obsahu a dosažení požadovaných cílů. Díky tomu jsme si vystačili jenom s drobnými skicami stránek a následným podrobnějším rozkreslením úvodní stránky.  

 Aukcejinak.cz - Návrh webu od H1.cz

Hrubé skici několika stránek a rozmístění obsahu.

 Aukcejinak.cz - Návrh webu od H1.cz

Podrobnější skica úvodní stránky.

Ke všem důležitým nebo typově specifickým stránkám webu se ze skic nakreslily wireframy.

Aukcejinak.cz - Návrh webu od H1.cz 

Nad wireframy následně proběhla iterace formou diskuze s klientem. A navrhované úpravy se zapracovaly. Hotové wireframy si můžete prohlédnout na této adrese: klien­t.h1.cz/aukce­jinak/whsk.

Finální web

Vytvoření grafického návrhu a programování webu se ujala firma Giant interactive s.r.o.. Výsledek si můžete proklikat přímo na webu aukcejinak.cz.

 Aukcejinak.cz - Návrh webu od H1.cz

Takto vypadá nový web.

Pro srovnání si můžete prohlédnout i vývoj, kterým prošla úvodní stránka.

Aukcejinak.cz - Příprava webu od H1.cz

Vlevo je úvodní stránka původního webu a zcela napravo pak její nová verze.

A jak po osmi měsících od dokončení návrhu hodnotí výsledek náš klient ARCH consulting s. r. o.?

S Vaší prací jsme byli velmi spokojeni, ne nadarmo jste jednička na trhu! A rádi se novým webem chlubíme. Moje osobní očekávání byla překonána, web je perfektní a dokážeme ho využívat pro svou propagaci. 

Online klientů moc nemáme a nejspíše mít nebudeme, naše cílová skupina jsou a budou spíše města a podnikatelé, které hledáme přes vlastní call centrum a pomocí mailové komunikace, web nám ale neocenitelně pomáhá, aby si klienti mohli ověřit všechny informace a jít do detailu. Hodně nám záleží na tom, aby klienti získali jistotu, že i my jsme jednička, rozumíme tomu, co děláme a umíme to i přehledně vysvětlit. A náš web je toho nejlepším důkazem. Je přehledný, stručný, ale informační a výborně vypadá.

 

Ing. Aleš Choutka

ARCH consulting s. r. o.

Jednatel

 

Nevíte si rady s informačním webem? Přečtěte si článek o úpravě a vylepšení webu Plzeňskéých městských dopravních podniků.

Autorem článku je Jan Hlaváč aka Ošklivý sup.

  • Franta
    18. 12. 2014 / 18:51

    Výborná případová studie, díky :)

  • Erik V.
    28. 01. 2015 / 15:58

    Dobrý den, můžu se zeptat kolik to stálo?

    • Jan Hlaváč
      28. 01. 2015 / 16:10

      Dobrý den, Eriku,

      mohu pouze uvést rozsah, který se pohyboval kolem ± 30 hodin práce.

  • David Jofuk
    03. 02. 2015 / 21:46

    A má smysl platit si za nový web, když na tento web míří jen šamanské SEO odkazy ze 289 katalogu? Normální odkazující domény 2ks h1.cz a měšec. A co jsem zkoušel relevantní KW tak jste na 10–11 stránce SERPu. Má ten web úspěch nebo to byli vyhozené $?

    • Juraj
      05. 02. 2015 / 17:22

      Odpověď na tuto otázku dává hodnocení klienta na konci článku: „Online klientů moc nemáme a nejspíše mít nebudeme, naše cílová skupina jsou a budou spíše města a podnikatelé, které hledáme přes vlastní call centrum a pomocí mailové komunikace, web nám ale neocenitelně pomáhá, aby si klienti mohli ověřit všechny informace a jít do detailu. Hodně nám záleží na tom, aby klienti získali jistotu, že i my jsme jednička, rozumíme tomu, co děláme a umíme to i přehledně vysvětlit. A náš web je toho nejlepším důkazem. Je přehledný, stručný, ale informační a výborně vypadá.“ Takže SERP pro tento web není vůbec důležitý, KPI jsou někde úplně jinde.

  • Dobrý copywriter
    09. 02. 2015 / 23:18

    Honzo, jak to pak prosím probíhalo dál? Wireframy se místy liší od výsledné podoby webu, takže by mě zajímalo, kdo v tomhle případě navrhuje změny, jestli potom nejsou boje mezi UXáky a grafiky a kdo je zodpovědný za to, že změna oproti navrženému wireframu bude k lepšímu. Třeba schování kalkulačky pod tlačudlo je výrazná změna. Na některé podstránce chybí blok garance snížení ceny. Jak tohle komunikujete a řešíte, pokud není rozpočet na otestování? Má poslední slovo UXák, grafik nebo to rozřeší někdo další, třeba textař, klient? Nebo se vždycky nějak kolektivně domluvíte? :) Jinak výsledek vypadá suprově. Díky za doplnění, pokud to tedy není tajné :). Richard

    • Ošklivý sup
      12. 02. 2015 / 14:34

      Ahoj Richarde, boje jsou skoro vždy, ale snažíme se, aby to byla víc diskuse než boj. Řešení je zapojení všech stran od začátku celého projektu a průběžné informování a spolupráce. U tady toho projektu jsme bohužel u vývoje nebyli, ale Giant to zvládli myslím perfektně.

  • Vít Luštinec
    11. 12. 2015 / 10:20

    Díky za článek. Koukal jsem, že na zmiňované adrese je už jiná podoba webu, nevíte proč se rozhodli tak rychle opět ke změně? http://www.aukcejinak.cz/

RSS feed komentářů k tomuto článku
RSS feed komentářů ke všem článkům



(nebude zveřejněn)



Položky označené * jsou povinné