Web Marketing e Analisi posizione del mouse

[kerouac3001]

Come molti di voi avranno notato ho partecipato alla gara di home page di GT dimostrando a tutti di essere il grafico più negato al mondo.

Qualcun altro avrà anche notato che nella mia pagina proponevo l'utilizzo di uno script che analizza la posizione del mouse e la salva su di un database rendendola disponibile per future analisi.

L'idea non è mia..è nata da un discorso sulle landing pages iniziato da Fabio Dell'Orto. In quel thread fradefra oltre a dare altri saggi consigli ha detto:

fradefra

Sapete che lo studio del movimento del mouse può portare ad interessanti conclusioni? Se qualcuno ci mettesse in grado di tracciare il passaggio del mouse su certi componenti dello schermo (e so che si può fare, anche se non facile), si potrebbe sapere:
1) se il visitatore è realmente sulla pagina o se la pagina è aperta e lui sta bevendo il caffè;
2) quale componente attrae subito la sua attenzione. Molti studi dimostrano che quasi sempre la mano segue l'attenzione e si sposta automaticamente su ciò che attrae. Poi il click non può esserci...ma se sapessi che c'è andato....
3) quale percorso segue il suo sguardo. Il mouse è l'ombra della mente, per un certo profilo di visitatore.

Dopo aver letto questo post mi è venuta un'incredibile voglia di fare lo script, subito soffocata dall'enorme mole di lavoro quotidiano.
Così ho partecipato al concorso con una semplice bozza dello script, più che altro per vedere se riuscivo ad incuriosire qualcuno.

La pagina che ho proposto aveva però un problema enorme che potete capire dalla seguente citazione (tratta dalla mia home)

home di kerouac3001

Creare questa homepage ha richiesto varie rinunce: non si possono inserire link html, ma solo pulsanti che indirizzino allo script di analisi e che facciano in seguito redirect sulla pagina richiesta; non si possono analizzare i dati durante la presenza dell'utente nella pagina, ma solo quando clicca su un link. Questo perché gli script lato server non permettono un'analisi durante la navigazione, mentre gli script lato client non permettono la memorizzazione dei dati. La soluzione è: utilizzare uno script lato client che invii i dati raccolti tramite post ad uno script lato server, che potrà gestirli come meglio crede.

Attualmente lo script lato client raccoglie i dati e lo script lato server li visualizza graficamente tramite un'immagine jpeg che potrete vedere cliccando su Link1, mentre cliccando su Link2 potrete vedere i punti di maggior interesse (quelli rossi) e il punto medio (quello verde) calcolato basandosi su tutte le posizioni del mouse. Link3, invece, esegue lo script e poi fa redirect su una nuova pagina (che non esiste, dato che è una gara di homepage).

Il problema è stato risolto grazie all'aiuto di Low che mi ha suggerito di utilizzare il "reload" automatico di un'immagine a cui associare uno script php.

A questo punto mi son messo a buttar giù la seconda bozza dello script che si basa su 2 file principali (quelli di cui vi fornirò il codice) e di un file secondario contenente i dati privati del mio database (questo non ve lo mostrerò ovviamente perchè contiene password e login ).

il primo file contiene il codice da inserire nelle pagine che si vogliono monitorare:

<script>
<!--

// Detect if the  browser is IE or not.
// If it is not IE, we assume that the browser is NS.
var IE = document.all?true:false

var bufferImage = new  Array();

function Buffer(filename) {
    var i = bufferImage.length;
    bufferImage[i] = new Image();
    bufferImage[i].src = filename;
    }


// If NS -- that is, !IE -- then set up for mouse capture
if (!IE) document.captureEvents(Event.MOUSEMOVE)

// Set-up to use getMouseXY function onMouseMove
document.onmousemove = getMouseXY;

// Temporary variables to hold mouse x-y pos.s
var tempX = 0
var tempY = 0

// Main function to retrieve mouse x-y pos.s

