Testování webu a předání designu vývojářům

Design je hotový, teprve když se dostane do produkce nedotčený a měřitelně funguje. Testování webu vedeme na skutečných lidech, kteří tvůj produkt vidí poprvé, a zapisujeme, kde zaváhali. Makety pak předáváme vývojářům s popisem chování, aby se cestou do kódu nic neztratilo. Po spuštění sledujeme čísla a upravujeme podle nich, dokud testování neukáže, že cesta drží.

Od15 000 Kčza projekt

Začít projektZjistit cenu
  • 5uživatelů odhalí asi 80 % problémů
  • 1-2 týd.ke klikacímu prototypu
  • 2 kolapřipomínek v ceně návrhu
  • 0 Kčza změnu, dokud je to návrh

Testování webu ukáže, jestli lidé zvládnou to hlavní: najít službu, poslat poptávku, zaplatit. Uživatelské testování stojí od 15 000 Kč, předání designu vývojářům od 6 000 Kč. Po spuštění sledujeme heatmapy a konverze a web podle nich upravujeme měsíc po měsíci.

Testy vedeme na pěti až osmi lidech z cílové skupiny a nahrávky dostaneš celé.

Testy vedeme na pěti až osmi lidech z cílové skupiny a nahrávky dostaneš celé.

Před vydáním projdeme hotový web proti návrhu obrazovku po obrazovce, na mobilu i na počítači.

Před vydáním projdeme hotový web proti návrhu obrazovku po obrazovce, na mobilu i na počítači.

Vývojáři dostanou komponenty se stavy, rozměry a tokeny, takže nic nemusí odhadovat.

Vývojáři dostanou komponenty se stavy, rozměry a tokeny, takže nic nemusí odhadovat.

Po spuštění porovnáváme konverze s výchozím stavem, aby bylo vidět, co změny přinesly.

Po spuštění porovnáváme konverze s výchozím stavem, aby bylo vidět, co změny přinesly.

