Propojení prototypů v Axure s analytickými nástroji

Při redesignu webu nebo při jeho návrhu je testování nedílnou součástí celého procesu a je vhodné ho provádět v každé jeho fázi. Proč? Protože odstranění chyb například už ve fázi návrhu prototypu webu je časově i finančně nejméně náročné. Díky testování v počátcích redesignu nebo návrhu webu se vyvarujeme zpětného předělávání grafického návrhu, šablon a případně i samotné funkcionality celého webu.

Možností, jak testovat weby nebo webové aplikace, je nepřeberné množství. Můžeme provést heuristickou analýzu, uživatelské testování nebo kvantitativní testování s velkým počtem respondentů. Pokud se rozhodneme pro poslední možnost, nevyhneme se použití analytických nástrojů jako jsou Google Analytics, Hotjar aj. S jejich pomocí snadno zjistíme, jaké prvky na webu návštěvníci skutečně používají nebo kam na stránkách doscrollují. Jakým způsobem ale můžeme nasadit analytické nástroje na prototyp webu?

Propojení analytických nástrojů s prototypem webu

Abychom mohli na prototyp webu nasadit analytické nástroje a reálně se pustit do jeho testování, je potřeba připravit high-fidelity prototyp webu, který umožní návštěvníkům procházet jednotlivé stránky a používat je podobným způsobem jako na plnohodnotném webu.

K návrhu interaktivních prototypů nejčastěji využíváme Axure, který umožňuje vytvářet jak jednoduché skicy, tak komplexní návrhy. Samotné propojení prototypu v Axure s analytickými nástroji provedeme nejsnáze následovně:

1. V Axure vytvoříme prototyp webové aplikace nebo webu, který chceme testovat. Prototyp není nutné nijak speciálně upravovat nebo měnit jeho nastavení. Důležité je pouze publikovat prototyp v Axure Cloudu a získat tak URL adresu, na které je prototyp vystavěn.
2. V analytických nástrojích (Google Analytics, Hotjar, …) vytvoříme nové účty a připravíme si měřicí kódy, které následně vložíme na stránky našeho prototypu. (Pokud již v Google Analytics máme účet, stačí vytvořit jen novou property.)
3. Vložení měřicích kódů do prototypu můžeme provést přímo v Axure Cloudu. Po přihlášení do cloudu přejdeme na detail našeho prototypu a následně do sekce Plugins. Zde je pouze jedna možnost – tlačítko Add Plugin. V otevřeném dialogovém okně plugin pojmenujeme, nastavíme jeho prioritu, vybereme umístění a do textového pole vložíme měřicí kód. Nyní už jen nastavení potvrdíme tlačítkem Add Plugin a vybereme stránky prototypu, do kterých má být měřicí kód vložen. Pro měření všech stránek můžeme použít zrychlenou volbu a použít tlačítko All. V posledním kroku plugin uložíme pomoci tlačítka Save.

Nastavení pluginu v Axure Cloudu

Tím je propojení prototypu v Axure a Google Analytics kompletní. Stejný postup funguje například také pro Hotjar. Pokud tedy chceme vyhodnocovat chování návštěvníků v prototypu webu jak v Google Analytics, tak v Hotjaru, přidáme v Axure cloudu u vybraného prototypu jednoduše další plugin s měřicím kódem z Hotjaru.

Výše popsaným způsobem můžeme realizovat pouze základní měření. Pokud chceme do Google Analytics posílat i události, a tak měřit například počet kliknutí na vybraná tlačítka, musíme použít Javascript přímo v prostředí Axure.

Posílání událostí z prototypu v Axure do Google Analytics

1. K tlačítku nebo libovolnému jinému prvku přidáme požadovanou událost, která se provede po kliknutí na tento prvek (například otevření stránky ve stejném okně).
2. K vybranému prvku přidáme navíc druhou událost – otevření externího linku. Místo URL adresy však vložíme krátký kód v Javascriptu.
   javascript:gtag(‚event‘, ‚click‘, { ‚event_category‘: ‚tiles‘, ‚event_label‘: ‚homepage‘, ‚value‘: 1 });

Ukázka nastavení událostí u tlačítek v Axure

Po kliknutí na náš vybraný prvek se nyní otevře požadovaná stránka a zároveň dojde k odeslání události do Google Analytics. Stejným způsobem můžeme nastavit odesílání událostí do Google Analytics na všech prvcích prototypu, které jsou pro nás důležité.

Pokud máme nastavení měření hotové, stačí už jen náš prototyp zveřejnit respondentům, aby vyzkoušeli splnit zadané úkoly, a následně se podívat do našich analytických nástrojů, jakým způsobem prototyp webu používali.

Na co si dát pozor

K propojení prototypů v Axure s Google Analytics je vhodné použít nejnovější verzi Axure. Starší verze nemusí fungovat správně, případně vůbec. Pozor je třeba dávat také na správný zápis Javascriptů vkládaných do událostí k jednotlivým prvkům. Více o samotném měření událostí v Google Analytics je možné nastudovat přímo v jejich nápovědě.