function getMouseXY(e) {
  if (IE) { // grab the x-y pos.s if browser is IE
    tempX = event.clientX + document.body.scrollLeft
    tempY = event.clientY + document.body.scrollTop
  } else {  // grab the x-y pos.s if browser is NS
    tempX = e.pageX + document.body.scrollLeft
    tempY = e.pageY + document.body.scrollLeft
  }  
  // catch possible negative values in NS4
  if (tempX < 0){tempX = 0}
  if (tempY < 0){tempY = 0}  
  // show the position values in the form named Show
  // in the text fields named MouseX and MouseY
    document.images[Image_Name].src = 'immagine.php?x=' + tempX + '&y=' + tempY;
  return true
}

Image_Name = "SHOWPAD";

Buffer("01.gif");

Buffer("02.gif");

Buffer("03.gif");

Buffer("04.gif");

//-->

</script>
[img][/img]

il secondo file (immagine.php) contiene il codice php e si occupa della memorizzazione dei dati:

<?
require('config_inc.php');

$x = $_GET['x'];
$y = $_GET['y'];

$pagina= $_GET['url'];

// $pagina = $_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'];

// $query = "SELECT * FROM `dati` WHERE `x`='".$x."' AND `y`='".$y."' AND `pagina`='".$pagina."'";
$query = "SELECT * FROM `dati` WHERE `x`='".$x."' AND `y`='".$y."' AND `pagina`='".$pagina."'";
$result =  mysql_query($query);

$row=mysql_fetch_array($result);

$num_righe = mysql_num_rows($result);
if ($num_righe>0){
$tot=$row["tot"]+1;
$query = "UPDATE `dati` SET `tot`='".$tot."' WHERE `x`='".$x."' AND `y`='".$y."' AND `pagina`='".$pagina."'";
$result = mysql_query($query);
}else{
$query = "INSERT INTO `dati` (x , y , pagina, tot) VALUES ('".$x."', '".$y."', '".$pagina."', '1')";
$result = mysql_query($query);
}

?>

Questo è quanto ho fatto finora. Mi scuso per le poche spiegazioni che vi sto fornendo, ma purtroppo non ho molto tempo. Spero che il progetto vi incuriosisca abbastanza da farvi partecipare. Ora come ora abbiamo la base imperfetta.
Imperfetta perché i dati prelevati in questo modo sono troppi e occupano troppo spazio. Sarebbe buono fare come consiglia fradefra:

fradefra

Infatti queste analisi si fanno poi con software come SPSS o BrioQuery o altri sistemi di analisi multidimensionale.
Il primo trucco consiste nel ridurre i percorsi a percorsi per step di rilievo (es: sapere che è passato su certi pixel non importa, se sappiamo che un certo insieme di pixel fa parte di un certo componente).
Il secondo trucco, utile per sapere se c'è movimento, è partire dal presupposto che tengo solo il fatto che il movimento c'è e non i singoli pixel. Quindi, invece che una coppia di coordinate al secondo, un bit al secondo, in uno streaming che rappresenta il tempo. Inoltre, sempre al fine di tenere traccia del fatto che il movimento c'è, possiamo anche decidere di dividere per 10.
Insomma, comincia col tenere tutti i dati, poi con software di analisi fai gli aggregati che ti servono. Se non vuoi spendere la paccata di migliaia di euro di SPSS o le centinaia di BrioQuery, c'è R, software Open-source usatissimo nelle Università.

Ora come ora il mio script fa questo:

ogni volta che il mouse si muove il javascript passa al php 3 variabili (url, x e y) e il php le memorizza in questo modo: se la tripla di dati è già presente nel db allora incrementa di 1 il campo tot (che tiene conto di quante volte la tripla è presente nel db)..se invece la tripla non è presente allora la aggiunge al db.

Il dati non crescono a dismisura perchè sono limitati alle dimensioni della pagina, ma se si vogliono monitorare molte pagine o pagine molto lunghe allora può essere un problema.

La soluzione di fradefra (monitorare aree invece che pixel) è ottima, ma bisogna decidere come sia meglio applicarla. Si potrebbe creare una seconda tabella interna al database in cui inserire (tramite uno script) le aree che ci interessa monitorare in ogni pagina.

Inoltre fradefra propone il monitoraggio del movimento (molto utile)..ma io preferisco fare un passo alla volta. Iniziamo a buttar giùù idee (anche su altri elementi da considerare) e poi avanziamo passo dopo passo verso il completamento dello script.

Non è necessario che i partecipanti al progetto abbiano buone conoscenze di php..la cosa più importante ora è mettere insieme molti cervelli e trovare la soluzione migliore.