Každá služba v této kategorii, srozumitelně

  • Uživatelské testování

    Skuteční lidé plní úkoly v produktu a vidíš, kde se zastaví.

    Začít projektSpočítej si cenu

    V kostce Uvidíš skutečné lidi, jak plní skutečné úkoly ve tvém produktu, a hlavně kde se zastaví. Testování webových stránek i aplikací vedeme osobně nebo na dálku s nahráváním obrazovky, podle toho, koho potřebujeme dostat před produkt a jak rychle.

    Jak postupujemePřipravíme úkoly na konkrétní otázku, tedy co má člověk na webu zvládnout, a sháníme účastníky, kteří odpovídají tvým zákazníkům. Během sezení nezasahujeme a necháváme lidi dojít tam, kam dojdou. Nálezy pak počítáme podle toho, kolik lidí se o daný problém zaseklo, a k nim stříháme ukázky.

    Co si odnesešSestříhané ukázky konkrétních zaseknutí a seznam nálezů s návrhem opravy u každého. K tomu scénář testu a nahrávky celých sezení, aby se dalo vrátit k detailu.

    Co je v ceně

    • Skutečné úkoly, bez otázek na názor
    • Sestříhané ukázky problémů
    • Nálezy podle četnosti, bez dojmu
    • Osobně i na dálku

    Konverzní poměr

    Víc lidí z návštěvnosti, kterou už máš, udělá to, co má.

    Začít projektSpočítej si cenu

    V kostce Práce na jediné otázce: kolik z lidí, kteří už na web přišli, udělá to, co má. Platí to návštěvnost, kterou už máš, takže se výsledek projeví bez zvýšení rozpočtu na reklamu. Nejčastější zisk leží ve zbytečném kroku nebo v otázce navíc ve formuláři.

    Jak postupujemeZačínáme měřením a nálezy z dat, pak měníme texty, rozvržení a kroky v procesu, a to po jedné věci. Každou změnu pouštíme proti původní verzi a test necháváme běžet, dokud čísla něco znamenají. Zastavit ho v den, kdy vypadá dobře, je způsob, jak si lhát.

    Co si odnesešNasazené změny, které v testu obstály, a zápis o každém testu: co se měnilo, jak dlouho běžel, kolik lidí prošlo a jaký byl rozdíl. K tomu seznam hypotéz, které čekají na řadu, seřazený podle očekávaného dopadu.

    Co je v ceně

    • Měření dřív než změny
    • Jedna změna na jeden test
    • Zisk bez zvýšení rozpočtu na reklamu
    • Testování webu proti původní verzi

    Heatmapy

    Měření, na kterém vidíš, kde lidé váhají a odcházejí.

    Začít projektSpočítej si cenu

    V kostce Měření nastavené tak, abys viděl, kde lidé váhají, kam klikají marně a kde odcházejí. Vedle počtu návštěv uvidíš i to, jak daleko se člověk dostane a ve kterém kroku odpadne. Bez téhle vrstvy jsou další úpravy jen dohady.

    Jak postupujemeNastavíme cíle a události podle tvého byznysu a ohlídáme souhlasy podle GDPR. Zapneme heatmapy, nahrávky relací a trychtýře a ověříme, že se události opravdu sbírají. Data pak každý měsíc čteme a přetavujeme do krátkého seznamu oprav seřazeného podle dopadu.

    Co si odnesešNastavené měření s pojmenovanými cíli a událostmi, heatmapy, nahrávky relací a trychtýře pro klíčové cesty, plus dokument, který popisuje, co se měří a jak se to počítá. Každý měsíc k tomu krátký seznam oprav seřazený podle dopadu.

    Co je v ceně

    • Heatmapy, nahrávky relací i trychtýře
    • Cíle podle byznysu, bez počtu návštěv
    • Nastavené s ohledem na GDPR
    • Měsíční seznam oprav podle dopadu

    Součástí balení

    Tohle si neobjednáváš zvlášť: je to v každé zakázce a děláme to my.

    Validace designu

    Kontrola hotového produktu proti návrhu ještě před vydáním: odstupy, stavy, texty, okrajové případy a přístupnost. Chytáme drobné rozdíly, kterých si jednotlivě nikdo nevšimne. Dohromady způsobí, že hotová aplikace působí levněji než návrh.

    Hotový produkt procházíme obrazovku po obrazovce proti návrhu. Testování webu nekončí u vzhledu: zkoušíme i ovládání klávesnicí, čtečku obrazovky, pomalé připojení a nezvykle dlouhé texty. Stejně důkladně projdeme CZ verzi i ostatní jazykové mutace. Každou odchylku zapisujeme se snímkem a odkazem na konkrétní místo.

    VýstupSeznam odchylek k odškrtání, u každé snímek, odkaz na místo v produktu a popis, čím se liší od návrhu. Dá se rovnou nasypat vývojáři do úkolovníku bez dalšího třídění.

    • Odchylky se snímkem a odkazem
    • Testování klávesnice a čtečky obrazovky
    • Chytá drobnosti, které kazí dojem z celku
    • Seznam k odškrtání před vydáním

    Předání designu

    Předání, po kterém se produkt dá postavit správně napoprvé: specifikace rozměrů a barev, tokeny, assety ve správných formátech a okomentované toky. U každé obrazovky je popsané, co se stane po kliknutí a co uvidí uživatel, když se něco nepovede.

    Assety exportujeme včetně variant pro vysoké rozlišení a tmavý režim, aby se nedodělávaly narychlo v půlce vývoje. Materiál pak projdeme s vývojáři hovorem krok za krokem, protože pět minut otázek ušetří dvě kola oprav. Po předání zůstáváme dostupní na dotazy.

    VýstupPředávací balík: obrazovky se specifikacemi, tokeny, exportované assety a okomentované toky, plus zápis z předávacího hovoru s otázkami, které padly. Po předání zůstáváme dostupní na dotazy, které stejně přijdou.

    • Specifikace, tokeny a hotové assety
    • Popsané chování u každé obrazovky
    • Varianty pro tmavý režim i vysoké rozlišení
    • Předání hovorem, bez pouhého odkazu

    Podpora vývoje

    Designér zůstává v týmu po celou dobu implementace, tedy i dlouho po odevzdání souborů. Rozhoduje situace, které se v návrhu nedají předvídat: skutečná data jsou delší, jazyková verze se nevejde, komponenta se v prohlížeči chová jinak.

    Odpovídá na dotazy a průběžně prochází sestavené verze, takže se odchylky chytají po jedné a hned. U každé řekne, co je detail k odložení a co by produkt pokazilo. Kritické cesty navíc hlídá automatické testování, které upozorní na regresi dřív, než si jí někdo všimne.

    VýstupDostupného designéra po dohodnutou dobu, průběžné zápisy z procházení verzí a zaznamenaná rozhodnutí u sporných míst. Výsledkem je nasazený produkt, který odpovídá návrhu.

    • Designér dostupný po celý vývoj
    • Průběžné testování sestavených verzí
    • Rozhoduje se s ohledem na rozpočet
    • Odchylky se chytají po jedné

    Technologie

    Znáš to?

    Pan Novákprvní hovor

    1. Hotový web vypadá jinak než návrh

    2. Když vývojář dostane jen obrázky, dopočítává rozestupy, stavy a mobilní verzi po svém. Předáváme specifikace, které nic neponechávají náhodě, a výsledek kontrolujeme proti návrhu.

    3. Po spuštění nevíme, jestli redesign pomohl

    4. Bez výchozího čísla se úspěch nedá změřit. Před spuštěním zapíšeme konverze a po něm je porovnáme, takže víš, jestli se změna vyplatila.

    5. Návštěvníci se zasekávají a nevíme kde

    6. Heatmapy a záznamy relací ukážou, kam lidé klikají, kam až scrollují a kde odcházejí. Z toho vzniká seznam úprav, které testujeme jednu po druhé.

    7. Vývojáři se ptají na každý detail a projekt stojí

    8. Otázky během vývoje zdržují týdny. Designér je k dispozici celou dobu stavby a odpovídá tentýž den, takže tým nemusí čekat.

    Ve které situaci jsi ty?

    Vyber si svůj případ a dosaď svoje čísla. Obrazovka spočítá, co tím ztrácíš nebo získáváš.

    Lidi mi odcházejí a nevím proč

    Návštěvníků za měsíc2 000
    Kolik návštěvníků nakupuje1,5 %
    Průměrná objednávka2 900 Kč

    Aby se audit UI/UX vrátil za 3 měsíce, stačí

    +8,4 % ke konverzi

    Teď ti web vydělává zhruba 87 000 Kč za měsíc: 2 000 návštěvníků, z toho 1,5 % nakupuje za 2 900 Kč. Audit UI/UX obvykle stojí 22 000 Kč.

    Cena „obvykle“ je z ceníku studia. Tržby bez marže. Jde o práh návratnosti, růst konverze předem nikdo negarantuje.

    Začít projekt

    Stavím něco nového

    Rozpočet na vývoj490 000 Kč
    Kolik obrazovek podle tebe bude nutné předělat25 %

    V ohrožení kvůli předělávce po spuštění je

    122 500 Kč z rozpočtu

    Předělat 25 % obrazovek po spuštění znamená zaplatit navíc 122 500 Kč z 490 000 Kč. Klikací prototyp u nás obvykle stojí 30 000 Kč, a tyhle úpravy se dělají v něm ještě před kódem.

    Podíl předělávek zadáváš ty. Cena prototypu „obvykle“ je z ceníku studia.

    Začít projekt

    Chyby nám hlásí až zákazníci

    Kolik chyb po vydání měsíčně8
    Hodin na opravu jedné3 h
    Kolik stojí hodina vývojáře750 Kč

    Opravy po vydání stojí

    18 000 Kč za měsíc

    8 chyb měsíčně po 3 h, to je 24 h práce po 750 Kč na hodinu. Testování s lidmi před vydáním u nás obvykle stojí 28 000 Kč a vrátí se za 1,6 měsíce.

    Odhad shora: počítáme, že testování najde všechny tyhle chyby před vydáním. Zákazníky, které chyba odradí, nepočítáme. Cena „obvykle“ je z ceníku studia.

    Začít projekt

    Otestovat si to v týmu?

    Proklikat web v kanceláři před spuštěním je rozumné a chytí to rozbité odkazy i překlepy. Jde o to, co takový test nezachytí: lidi, kteří produkt vidí poprvé a nikdo jim neřekne, kam kliknout.

    Kdy ti stačí vlastní kontrola

    • Hledáš technické chyby: nefunkční odkazy, překlepy, rozbité formuláře
    • Měníš drobnost na webu, který jinak funguje
    • Web je malý a všechny jeho cesty se dají projít za hodinu
    • Máš čas a nástroje na heatmapy a umíš z nich číst

    Kdy to nestačí

    • Tým ví, kde co je, a zmatek nového návštěvníka nevidí
    • Nikdo nezapsal výchozí čísla, takže efekt změn se nedá změřit
    • Kontrola proti návrhu proběhne jen na počítači a mobil zůstane stranou
    • Z heatmap se čte dojem, a úpravy se netestují jedna po druhé

    Od návrhu k webu, který obstál na lidech

    1. Víš, co ověřujeme

      Hovor a cíle

      Domluvíme, co má test zjistit a podle jakých čísel se bude rozhodovat. Dostaneš pevnou cenu a termín.

    2. Slyšíš skutečné uživatele

      Test na lidech

      Pět až osm lidí z cílové skupiny dostane úkoly na prototypu nebo hotovém webu. Nahrávky a souhrn zjištění dostaneš.

    3. Tým ví, co stavět

      Předání vývojářům

      Komponenty se stavy, rozměry a tokeny barev a písma, popis chování a mobilní verze. Specifikace, ze které se staví bez dotazů.

    4. Nic nečeká na odpověď

      Podpora při vývoji

      Designér odpovídá vývojářům během celé stavby, obvykle tentýž den, a dokresluje stavy, které se ukážou až v kódu.

    5. Web odpovídá návrhu

      Kontrola proti návrhu

      Hotový web projdeme obrazovku po obrazovce na mobilu i počítači a rozdíly zapíšeme se snímky. Opraví se před spuštěním.

    6. Víš, co změna přinesla

      Měření po spuštění

      Heatmapy a konverze porovnáme s výchozím stavem. Na měsíční optimalizaci pak testujeme úpravy jednu po druhé.

    Kolik stojí testování a předání

    Uživatelské testování od 15 000 Kč, předání designu od 6 000 Kč, podpora vývojářů od 8 000 Kč měsíčně, optimalizace konverzí od 7 000 Kč měsíčně. Cena je konečná, nic se k ní nepřičítá.

    Zjistit cenu

    Nejdřív důkazy, potom vkus

    Designujeme podle důkazů: výzkum řekne, co opravit, prototyp to ověří na skutečných lidech a analytika po spuštění ukáže, jestli to zabralo. Všechno stojí na design systému, jednom zdroji pravdy pro barvy, písmo, odsazení a komponenty, takže nové obrazovky vznikají v hodinách místo dnů a produkt zůstává konzistentní, jak roste. A při předání nemizíme: designér zůstává na telefonu během vývoje, aby se hotový produkt shodoval s tím, který jsme otestovali.

    Na co se lidé ptají nejčastěji

    Co je uživatelské testování webu?

    Lidé z tvé cílové skupiny dostanou úkoly, třeba najít službu a poslat poptávku, a my sledujeme, kde zaváhají. Nikdo jim neradí. Výsledkem je seznam míst, kde web lidi ztrácí, s nahrávkami jako důkazem.

    Kolik stojí testování webu?

    Uživatelské testování od 15 000 Kč, běžně kolem 28 000 Kč podle počtu úkolů a skupin. Validace návrhu od 30 000 Kč. Předání designu od 6 000 Kč. Cenu víš předem. Cena je konečná, nic se k ní nepřičítá.

    Kolik lidí na test potřebujete?

    Pět až osm z každé cílové skupiny. Pět účastníků podle výzkumu Nielsen Norman Group najde zhruba 85 % problémů použitelnosti, další lidé už hlavně potvrzují, co víme.

    Co přesně dostanou vývojáři při předání?

    Soubory Figmy s komponentami a jejich stavy, rozměry a rozestupy, tokeny barev a písma, popis chování a mobilní verze každé obrazovky. K tomu exportované ikony a obrázky ve správných formátech.

    Testujete i nástroji?

    Ano, rychlost, přístupnost a základní chyby kontrolujeme nástroji jako Lighthouse a PageSpeed před spuštěním i po něm. Nástroj ale nezjistí, jestli člověk rozumí nabídce a najde, co hledá. Na to je testování s lidmi.

    Co jsou heatmapy a k čemu jsou?

    Heatmapa ukazuje, kam lidé na stránce klikají a kam až scrollují. Záznamy relací ukážou konkrétní návštěvu krok po kroku. Obojí slouží k hledání míst, kde web lidi ztrácí. Měříme jen se souhlasem v cookie liště.

    Jak funguje měsíční optimalizace konverzí?

    Každý měsíc vybereme podle dat jednu nebo dvě úpravy, nasadíme je a měříme proti výchozímu stavu. Co pomohlo, zůstane, co ne, vrátíme. Report dostaneš na jednu stránku. Smlouva běží měsíc po měsíci.

    Otestujete i web, který jste nedělali?

    Ano. Testujeme hotové weby i prototypy bez ohledu na to, kdo je stavěl. Výsledky můžeš předat svému týmu nebo opravy uděláme my.

    Jak dlouho testování trvá?

    Test s pěti až osmi lidmi obvykle dva týdny, z toho většinu zabere hledání a domlouvání účastníků. Kontrola hotového webu proti návrhu dva až tři dny podle počtu obrazovek.

    Sousední kategorie

    Všechny služby

    Výzkum

    3 služby

    Prototypování

    2 služby

    Vizuální design

    3 služby

    Jdeme postavit něco pořádného?

    Napiš nám pár vět. Ozveme se do několika hodin a domluvíme krátký hovor.

    1. 1Do pár hodin: odpoví ti člověk: první myšlenky, možná pár otázek.
    2. 2Do pár dnů: 30minutový hovor. Ty mluvíš, my posloucháme. Zdarma, bez závazků.
    3. 3Po hovoru: písemná pevná nabídka, nebo upřímná odpověď, že pro tebe nejsme ti praví, a tip, na koho se obrátit.

    Žádné obchodní skripty. Budeš mluvit s lidmi, kteří to skutečně postaví.

    Alergie na formuláře? Chápeme.info@chronicles.cz+420 773 230 278

    Odesláním formuláře souhlasíš se zpracováním vyplněných údajů za účelem odpovědi na tuto poptávku. Ochrana osobních údajů. Údaje slouží jen k odpovědi. Neprodáváme je a do newsletteru nepřidáváme.