Analítica web
Reflexiones desde el mercado español de Analítica Web

Integración de SessionCam con Google Optimize

Se lee en 4 minutos

Una sencilla integración de SessionCam con Google Optimize nos permite conceptualizar en más detalle nuestros experimentos. Si podemos analizar el comportamiento de los usuarios en cada una de las alternativas que tenemos definidas para nuestros tests, pudiendo diferenciar las grabaciones entre las mismas, detectaremos fácilmente las flaquezas de nuestra web y podremos elaborar las medidas oportunas para optimizarlo.

Requisitos previos

Para poder poder realizar la integración es indispensable tener correctamente configuradas nuestras cuentas de Google Analytics, SessionCam y Google Optimize además de tener un test implementado con el que podremos enlazar su identificador con SessionCam.

Para la parte de Google Optimize que puede resultar más compleja y técnica que una mera creacción de cuenta y configuración de parámetros estándar, recomiendo encarecidamente que le echéis un ojo al post “Primeros pasos con Google Optimize” de mi compañero Borja Pérez.

Del mismo modo, ojearía el post “SessionCam: llevando su funcionalidad un paso más allá” por parte de Iván Rey. Explica cosas interesantes de la configuración de la herramienta y su integración con Google Analytics que, sin duda alguna, forma parte de los requisitos.

Integración de la herramienta

El código que se muestra a continuación, actuará como una “caja negra” que hará toda la magia. No será necesario que lo modifiquéis, de eso ya nos hemos encargado nosotros.

try {

    function getCookieValue(cookieName) {
        var result = document.cookie
            .match('(^|;)\\s*' + cookieName + '\\s*=\\s*([^;]+)');
        return result ? result.pop() : ‘’;
    }

    function getExperimentId() {
        var cookie = getCookieValue('_gaexp');
        if (cookie == undefined) {
            return undefined;
        } else {
            var fields = cookie.split('.');
            return fields[2];
        }
    }

    function getVariationId() {
        var cookie = getCookieValue('_gaexp');
        if (cookie == undefined) {
            return undefined;
        } else {
                var fields = cookie.split('.');
                return fields[4];
        }
    }

    var experimentId = getExperimentId();
    var variationId = getVariationId();

    if(!window.sessioncamConfiguration)
        window.sessioncamConfiguration = new Object();

    if(!window.sessioncamConfiguration.customDataObjects)	
        window.sessioncamConfiguration.customDataObjects = [];

    var item = { key: "GoogleOptimize", value: experimentId + '-' +  variationId};
    window.sessioncamConfiguration.customDataObjects.push(item);

} catch (e) {}

Quien tenga unas bases de conocimientos de programación, rápidamente se dará cuenta de que es un proceso muy sencillo que consiste en obtener los datos del test y sus variantes a través de una cookie que genera Google Optimize “_gaexp”.

De éste modo, recuperamos el identificador del experimento de Google Optimize y el número de variante de forma dinámica. Debemos recordar que este mecanismo es necesario debido a que Google Optimize no permite modificar la versión original de sus tests y, por tanto, no podemos lanzar de forma manual estos datos a través del código inyectado en las alternativas.

Una vez tenemos dichos valores, se comprueba que existe el objeto de SessionCam. Si no existe, se generará y, en ambos casos, se rellenará con los valores que hemos extraído de la cookie de Optimize. Con esos datos podremos filtrar en la consola de SessionCam para visualizar las grabaciones correspondientes a un determinado test o alternativa del mismo como explicaremos en el último apartado.

La pieza de código deberá estar incluida en todas las páginas que formen parte del test que tenemos implementado. Se añadirá inmediatamente después del código correspondiente de SessionCam. Como siempre, recomendamos el empleo de un Tag manager como Ensighteen o Teallium lo que facilitará la integración en un solo fichero a modificar en lugar de tener que realizar cambios en cada página.

¿Cómo puedo saber si funciona?

Una vez incluida la pieza de código, conviene verificar que su funcionamiento sea correcto. Para ello, debemos acceder a la consola de desarrolladores de nuestro navegador (pulsando la tecla F12 o bien >botón derecho del ratón>inspeccionar) en cualquiera de las páginas en las que lo tenemos implementado y comprobar que esos valores se están guardando en el objeto SessionCamConfiguration que hemos definido.

integración sessioncam con Google Optimize

Dentro del objeto localizaremos la key “GoogleOptimize” con los valores extraídos de la cookie tal y como lo hemos configurado con el formato experimentId-variationId:

  • experimentId-0
  • experimentId-1
  • experimentId-2
  • experimentId-N

El id de variante (variationId) va desde 0, para la versión original hasta N para cada una de las alternativas definidas. Mientras que el experimentId será un código alfanumérico generado automáticamente por Google Analytics.

¿Cómo visualizo las grabaciones?

Una vez lo tenemos correctamente configurado y publicado, podrían pasar unas horas hasta que aparezcan los primeros datos. Para visualizarlos podemos acceder a la consola de SessionCam en la sección de grabaciones (Recordings), ver todo (View All).

Consola SessionCam

Podemos seleccionar un rango de fechas concreto para recuperar las grabaciones. Hay que tener en cuenta que si se trata de grabaciones antiguas, la herramienta dedicará unos minutos en recuperar datos del histórico. Una vez se tengan los datos recuperados se podrá aplicar el rango.

SessionCam rango de fechas

Cuando ya tengamos la lista de grabaciones correspondientes al rango de fechas definido, podremos añadir filtros para visualizar un determinado test o una determinada alternativa del mismo con el siguiente formato:

  • Filtro 1: “Page visited” is “Dominio” “Ruta”
  • Filtro 2: “Field Value” for “Dominio” “Google Optimize” “like” “ExperimentId-VariationId”

SessionCam filtro alternativas test

El primer filtro es necesario para las grabaciones específicas de la URL concreta ya que un mismo test puede ser aplicado a varias URLs.

Si filtramos únicamente por “like” “ExperimentId” obtendremos todas las variantes del test mientras que al añadir “-variationId” podremos ver una variante específica, como comentaba anteriormente partiendo de 0 para la original hasta N variantes.

El id del test (experimentId) podemos encontrarlo en el reporte que genera Google optimice con los test (incluso sin necesidad de que el test haya finalizado).

Google Optimize experimentId

Ahora podremos ver en qué puntos mejoran las alternativas que diseñamos para nuestros experimentos y dónde podrían fallar, así como detectar comportamientos imprevistos por parte de los usuarios abstrayéndose de una perspectiva mas propia del desarrollador. Mediante un análisis concienzudo obtendremos resultados muy positivos logrando una optimización más avanzada y eficaz.

*Fuente de las imágenes: unsplash.com (principal) y navegador Google Chrome, SessionCam y Google Optimize (cuerpo de texto)

Escribe tu comentario

Nueve + 11 =

Navegar