Ci sono inoltre 2 fasi principali di cui ci occuperemo. Inizialmente sarà importante raccogliere i dati, ma sarà altresì importante raccoglierli bene. Dobbiamo raccoglierli in modo da poterli in seguito analizzare e farci dire tutto ciò che ci interessa. Questa sarà poi la seconda fase: creare uno script che si occupi dell'analisi

Vi ricordo che sono straimpegnato di questi tempi, ma mi occuperò del progetto ogni volta che avrò tempo libero..chi ha già lavorato con me alla realizzazione di altri script sa che sono molto veloce..quindi anche se avrò poco tempo farò in modo che non vi accorgiate della mia assenza

P.S. ovviamente in questo progetto c'è un gruppo di persone veramente indispensabile: gli esperti di web marketing. Quindi gente come fradefra, gero, nelli, Catone, Calogero Dimino e tutti quelli che hanno una buona esperienza in questo campo. Questo lo dico per non scoraggiare chi non conosce i linguaggi che useremo per creare lo script. Non è importante solo saper fare una cosa, è ancora più importante sapere cosa deve fare per essere utile..e per far questo non è essenziale nessuna conoscenza di programmazione.

[Mamilu]

Fantastico!

Bravo Kerouac

[lukas]

E' una cosa veramente fantastica questa! Sul serio!
All'università hanno sottoposto alcuni soggetti ad un test simile. Praticamente mettono delle piccole telecamere vicino agli occhi e poi ti mettono davanti ad un monitor.
Riescono a capire esattamente dove stai guardando e quali sono le aree che hai guardato del monitor.
Ma il tuo è ancora più interessante.

[kerouac3001]

La soluzione di fradefra (monitorare aree invece che pixel) è ottima, ma bisogna decidere come sia meglio applicarla. Si potrebbe creare una seconda tabella interna al database in cui inserire (tramite uno script) le aree che ci interessa monitorare in ogni pagina.

Mi quoto per suggerire un'altra cosa..invece di stabilire le aree tramite pixel potremmo stabilirle inserendo nel codice html dei codici javascript che al passaggio del mouse in un determinato elemento (a href, div, p, body...) segnalino allo script che il mouse è sopra quella zona.

Possiamo inoltre aggiungere una tabella temporanea nel DB in cui verranno raccolti i risultati ogni giorno (con più dettagli)..a fine giornata i dettagli verranno eliminati automaticamente e i dati rilevanti verranno sommati a quelli presenti nella tabella principale.


Per esempio la tabella dei tettagli potrebbe contenere:

ip - componente - permanenza totale - permanenza attiva - totale movimenti pervenuti - data ultimo movimento pervenuto - data primo movimento del mouse - data ultimo segnale

ip = ip unico nell'arco delle 24 ore ci permette di sapere cosa fa l'utente nelle 24 ore

componente = ci permette di sapere quale componente è attualmente oggetto di interesse dell'utente

permanenza totale = (devo trovare un modo per calcolarla bene) è in teoria il tempo totale che l'utente ha trascorso su una determinata componente. Per ora penso che la calcolerò così:

All'arrivo dell'utente nel sito inserisco (o aggiorno se già esiste) nella tabella temporanea una riga con ip componente e data ultimo segnale, poi attivo un timer in javascript, che viene azzerato ogni volta che l'utente muove il mouse. Se il timer arriva ad 1 minuto (senza movimenti del mouse) allora il javascript invia il segnale al php che aggiorna la data dell'ultimo segnale. Perché tutto sto casino? perchè in questo modo se un utente ha inviato l'ultimo segnale alle 23.35 e il seguente segnale arriva alle 23.38..io so che dopo le 23.35 non è stato nella pagina. Ovviamente se l'utente è attivo e muove spesso il mouse il problema non si pone. Questo però mi permette di sapere per quanto tempo un utente resta attivo anche se il suo mouse non si muove. Questo tipo di permanenza immobile verrà aggiunta alla permanenza totale (insieme alla permanenza attiva). Se qualcuno mi suggerisce un altro modo per capire se un utente ha abbandonato una pagina, accolgo il suggerimento molto volentieri..io purtroppo quando non so una cosa mi ingegno per trovare soluzioni alternastive per lo più incasinate

