miércoles, mayo 26, 2010

ElCorteInglés > Atrapa El 5 > Adobe CS5

Hace un par de semanas lanzamos una promo para ElCorteInglés, Atrapa el 5, básicamente era un momento ganador que se repetía cinco veces al día, y durante esos cinco minutos se podían encontrar productos más baratos (a 5€uros) en la web de ElCorteInglés.


Además de la promo había otros artículos a precio reducido, productos 5 estrellas. En total estamos hablando de un proyecto que incluía dos micros (atrapa el 5 y productos 5 estrellas) y un plan de medios.

También hubo una parte de redes sociales, apoyando la campaña, tened cuidado si hacéis algo así porque la gente en cuanto das algo más barato ya se piensa cualquier cosa.


Aquí abajo está el richMedia que iba en la home de ElCorteInglés, una pieza realizada en colaboración con AdvancedMedia, que por cierto, no tienen ni de lejos la tecnología y el buen saber hacer de Eyewonder o Eyeblaster.

A nivel técnico decidimos hacerlo en FlashCS5 + AS3 + PHP. Y aquí viene lo bueno, el Code Snippets Panel. Para hacer una cuenta atrás pinchas y ¡magia!


El editor también ha mejorado ostensiblemente


Problemas que tuvimos para esta campaña:

- El primer problema fue que el departamento de diseño realizó su propia tipografía para los números de la cuenta atrás. Aún estoy por saber cómo hacer una tipo y luego meterla en Flash, de todas formas la hicieron utilizando Photoshop y los deadlines fueron tan agresivos como siempre. Lo solucionamos con el simple gotoAndStop() y en cada frame un número de la cuenta atrás como imagen.

- Sobrecarga del servidor: Evidentemente el número de peticiones al servidor de ElCorteInglés fue inusitado y eso que ampliamos su capacidad al doble. Una vez que empezaban los momentos ganadores la página no respondía. Desde la parte Front nos planteamos la siguiente casuística: Puede ser que un usuario entre en la página cuando ya ha empezado la cuenta atrás, puede ser también que un usuario tenga la página abierta todo el día para así intentar ganar en los momentos ganadores (el reloj avisaba con un pitido), puede ser que un usuario entre de vez en cuando.

Aquí la gran pregunta fue: ¿Cuándo hacer la petición al servidor? Vía php lo que hicimos fue consultar al servidor cuánto tiempo faltaba para el final de la próxima cuenta atrás en segundos. ¿Pero cuándo? Bueno, la primera vez nada más entrar el usuario en la web por supuesto. El problema era que si terminaba una cuenta atrás y volvíamos a hacer una petición de todos los usuarios a la vez podía haber un colapso. Así que la petición siguiente a cualquiera de las cuentas atrás se realizaba de forma aleatoria en un tiempo entre el primer minuto y la primera media hora siguiente al final de la cuenta atrás.

- Tercer problema: Redes sociales y su alcance. No soy un especialista pero las utilizo por encima de la media. Y sí, en cuanto das algo gratis o pones ofertas, los usuarios se te pueden echar encima, sobre todo si falla algún mecanismo relacionado con la promo. En este caso fue que la web de ElCorteInglés "iba más lenta". Bastante lógico por otra parte. O se quedaba enganchada en el proceso de compra, pero sobre eso ya no teníamos control.

El resto funcionó todo bastante bien. Me queda todavía alguna laguna pendiente. Por ejemplo en algunos casos en los que el usuario tenía la página de la cuenta atrás abierta todo el día el .swf se quedaba "planchado" y no funcionaba. Sólo en algunos casos, no sé si puede tener algo que ver con la caché o si el navegador cuando abandonas una pestaña "paraliza" lo que se está ejecutando.

Otro tema que nos llamó la atención fue la descoordinación de los relojes o cuenta atrás. Esto dependía mucho también de las características de cada equipo del usuario: Banda ancha, RAM, procesador, etc. Como mucho había unos 20 segundos de descoordinación entre una y otra cuenta atrás.

Por último, utilice Flash CS5 para el proyecto y quedé encantado, sobre todo con el Code Snippets Panel (haces una cuenta atrás en un segundo) y con la mejora de rapidez de uso del programa, sobre todo en comparación a CS4. Yo la verdad voy a saltar directamente de CS3 a CS5 y creo que la mayoría de diseñadores, animadores y programadores estarán de acuerdo conmigo (CS4==despropósito).



No hay comentarios:

Disqus for Actionscript & Comet