Testovanie použiteľnosti – pohyb po stránke

Pri testovaní použiteľnosti stránok sa niekedy používajú kamery, ktoré snímajú užívateľove oči a sleduje sa tak pohyb užívateľa po stránke, jeho zaujatie prvkami a dajú sa odhaliť problémové alebo nezaujímavé časti stránok.

Iný pohľad na prácu užívateľov so stránkami (jednotlivej stránke, nie celom webe) poskytuje pohyb myši. Sledovanie pohybu myši neposkytuje informácie o vizuálnom vneme stránok, môže však odhaliť chybne fungujúce rozbaľovacie menu, neatraktívne odkazy, ale rozhodovanie sa užívateľa pri odosielaní formuláru.

Pri čítaní stránky sa kurzor najskôr bude nachádzať mimo textu, pri vypĺnaní formuláru však je možné sledovať pohyb myši hlavne medzi odosielacími tlačidlami.

Napísal som si teda skript, ktorý sleduje zmenu pozície kurzora každú 0,5 sekundu. Keď užívateľ opustí stránku, dáta sa pomocou AJAX technológie odošlú na server. Zatiaľ mám hotový ukladací skript v PHP. V ASP.NET je pri AJAX veľmi výhodné využiť natívnu podporu pre XML formát a HTTP end-pointy v SQL 2005. Skombinovaním AJAX a SOAP je možné priamo pristupovať do databázy bez nutnosti písať server-side kód (v ASP.NET a pod.).

Druhú časť programu tvorí klientská aplikácia v C#, ktorá dokáže z dát vytvoriť mapu pohybu po stránke. Ide len o jednoduchú aplikáciu, ktorá nesťahuje dáta z databázy, ale je potrebné ich vložiť do textového poľa. Vie len zobraziť cestu pohybu po stránke. Bude treba dorobiť drag&drop pre nahratie obrázku do pozadia pod cestu (screen shot stránky). Tu by sa hodilo nové Gecko, ktoré by malo vedieť spraviť z celej stránky jeden veľký obrázok.

User tracker uchováva informcáie o pozícii myši v tomto formáte:

x,y,time[;x,y,time]

V prípade XML formátu sú pozície uložené v elemente p:

<p x="0" y="0" t="5" />

• x je x-ová súradnica kurzoru,
• y je y-ová súradnica kurzoru,
• time (t) je čas v milisekundách medzi 2 zaznamenanými pozíciami kurzoru vydelený 100 (kvôli zníženiu veľkosti dát). Najmenší interval snímania je 500ms.

Časový údaj o pozícii získate napr. takýmto kódom:

List data = ParseData(); // spracuje dáta
TimeSpan absTime = TimeSpan.Zero;
for(int i=0; i<data.Length; i++)
{
        // získanie údaju v milisekundách
        tmpTime = (int)(Convert.ToSingle(data.t) * 100);

        // pridanie k celkovému času
        // teraz obsahuje čas od začiatku snímania kuzoru
        absTime = absTime.Add(new TimeSpan(tmpTime));

        // ... prípadné použite absTime a pod.
}

// absTime obsahuje celkový čas snímania kurzoru

User tracker je uvoľnený pod GPL licenciou. Vyžaduje knižnicu lib.js, ktorá je obsiahnutá v balíku.

Zdrojové kódy User trackeru sú k dispozícii na stiahnutie. Obsahujú knižnicu lib.js, ajax.js, trackuser.js a trackuser.php. V súbore trackuser.js je potrebné upraviť cestu k trackuser.php na absolútnu a v trackuser.php nastaviť meno a heslo pre databázu.

Windows aplikáciu zobrazujúcu castu neuvoľním, kým nebudem mať k dispozícii nástroje pre vývoj aplikácií v .NET v2.0. Plná verzia .NETu v2.0 už bola vydaná, nechcem teda vypúšťať von aplikáciu, ktorá funguje pod beta verziu .NET v2.0.