permanenza totale = mi serve a capire se un utente è a prendersi un caffè o se sta veramente navigando. Ovviamente un utente può essere inattivo, mentre legge un testo, ma molti di loro preferiscono seguire le parole col puntatore (se sono attivi o se reputano il testo interessante o se pensano che la lettura durerà poco e dunque non c'è motivo di mollare il mouse). Spesso però accade che di fronte a testi lunghi (e alla sicurezza che la lettura richiederà molto tempo), dicevo in queste situazioni spesso accade che l'utente molli il mouse e legga il testo fino alla termine della pagina dopo di che ha 4 opzioni:
- si stanca e smette
- il testo è finito
- scende usando la tastiera
- scende usando il mouse

Ovviamente sarebbe possibile monitorare queste 4 situazioni per capire se l'inattività del mouse sia solo dovuta ad una attenta lettura..ma per ora limitiamoci alla pura raccolta dei dati.

Permanenza attiva = ci serve a capire quanto un utente è stato attivo in una componente in termini di secondi, minuti o ore

Totale movimenti pervenuti = ci serve a capire quante volte ha mosso il mouse (oltre una determinata soglia è parkinson )

Data ultimo movimento pervenuto = ci serve a calcolare per quanto tempo un utente è attivo. Ogni volta che il mouse viene mosso la permanenza attiva viene aggiornata basandosi della data primo movimento (in cui inseriremo la date del primo movimento avvenuto dopo uno stato di inattivita e/o all'arrivo dell'utente nel sito), inoltre aggiorneremo anche la data dell'ultimo segnale e la data dell'ultimo movimento. Dopo un minuto dall'ultimo movimento si passa allo stato inattivo e viene detratto un minuto dallo stato attivo. Ovviamente al secondo minuto se la data dell'ultimo segnale è diversa dalla data dell'ultimo movimento allora non viene detratto nessun minuto, perchè siamo già nella fase di inattività.

Data primo movimento del mouse = è la data del primo movimento del mouse che viene calcolata nei seguenti casi:

- all'arrivo dell'utente nella pagina
- quando l'utente torna a muovere il mouse dopo un periodo di inattività

Data ultimo segnale = ci serve a determinare se l'utente è ancora presente nella pagina..questo ci serve per evitare di assgnare una permanenza troppo lung agli utenti che escono da una pagina e poi rientrano mezz'ora dopo (in questo modo la mezz'ora d'assenza non verrà calcolata)



-------------------------------



Scusate se sono poco chiaro..ho il difetto di essere incomprensibile e ho poco tempo per correggere. Il testo sopra serve per farvi capire cosa ho in testa e affinché voi possiate consigliarmi soluzioni migliori.

Se il database vi sembra troppo grande e lo script troppo incasinato è perché diversamente rischieremo di fraintendere dei dati.
Infatti dobbiamo riflettere anche sui problemi che incontreremo e trovare soluzioni, per interpretare al meglio i dati che ci verranno forniti.

[Dell'Orto Fabio]

Bravo Kerouac [non mi ero sbagliato... ]

[fradefra]

News? Prosegue il progetto?

[rocco_bruno]

Ho letto tutto ma a che punto è ora la cosa?
Credo che sia uno studio molto interessante, anche perchè pensavo, prima o poi, di fare un sito-esperimento (pensato epr la ricerca biologica e non per il posizionamento) che si occupasse di variabili comportamentali.
Non so se faccio un'osservazione sensata (e fattibile) pechè non sono esperto di programmazione, però penso che potrebbe essere utile trattare i dati direttamente in senso vettoriale... siccome i movimenti del mouse tendono ad essere effettuati per linee rette , seguiti da periodi di relativa stasi, si potrebbero trattare analogamente alle saccadi oculari. Per le saccadi in genere si calcolano i momenti di accelerazione/decelerazione per individuare gli "stop'n'go" dell'occhio. In questo caso forse sarebbe più utile aggiungere una funzione che quando vede che x-y si ripetono uguali per tot volte (è uno stop) allora memorizza le coordinate x-y precedenti e quelle successive, in modo da poter cotruire dei vettori da un punto di stop ad un altro e saltare tutti gli intermedi.

Ora non ho tempo per dedicarmici ma mi piacerebbe molto. fatemi sapere che ne pensate.

[kerouac3001]

rocco_bruno

Ho letto tutto ma a che punto è ora la cosa?
Credo che sia uno studio molto interessante, anche perchè pensavo, prima o poi, di fare un sito-esperimento (pensato epr la ricerca biologica e non per il posizionamento) che si occupasse di variabili comportamentali.
Non so se faccio un'osservazione sensata (e fattibile) pechè non sono esperto di programmazione, però penso che potrebbe essere utile trattare i dati direttamente in senso vettoriale... siccome i movimenti del mouse tendono ad essere effettuati per linee rette , seguiti da periodi di relativa stasi, si potrebbero trattare analogamente alle saccadi oculari. Per le saccadi in genere si calcolano i momenti di accelerazione/decelerazione per individuare gli "stop'n'go" dell'occhio. In questo caso forse sarebbe più utile aggiungere una funzione che quando vede che x-y si ripetono uguali per tot volte (è uno stop) allora memorizza le coordinate x-y precedenti e quelle successive, in modo da poter cotruire dei vettori da un punto di stop ad un altro e saltare tutti gli intermedi.

Ora non ho tempo per dedicarmici ma mi piacerebbe molto. fatemi sapere che ne pensate.

Interessantissimo, ma non so se conviene.
Attualmente lo script che ho rifatto (20 giorni fa) permette di monitorare tutti i tags DIV e A di una qualunque pagina web con solo 2 righe di codice. In sostanza nel db non salvo tutte le posizioni del mouse ma solo il tempo in cui è restato in un determinto div. In più salvo tutti i dati che potrebbero interessare un SEM e/o un SEO e/o un webmaster

Ma non ho creato uno script di analisi dei dati. Vi aggiornerò quando avrò uno script semi-definitivo

[rocco_bruno]

kerouac3001

Interessantissimo, ma non so se conviene.
Attualmente lo script che ho rifatto (20 giorni fa) permette di monitorare tutti i tags DIV e A di una qualunque pagina web con solo 2 righe di codice. In sostanza nel db non salvo tutte le posizioni del mouse ma solo il tempo in cui è restato in un determinto div. In più salvo tutti i dati che potrebbero interessare un SEM e/o un SEO e/o un webmaster

Ma non ho creato uno script di analisi dei dati. Vi aggiornerò quando avrò uno script semi-definitivo

Certo, se hai già effettuato una riduzione dei dati e scelto dei parametri utili sufficienti all'analisi SEO, non vale la pena andarsi ad impelagare in altro. Penso che il discorso sui vettori possa interessare per prendere la cosa più alla lontana e per uno studio più in generale sul comportamento.
A presto, spero!

[K_D]

Progetto molto interessante, complimenti. L'unico dubbio che mi e' venuto leggendo quanto state sviluppando e' se il mouse si muova veramente seguendo l'occhio dell'utente. Ho fatto un paio di prove pratiche e ho notato che io non muovo il mouse in base a dove il mio occhio cade ma secondo altre logiche, a volte per spostare il mouse da una zona in cui sto leggendo, altre per fare dei "giri" per lo schermo che non sono direttamente collegati con i punti della pagina di massima attenzione, altri per scrollare la pagina mentre leggo, ecc ecc

Non sono riuscito a trovare online informazioni precise sulla correlazione movimento mouse/attenzione utente. Avete qualche riferimento in merito?

[FuSioNmAn]

A sto punto non ti conviene usare la tecnologia Ajax?
E' comunque un bel progetto ed una bella idea.
L'unico dubbio mi viene sull'appesantimento della pagina e del server.
In pratica fai una valanga di richieste (e conseguenti connessioni a db) lato server...

[GrazieMamma]

lukas

Praticamente mettono delle piccole telecamere vicino agli occhi e poi ti mettono davanti ad un monitor.

A mio avviso è l'unico sistema valido, trovo il test di kerouac3001 interessante ma come detto in passato credo non funzioni, o almeno in parte.

Ho fatto anche io dei test di questo tipo, ed ho utilizzato delle telecamere. Credetemi non più del 50 % delle persone utilizzano la freccetta del mouse per tenere il segno, c'è chi la abbandona a se stessa in basso a dx, chi in alto a sx, c'è perfino chi segue la lettura con il dito o con una penna.

Poi ci sono alcuni come Giorgio che evidenziano cio che leggono, altri che una volta aperta la pagina abbandonano il mouse (io ad esempio)...

Credimi, il test è interessante ma allo stesso tempo ha un valore statistico con margine di errore approssimativo del 35%

Spero il mio intervento sia di aiuto per migliorare.

[kerouac3001]

Rispondo in fretta visto che vi ostinate a riportare online i miei posts di un anno fa (1 anno e 1 giorno)

Si ho usato Ajax (senza xml), ma il principio è lo stesso

GrazieMamma te hai ragione (P.S. una pizza qualche volta ce la possiamo andare a prendere eh?)..non capisco nulla di pricologia dell'utonto, più che altro mi sono occupato di realizzare un'applicazione basandomi su una vecchia discussione fatta su gt. Siceramente non ho mai analizzato i dati raccolti dall'applicazione perché non saprei come interpretarli

[Icelord]

L'unico modo per metter giù i dati in un formato leggibile è utilizzare le heatmap, come il sito Crazyegg

Loro utilizzano flash per l'output.

Cmq fare un'analisi di questo tipo ha senso prendendo una o due settimane al massimo di attività del sito.
Altrimenti si raccolgono un sacco di dati e poi non si ha la possibilità di leggerli tutti.

Inoltre sarebbe utile fare questo tipo di studio anche analizzando l'attività finale dell'utente, vedere su quali link clicca. E' quello che poi fa Crazyegg di cui sopra.
In questo modo si possono sperimentare più versioni della pagina e vedere quale è la più efficace a seconda dei propri scopi.

[emanueledg]

Lo studio dei movimenti degli occhi in relazione agli stimoli luminosi è molto importante per l'analisi della percezione, molte branche della scienza se ne occupano da molti anni (oculistica, neurologia, psichiatria, psicologia cognitiva solo per citare alcune macrocategorie).
Benché ci si trovi ancora all'inizio, i risultati sono stati finora rilevanti.
Dal punto di vista commerciale, i l'editoria grafica (in primis quella cartacea) si è prontamente avvalsa delle teorie elaborate inmerito dalla psicologia cognitiva.

I movimenti dell'asse oculare da una zona ad un'altra zona del campo visivo si chiamano saccadi.

Quando fissiamo qualcosa, tuttavia, il nostro sguardo non resta perfettamente immobile. Ci sono piccolissimi movimenti (il cui angolo è dell'ordine di centesimi di grado) che l'asse continua a seguire nell'intorno del punto interessato. Questi movimenti si chiamano microsaccadi.
La rilevazione dei percorsi oculomotori, che esiste ormai da tempo, permette la tracciatura delle "mappe delle risposte saccadiche".

Da qui si parte per lo studio sulle percezioni, velocità di acquisizione delle informazioni, latenza della risposta agli stimoli luminosi/visivi, sulla priorità dell'attenzione, sull'influenza dell'illusione percettiva e su moltissimi altri fenomeni dai risultati prolifici. Esistono anche degli studi sulla diagnosi neurologica dall'analisi delle saccadi.

Le telecamere sono un sistema ormai datato, attualmente la oculometria a infrarossi utilizza delle onde elettromagnetiche (raggi infrarossi appunto), che fanno parte dello spettro non visibile, e soprattutto è una tecnologia applicabile anche negli studi al buio su stimoli visivi di luminanza ridotta.

Questa premessa soltanto per dire che l'idea di applicare questi studi anche al web non è male.

Circa il movimento del mouse e le sue relazioni con le zone di attenzione visiva non ho letto ancora molto, ma di sicuro si otterranno dei risultati interessanti. Di certo ci sono variabili la cui lettura è suscettibile di interpretazioni: per esempio a me piace leggere pagine ricche di testo (ben organizzato) lasciando completamente il contatto con il mouse.
Altre volte invece seleziono distrattamente zone della pagina muovendo il mouse a caso. Altre persone ancora lo faranno roteare nervosamente anche al di fuori delle aree di attenzione, vista breve la permanenza (ormai dell'ordine dei secondi) sulle pagine web e l'aumento del numero medio di pagine visitate per ogni sessione.
In linea di massima credo però che si possano trovare dei criteri di lettura di queste informazioni.