tentándote.com

Estos días me ha tocado mirar un poco los portales de empleo para un rediseño que estaba haciendo, su modelo de interacción, sus microinteracciones y como resolvían determinadas cosas como la forma de registrarse y de obtener una contraseña, el proceso de recordatorio de la misma en caso de olvido, el  de logado, etc.

Y para ello, la World Wide Web es la mejor escuela para aprender si eres Diseñador de Interacción:

Navega, navega y navega. Y sobre todo navega con ojo crítico.

Es lo más importante y lo mejor que puedes hacer para aprender modelos de interacción y aplicarlos en tu trabajo cotidiano. Es difícil encontrar sitios con patrones de interacción novedosos y buenos pero es estimulante cuando encuentras alguno que merece la pena.

Viendo algunos de los portales de empleo en España me da la impresión de que no han evolucionado gran cosa en los últimos años. El diseño y las tecnologías de las que disponemos actualmente han avanzado mucho y va siendo hora de que hagan un rediseño profundo de sus interfaces y modelos de interacción. Con el actual contexto económico, si no está ya en camino no debería tardar mucho en llegar, pero tan sólo es una impresión.

Uno de los que he visto, que la verdad, desde la última vez que lo utilicé hace hace ya algunos años a ahora, ha cambiado mucho y para bien, es Monster.es.

En concreto el otro día me estaba fijando en el uso que hacen de los colores.

Ésta es una captura de parte de la pantalla del perfil de un candidato:

Por deformación profesional como Diseñador de Información tiendo a ser bastante Tufteano. Me gustan determinadas escuelas y determinados maestros. Y en la medida de lo posible tiendo más a borrar tinta que a utilizarla en exceso en los prototipos, aunque reconozco que todo ha de ser en su justa medida.

A veces es pertinente, útil, conveniente y necesario añadir tinta y, más concrectamente, elementos que actúen como agrupadores de contenidos.

En cuanto a ello, en Monster.es me gusta mucho el uso que hacen del color para modularizar los componentes de la página y particularmente, en el ejemplo de la captura, los correspondientes al del nombre del candidato y los de “Hechos destacados de tu carrera profesional”, “Habilidades”, “Afiliaciones profesionales”, “Méritos y premios” y el resto que están por debajo y que no aparecen aquí.

Tengo pendiente escribir un post en el que hable un poco más en profundidad sobre el color y los colores y de su importancia en cuanto a lo que a la usabilidad de las interfaces se refiere.

El tema es auténticamente fascinante y lejos de lo que pueda parecer, de todo menos fácil y baladí.

La verdad, por muchísimas razones es muy muy díficil hacer verdaderamente un uso 100% correcto de los colores. Incluso me planteo sí, desde un punto de vista del Diseño Emocional verdaderamente hay que ser un “talibán” en cuanto a la hora de aplicar dichas convenciones dado que, antes del nivel del procesamiento reflexivo (o racional) tenemos otros dos previos: el visceral, el más rápido a partir de las percepciones obtenidas por nuestros sentidos del entorno y los objetos con los que interactuamos, y el conductual que constituye el nivel intermedio entre el reflexivo y el visceral, y que es aquel en el que llevamos a cabo casi todo nuestro comportamiento.

Ambos también intervienen en el proceso de percepción y lo condicionan desde un punto de vista emocional por lo que las recomendaciones sobre uso del color pueden decir una cosa, pero el estómago puede decir otra.

Con independencia de esta reflexión, tener un mínimo de conocimiento sobre la teoría del color y la percepción visual humana es fundamental y hay un buen número de guías que se podrían aplicar para mejorar la usabilidad de las interfaces.

Centrándonos en Monster.es y en la citada página de “Mi Perfil” de un candidato, fijaros en el uso que hacen de los colores:

He conservado el tamaño original de la imagen porque se aprecia mucho mejor que reduciéndola y quería que se viera bien aunque desborde el tamaño de la maquetación del cuerpo central del blog.

Fijaros en los efectos que se consiguen con el tratamiento de los colores que ha hecho el diseñador de Monster.es.

• El gran módulo central parece flotar al estar rodeado de blanco. En la página completa de “Mi Perfil” en el portal, a la derecha límita con un módulo vertical de “Consejos rápidos” que en esta captura no aparece. A su vez, a la derecha de éste sólo hay espacio blanco hasta el ascensor del navegador y el borde de la pantalla. A la izquierda de este gran módulo central, igualmente, sólo hay espacio en blanco hasta el mismo borde de la pantalla.
• Los colores claros parecen acercarse, los oscuros alejarse. O dicho más correctamente. Los colores claros se perciben como más expansivos y crecen mientras que los oscuros parece que se contraen y provocan un efecto de inmersión. La pregunta buena y que muy poca gente de todo lo que he leído se hace es ¿por qué? Una posible respuesta en base a lo que entiendo (ya que no soy ni físico ni psicólogo) quizá llegue en ese post sobre los colores.
• Quedémonos con una idea:

Los colores nos permiten establecer capas de información.

Lo dice Tufte en su extraordinario “Envisioning Information”, lo explica bastante más científicamente Colin Ware en su obra “Information Visualization” y se infiere de un cuadro apasionante que se pinta leyendo acerca de la teoría del color.

En la captura de arriba podemos distinguir las siguientes capas de información:

• El color blanco del fondo y de los módulos de “Francisco Tosete Herranz” y del de “Hechos destacados de tu carrera profesional” conforma la capa de información que se percibe como más próxima o cercana.
• Las cabeceras verdes de ambos módulos constituyen otra capa de información que se sitúa ligeramente más atrás que la capa blanca. El hecho de que las cabeceras estén unidas al área blanca inferior mediante un borde de un píxel de grosor de color gris, y a la consistencia en el código de color de los módulos (mismos elementos constitutivos con los mismos códigos de color) hacen que los relacionemos semánticamente y que como tal, insconcientemente los percibamos.
• Los rótulos de color naranja se perciben a su vez como más cercanos que el verde del fondo de las cabeceras.
• El color negro del texto constituye la capa más lejana de información. Su uso contra el blanco (máximo contraste) hace que aparezca como si el texto estuviera troquelado en una hoja de papel y detrás viéramos una capa negra.
• El color morado que se utiliza de forma consistente para identificar los enlaces hipertextuales con excepción del rótulo del pequeño módulo de arriba a la derecha “Datos de contacto” conforma otra capa de información más lejana que la del fondo azul de todo el módulo central.
• En las pestañas se produce un curioso efecto psicológico:

• Literalmente se perciben como si fueran el bolsillo de un pantalón por la sombra que tiene detrás la pestaña activa y la línea que sirve de base para las inactivas. Esta sombra crea un fuerte efecto de oclusión en la primera pestaña haciendo que aparezca como más cercana respecto a las demás. Este efecto se refuerza por el color de relleno de azul más oscuro de las pestañas inactivas que hace que se perciban como situadas en un plano inferior. Es como si tuviéramos una hoja de papel metida en ese bolsilo, que sobresaliese ligeramente y en la que estuvieran pintadas las pestañas inactivas.
• Hay otro efecto curioso que realza la usabilidad de las pestañas. Mientras que el color de la pestaña activa es plano y no invita a hacer clic sobre ella, el degradado en las pestañas inactivas, más claro en la mitad superior y más oscuro en la mitad inferior hace que se perciban como botones ofreciendo una affordance o pista visual que nos invita a interactuar sobre las mismas. Por último, la sensación de “bolsillo del pantalón” se refuerza por el hecho de que la línea horizontal en torno a la que se alinean las pestañas no llega hasta los mismos bordes exteriores del componente marcando una separación de zonas. En su lugar dejan un espacio desde su inicio hasta su margen conectando las zonas de encima y de debajo de la línea, y permitiendo que el flujo visual fluya por todo el componente (mirar la captura superior para apreciarlo mejor). De esta forma, el color azul homogéneo de fondo y la ausencia de líneas de separación entre módulos funciona como agrupador de todos los componentes interiores.
• El efecto de aplicar una sombra detrás para crear el efecto de oclusión se utiliza de manera recursiva en otros componentes como el de “Datos de contacto”, el de logado de color negro: “Hola Francisco”, o el de “Consejos rápidos”:

• Eso sí, dicha sombra no se aplica de manera homogénea en ellos. En el de “Datos de contacto” aparece a ambos lados del mismo, la fuente de luz es cenital desde la parte inferior. En los módulos de “Hola Francisco” y el de “Consejos rápidos” la fuente de luz es cenital desde la parte superior lo que provoca que la sombra se vea en la parte inferior y ofrezca ese efecto cómo si estuviéramos tirando del componente hacia nosotros abombándolo. Por último, en el pequeño botón de ayuda de color azul de la cabecera del módulo inferior debajo de las pestañas, la sombra se proyecta sobre el lado inferior derecho del botón lo que implica que la fuente de luz se encuentra en la superior izquierda.

Como conclusión, lo dicho un poco más arriba: es muy muy difícil hacer un uso verdaderamente correcto de los colores aunque se deba tender a ello. El diseño gráfico es un aspecto fundamental y crítico que impacta en la usabilidad de las interfaces y es conveniente tener un mínimo conocimiento de la teoría del color. También es fundamental que pueda existir una comunicación fluida entre diseñadores de interacción y diseñadores gráficos.

En cuanto al uso de capas de información en los prototipos apuntar algo interesante:

Para crearlas y comunicarlas de manera efectiva a los diseñadores gráficos lo mejor es utilizar escalas monocromáticas (preferiblemente grises aunque también se puede utilizar cualquier otro color) y jugar con la luminancia -brillo-  estableciendo buenos contrastes entre la capa de información de fondo y la de primer plano, o entre las de los diferentes planos entre sí.

Por ejemplo, en los siguientes prototipos:

• El usuario hace clic (a) sobre el enlace de editar para corregir alguno de sus datos personales.
• Como resultado se entra en el modo de edición (b) y los campos se vuelven editables. El usuario tiene un triple feedback de que está editando por 3 outputs:
  • al lado del rótulo de cabecera “Registrarse en ACME Aerospace” el enlace de editar desaparece y cambia al rótulo “editando datos”,
  • los textos aparecen dentro de campos inputs lo que ya de por sí es un indicio suficientemente significativo de que se ha cambiado de modo no editable a editable y,
  • alineamos el enlace de “cancelar” y el botón de “Guardar cambios” a mano derecha, en línea con el borde derecho del último campo del formulario lo que es indicio suficiente para que, gracias a las Leyes de la Gestalt, percibamos que actúan sobre todo ese grupo de campos haciendo predecible saber qué sucederá al pulsar sobre el botón de guardar.
• Este sería un ejemplo de uso de mínimo de tinta bastante tufteano. Posibles variaciones implican, por ejemplo, que agreguemos una línea horizontal por encima del enlace de “Cancelar” y el botón de “Guardar cambios” de la misma longitud que el cuerpo de campos para reforzar que ambos elementos actúan sobre todo el grupo (c). Aunque no se aprecia en la imagen porque ha sido reducida, la línea no es sólida sino de puntos, lo que indica permeabilidad. Al permitir fluir la vista entre los puntos conecta de manera elegante lo situado por encima y debajo de la misma.
• Si deseamos hacer más explícita la agrupación de campos y el hecho de que el enlace de “cancelar” y el botón de “guardar cambios” actúan sobre todos los campos del componente podemos utilizar otro tipo de agrupador: un borde gris que los encierre a todos bajo los cuáles situemos el citado enlace y botón (d). Lo interesante es que aquí ya estamos estableciendo capas de información aunque en este caso tengan el mismo peso al tener igual color de fondo.
• Si queremos establecer una jerarquía de información más explícita y marcada entre ambas capas podemos aplicar a la del grupo de campos que se están editando un color de fondo gris más oscuro. Esto hace que todo el grupo aparezca como “hundido” y en un segundo plano respecto al primero, que es el de color blanco. Logramos así realzar el hecho que nos encontramos en otro modo distinto al de visualización inicial de los datos, el de edición, y conseguimos además acentuar la sensación de inmersión en los campos centrando mejor la atención (e).
• Por último, si añadimos un borde de color gris ligeramente más oscuro que el del fondo interior (f)  realzamos toda la forma respecto a la capa de información blanca envolvente. La pregunta que cabe hacerse otra vez es ¿por qué? y la respuesta, de nuevo, posiblemente llegue en ese post sobre los colores.

El uso de los colores es un componente fundamental de la usabilidad de las interfaces y no puede ni deber ser obviado. Hay que actuar sobre ellos.

En el caso de los prototipos, a la hora de establecer capas de información lo mejor es utilizar una escala de color monocromática, preferiblemente grises, ya que son los más adecuados para, desde un punto de vista del sistema visual humano, poder juzgar las diferencias en las variaciones de color que indican la jerarquía y la importancia de las distintas capas.

Fijaros en los siguientes ejemplos como se distinguen perfectamente las capas de información y su profundidad. La disonancia cognitiva que se introduce cuando el color más oscuro es el primero de la “escalera” de colores y el más claro el último, la sensación de movimiento hacia arriba o abajo en la escalera en función de donde esté situado el color más claro y el más oscuro (o la que se produciría de avanzar y retroceder si la escalera estuviera situada horizontalmente) y cómo cuando se introducen un borde de 1 pixel negro cuesta más apreciar la jerarquía de información correctamente aunque tiene el efecto de potenciar el color de relleno interno de cada cuadrado.

Todos estos efectos y muchos más son los que cotidiana e inconscientemente percibimos una y otra vez cuando nos encontramos delante de una interfaz. Es buena cosa saber algo de ello y de cómo funcionan los colores de cara a mejorar su usabilidad y de crear determinadas sensaciones, estados psicológicos o efectos (como por ejemplo, el citado estatismo o movimiento de la página).

Desde un punto de vista documental Twitter, es un caso francamente digno de estudio.

La World Wide Web es un canal que introduce unos factores característicos importantes en torno a los ejes tradicionales de la cadena documental -creación, descripción, compartición, difusión y recuperación de la información-, que no se dan mediando documentos físicos de papel, y que son:

• La posibilidad del acceso o información sincrónica o simultánea, tanto por parte del productor del ítem informativo como del usuario del mismo, en el momento en que se crea, describe, comparte…
• Inmediatez en la producción, descripción, difusión y/o redifusión del ítem.
• Socialización (creación colaborativa, descripción colaborativa, compartición colaborativa…)

En cuanto al diseño de la interfaz, estructura y funcionalidad de la aplicación se refiere, Twitter es, extremadamente simple y minimalista.

No obstante, lo más llamativo de Twitter no es su diseño minimalista ni su interfaz, sino los flujos de información que se dan dentro del servicio de microbloging que, en cuanto a la generación de contenidos y su tratamiento dinámico por parte de los usuarios ofrece una versatilidad para la descripción, categorización, comunicación y difusión, extremadamente potente, rica y compleja. Es un ecosistema extraordinario desde un punto de vista semántico y social en el que se da lo que podríamos denominar una (micro)Arquitectura de Información Social dinámica.

La naturaleza de Twitter está basada en el diseño para microtiempos. O lo que es lo mismo, responde de manera efectiva a una necesidad inmediata y puntual de comunicar algo en una reducidísima cantidad de tiempo pudiendo ser usado de manera ubicua desde cualquier lugar en el que se encuentre el usuario donde exista conexión a la Web, gracias a la tremenda mutabilidad y adaptabilidad de su interfaz y a su API.

Pero además, Twitter tiene un componente clave, explícito en su naturaleza, que no tienen otros medios de comunicación de masas: el componente social, interactivo y bidireccional que se da entre sus usuarios.

Estos, a través de los hashtags, son los que se encargan de autogenerar en tiempo real y de manera sostenida (o no) en el tiempo esas estructuras dinámicas de información social (¿taxonomías?)  (1).

“Los Hashtags son convenciones impulsadas por la comunidad para añadir metadatos y un contexto adicional a sus tweets. Son iguales que las tags de Flickr sólo que agregadas en línea a sus post”.

“Hashtags are a community-driven convention for adding additional context and metadata to your tweets. They’re like tags on Flickr, only added inline to your post” (2)

Un hasthtag no es ni más ni menos que una palabra, abreviatura, sigla, acrónimo o conjunto de palabras unidas precedidas de una almohadilla, por ejemplo #manifiesto, que actúa como una pequeña marca para que posteriormente pueda ser distinguido del resto del mensaje o tweet. Un Tweet se compone de un mensaje de texto de 140 caracteres.

A través de los hashtags, los usuarios de Twitter autoclasifican, describen, organizan y reorganizan los contenidos. Además, gracias a la estructura y a la forma en que está diseñado el servicio, al ecosistema tecnológico y a la naturaleza semántica de la World Wide Web, estos son distribuidos automática y sincrónicamente entre los usuarios de las microrredes sociales que se dan dentro del propio Twitter y que pueden ser:

• explícitas, establecidas de manera persistente por asociación de los propios individuos: personas que le siguen a uno, y personas a las que uno sigue, o de listas o grupos que el usuario puede crear,
• e implícitas, que se establecen de manera puntual y dinámica mediante la ejecución de una búsqueda hecha por el usuario en un momento dado a través de un hashtag. La particularidad, tremenda potencia y utilidad de Twitter es que, además, estas búsquedas pueden ser salvadas y consultadas nuevamente con posterioridad, con extremada facilidad, creando o dando lugar a canales de información vivos y dinámicos.

Por último, los contenidos no sólo son accesibles y recuperables a través del propio Twitter sino que son redistribuidos por terceros servicios mediante sindicación e indexados y mostrados en tiempo real en algunos buscadores como Google (3) o Bing (4).

En Documentación se habla de Lenguajes de Clasificación, de taxonomías de contenidos, de descriptores (palabras simples o términos compuestos que describen un ítem informativo asignados por un experto en información -documentalista, bibliotecario, archivero…- de acuerdo a una taxonomía o lenguaje determinado) de palabras clave (cuya diferencia básicamente respecto a los descriptores es que no están sujetas a un control documental y que son o pueden ser asignadas por un usuario que no tiene por qué ser profesional).

En la World Wide Web hablamos de folksonomías por contraposición a los lenguajes de clasificación y a las taxonomías de contenido, y ahora deberíamos comenzar a estudiar y a hablar también de hashtags en contraposición a los descriptores y a las palabras clave.

Quizá no sea una red social al uso como insiste su creador (5), pero en su esencia, como herramienta de comunicación,  a través de las hashtags  y entre sus usuarios, en Twitter  se dan (¿micro?)Arquitecturas de Información Social.

Desde un punto de vista documental Twitter es fascinante.

BIBLIOGRAFÍA

1. Tag (metadata) [en línea] Wikipedia. http://en.wikipedia.org/wiki/Tag_%28metadata%29 [Consulta: 8 ene. 2010]
2. Egersdorfer, Derrick. Hashtags [en línea] Twitter Fan Wiki. http://twitter.pbworks.com/Hashtags [Consulta: 25 ene. 2010]
3. http://www.google.com/#hl=en&tbo=1&num=100&output=search&q=dise%C3%B1o%20interacci%C3%B3n&tbs=mbl:1&ei=27xWS53VOaPSjAfs38ncBA&sa=X&oi=tool&resnum=5&ct=tlink&ved=0CAwQpwU&fp=e8d6ef47431c6a4a
4. http://www.bing.com/twitter/search?q=interaction+design&go=&form=DTPTWI
5. Muñoz, R.; Riveiro A. “Twitter no es una red social sino una herramienta de comunicación”: Entrevista a Jack Dorsey [en línea]. Elpaís.com http://www.elpais.com/articulo/internet/Twitter/red/social/herramienta/comunicacion/elpeputec/20090325elpepunet_2/Tes [Consulta: 8 ene. 2010]

Dos de las mejores cosas que tiene el escribir un blog son el esfuerzo que exige para mantenerte al día si quieres publicar algo mínimamente decente, y los comentarios que hacéis, con los que en ocasiones uno aprende mucho, y más, que lo que ofrece. El otro día a partir de uno de esos comentarios que hizo Sergio Ortega Santamaría fuí a dar con un estupendo post de su blog titulado:

¿El paraguas será la Experiencia de Usuario?

sumamente interesante que ha inspirado dos breves notas Thinkepi. Una, la tenéis un poco más abajo. Le he pedido permiso a Sergio y a Daniel Torres Burriel para reproducir íntegramente su post y comentarios, para publicarlos como una sóla unidad documental en el próximo anuario Thinkepi en papel y en este blog, así como para distribuirlos en la lista de Información y Documentación Iwetel

A ambos, muchas gracias.

La otra, posiblemente vea la luz la semana que viene. Os dejo con el post de Sergio y el Thinkepi:

–0–

¿EL PARAGUAS SERÁ LA EXPERIENCIA DE USUARIO?

SERGIO ORTEGA SANTAMARÍA. Post publicado el 28 dic. 2009

–0–

Recogiendo la metáfora del paraguas de UXnet que describíamos en el Informe APEI, Thomas Memmel reflexiona sobre la integración de roles y disciplinas bajo el concepto Experiencia de Usuario (UX).

Lo curioso es que el autor no duda en augurar para el 2010 la desaparición de la Arquitectura de Información (IA), disciplina que sería absorbida por el Diseño de Interacción (IxD):

“La Arquitectura de Información se ha asociado especialmente con la definición de estructuras de contenido y navegación estáticas. Hoy día, las tecnologías como Silverlight, AJAX y Flash han convertido a la Web en un medio altamente interactivo. Debido a que el diseño de estos sistemas interactivos es conocido con el término de Diseño de Interacción (IxD) ésta absorberá a la AI como disciplina. Naturalmente, esto vendrá acompañado de una necesidad creciente de Arquitectos de Información que extiendan sus capacidades de diseño y su conocimiento más allá de las formas estáticas de representación del contenido”.

“IA was especially associated with an expertise in building content and navigation structures that rather had a static form. Today, technologies like Silverlight, AJAX and Flash turn the web into a highly interactive media. Because the design of interactive systems is headlined with the term interaction design (IxD), it will absorb IA as a discipline. Naturally, this comes with an increasing need for IAs to enhance their knowledge and design capabilities beyond static forms of content representation”.

No estoy tan de acuerdo con estas afirmaciones ya que se está reduciendo en exceso la IA  sin valorar su importancia en otros contextos y entornos de desarrollo.

Por esa y otras muchas razones prefiero pensar en el 2010 como el año en el que descubrimos el verdadero sentido de un enfoque multidisplinar donde puedan surgir nuevas actividades profesionales, nuevos roles y nuevas formas de trabajo que sirvan para aunar esfuerzos. Si la UX nos ayuda a encontrar el nexo de unión, bienvenida sea.

Pero creo que la clave no está en remover la terminología que está en la superficie como en llegar a una mayor y profunda comprensión de cada disciplina y de de la tarea y la responsabilidad que cada uno debemos asumir en el trabajo conjunto.

En ese sentido me parece muy apropiado el Dilema de Branzi y los últimos párrafos de esa lectura profunda y reflexiva de Buchanan (PDF, 52Kb), recordada por Ghost in the Pixel, y tan adecuada para estos últimos días de año:

“No hay razón para sentirse infeliz con la pluralidad de las exploraciones del diseño en el mundo contemporáneo mientras no nos hagan caer en ideologías, y cada uno de nosotros podamos elegir nuestro propio camino dentro de unos razonables límites de responsabilidad, basada en discusiones meditadas acerca de lo que es bueno, oportuno, útil o placentero.
Podemos preocuparnos por el trabajo que vemos hoy día en torno al diseño gráfico o industrial y estar encantados por una amplia gama de otros trabajos.
El Diseño es muy joven y todavía tiene mucho camino por recorrer en la exploración de su rol en la cultura. Para muchos de nosotros esto significa una comprensión más profunda de las disciplinas del pensamiento del diseño, no simplemente cambios en el estilo y en el tratamiento de su superficie. Esperamos que la calidad de la discusión continúe avanzando y que los diseñadores no se preocupen porque sus ideas y su trabajo sea sometido a un debate más amplio y en profundidad que en el pasado. Tenemos mucho que aprender viviendo en una cultura que no es fija ni inmutable, y esta es, a la vez nuestro placer y nuestra responsabilidad”.

“There is no reason to be unhappy with the pluralism of design explorations in the contemporary world, so long as these explorations are not entrapped in ideology and each of us may pursue our own paths in design within the reasonable bounds of responsibility, based on informed discussions of what is good, just, useful, and pleasurable.
We may be distressed by some of the work that we see in graphic and industrial design today and delighted by a wide range of other work.
Design is very young and has far to go in the exploration of its role in culture. For many of us, this means better understanding of the disciplines of design thinking, not merely changes in style and surface treatment. Our hope that the quality of discussion about design continues to improve and that designers do not become afraid of having their ideas and work subjected to wider and more insightful discussion than in the past. We all have much to learn about living together in a culture that is not fixed and changeless, and this is both our pleasure and our responsibility”.

COMENTARIOS:

torresburriel dice:

Precisamente hoy estaba pensando, en el transcurso de una sesión de trabajo, que la estrategia de diseño basada en la simplicidad por la vía de la priorización hace que la arquitectura de información parezca dejar de tener sentido.

Entiendo que eso sólo sería posible si realmente los proyectos redujeran al máximo su alcance (en cuanto a información, contenidos, funcionalidad), cosa poco probable hoy día, salvo en contados ejemplos: twitter o la versión lite de facebook, por poner dos ejemplos (http://ow.ly/PNDe).

Pero fíjate que aun perdiendo predominancia en algunos proyectos, tal y como señalas, creo que la arquitectura no deja de ser una parte muy importante que siempre esta presente, que no podemos obviar, aunque no hayamos pensado en ella (seguramente porque otro lo ha hecho por nosotros).

De esta manera, desde una perspectiva sistémica, las “propiedades emergentes” de un sistema (equilibrio, funcionalidad, placer de uso… ) no las vamos a encontrar en la arquitectura, en el diseño de la interfaz,en el diseño de interacciones… Creo que dichas propiedades surgen cuando todas esas partes actúan. De ahí la insistencia de valorar la responsabilidad y la tarea de cada actividad profesional en el conjunto.

–0–

THINKEPI: ARQUITECTURA DE INFORMACIÓN Y DISEÑO DE INTERACCIÓN, DOS DISCIPLINAS DIFERENCIADAS EN EL MARCO DE LA EXPERIENCIA DE USUARIO

En mi opinión, la Arquitectura de Información (AI) no desaparecerá. Creo que el Diseño de Interacción es una cosa y la AI es otra. Ambas a su vez, conforman efectivamente, una parte importante de la Experiencia de Usuario  que veo como marco global. Ahora bien, la AI es la vertiente más “documental” del diseño de espacios de información y una parte imprescindible e insoslayable de dicho diseño por lo que no creo ni que desaparezca, ni que pueda ser obviada ni asumida por terceras disciplinas.

El Diseño de Interacción tiene unos objetivos específicos que no son precisamente los de sistematizar el espacio de información, ni plantear una adecuada navegación, ni facilitar que los elementos o unidades informativas del sitio estén correctamente descritos, de que exista una metaestructura informativa adecuada, de que el contenido sea adecuado, de que se puedan indexar correctamente sus elementos constituyentes, de que se puedan compartir y difundir (vía sindicación de contenidos o terceros medios) o de que puedan ser correcta y fácilmente encontrados y recuperados por parte de los usuarios y gestores de los mismos (o lo que es lo mismo, que sean “findables”). Esas tareas no entran dentro de lo que se entiende como Diseño de Interacción y sí dentro de lo que se entiende como Arquitectura de Información.

El Diseño de Interacción se centra principalmente en el diseño de la interfaz y de los elementos con los que interactúa el usuario, en la identificación y análisis de los objetivos y tareas que se dan en un espacio de información, y en el análisis del diseño de los flujos y procesos de interacción en el mismo.

AI y Diseño de Interacción son complementarias. El hecho de que como sintetiza perfectamente Torres Burriel “la estrategia de diseño basada en la simplicidad por la vía de la priorización [haga] que la arquitectura de información parezca dejar de tener sentido” y de que ambas disciplinas las lleve a cabo habitualmente la misma persona o profesional de forma recurrente (aunque algún compañero conozco que en algún proyecto ha actuado y actúa exclusiva y únicamente como Arquitecto de Información puro y duro -lo que no es lo usual-) no implica que puedan y deban diferenciarse, ni que la primera vaya a desaparecer absorbida por la segunda. Conviven en el marco de la Experiencia de Usuario.

En cuanto a la denominación de la persona que las ejerce, si se quiere buscar un título común quizá se pueda hablar como se hace ya desde hace algún tiempo de Arquitectos de Experiencia de Usuario en lugar de Arquitectos de Información o de Diseñadores de Interacción. Ahora bien, cada cual que use el nombre que más le convenga o con el que más cómodo se encuentre. El debate está abierto y creo que es precisamente una consecuencia natural de la evolución de estas disciplinas en los últimos años, lo que por otro lado es una buena muestra de su dinamismo, pertinencia y vigencia, y de que están madurando.

BIBLIOGRAFÍA:

• Ortega Santamaría, Sergio. ¿El paraguas será la Experiencia de Usuario? [en línea]. Sortega: Comunicación, usabilidad, diseño e interacción. 28 dic. 2009. http://www.sortega.com/blog/%C2%BFel-paraguas-sera-la-experiencia-de-usuario/#comments [Consulta: 06 ene. 2010]
• Torres Burriel, Daniel. Weblog: Torresburriel.com [en línea] http://www.torresburriel.com/weblog [Consulta: 7 ene. 2010]
• UXNet: The User Experience Network [en línea] http://www.uxnet.org/
• Tosete Herranz, Francisco. La rueda de la Experiencia de Usuario [en línea]. Imaginas.net. http://www.imaginas.net/esquemas
• Hassan Montero, Yussef, Ortega Santamaría, Sergio. Informe APEI sobre Usabilidad [en línea] no solo usabilidad. http://www.nosolousabilidad.com/manual/1.htm [Consulta: 6 ene. 2001]
• Memmel Zuerich, Thomas. Under the umbrella of User Experience – Usability Engineering and Interaction Design in 2010 [en línea] The usability architect. http://www.usability-architect.com/2009/12/under-umbrella-of-user-experience.html  [Consulta: 6 ene. 2001]
• Buchanan, Richard. Branzi’s Dilemma: Design in Contemporary
  Culture [en línea] http://mitpress.mit.edu/journals/DESI/Buchanan.pdf [Consulta: 6 ene. 2001]
• Gajendar, Uday. What it all comes down to [en línea] Ghost in the pixel. http://www.ghostinthepixel.com/?p=295

Consideramos imprescindible la retirada de la disposición final primera de la Ley de Economía Sostenible por los siguientes motivos:

1. Viola los derechos constitucionales en los que se ha de basar un estado democrático en especial la presunción de inocencia, libertad de expresión, privacidad, inviolabilidad domiciliaria, tutela judicial efectiva, libertad de mercado, protección de consumidoras y consumidores, entre otros.
2. Genera para la Internet un estado de excepción en el cual la ciudadanía será tratada mediante procedimientos administrativos sumarísimos reservados por la Audiencia Nacional a narcotraficantes y terroristas.
3. Establece un procedimiento punitivo “a la carta” para casos en los que los tribunales ya han manifestado que no constituían delito, implicando incluso la necesidad de modificar al menos 4 leyes, una de ellas orgánica. Esto conlleva un cambio radical en el sistema jurídico y una fuente de inseguridad para el sector de las TIC (Tecnología de la Información y la Comunicación). Recordamos, en este sentido, que el intercambio de conocimiento y cultura en la red es un motor económico importante para salir de la crisis como se ha demostrado ampliamente.
4. Los mecanismos preventivos urgentes de los que dispone la ley y la judicatura son para proteger a toda ciudadanía frente a riesgos tan graves como los que afectan a la salud pública. El gobierno pretende utilizar estos mismos mecanismos de protección global para beneficiar intereses particulares frente a la ciudadanía.
   Además la normativa introducirá el concepto de “lucro indirecto”, es decir: a mí me pueden cerrar el blog porque “promociono” a uno que “promociona” a otro que vincula a un tercero que hace negocios presuntamente ilícitos
5. Recordamos que la propiedad intelectual no es un derecho fundamental contrariamente a las declaraciones del Ministro de Justicia, Francisco Caamaño. Lo que es un derecho fundamental es el derecho a la producción literaria y artística.
6. De acuerdo con las declaraciones de la Ministra de Cultura, esta disposición se utilizará exclusivamente para cerrar 200 webs que presuntamente están atentando contra los derechos de autor. Entendemos que si éste es el objetivo de la disposición, no es necesaria, ya que con la legislación actual existen procedimientos que permiten actuar contra webs, incluso con medidas cautelares, cuando presuntamente se esté incumpliendo la legalidad. Por lo que no queda sino recelar de las verdaderas intenciones que la motivan ya que lo único que añade a la legislación actual es el hecho de dejar la ciudadanía en una situación de grave indefensión jurídica en el entorno digital.
7. Finalmente consideramos que la propuesta del gobierno no sólo es un despilfarro de recursos sino que será absolutamente ineficaz en sus presuntos propósitos y deja patente la absoluta incapacidad por parte del ejecutivo de entender los tiempos y motores de la Era Digital.

La disposición es una concesión más a la vieja industria del entretenimiento en detrimento de los derechos fundamentales de la ciudadanía en la era digital.

La ciudadanía no puede permitir de ninguna manera que sigan los intentos de vulnerar derechos fundamentales de las personas, sin la debida tutela judicial efectiva, para proteger derechos de menor rango como la propiedad intelectual. Dicha circunstancia ya fue aclarada con el dictado de inconstitucionalidad de la ley Corcuera (o “ley de la patada en la puerta”). El Manifiesto en defensa de los derechos fundamentales en Internet, respaldado por más de 200 000 personas, ya avanzó la reacción y demandas de la ciudadanía antes la perspectiva inaceptable del gobierno.

Para impulsar un definitivo cambio de rumbo y coordinar una respuesta conjunta, el 9 de enero se ha constituido la “Red SOStenible” una plataforma representativa de todos los sectores sociedad civil afectados. El objetivo es iniciar una ofensiva para garantizar una regulación del entorno digital que permita expresar todo el potencial de la Red y de la creación cultural respetando las libertades fundamentales.

En este sentido, reconocemos como referencia para el desarrollo de la era digital, la Carta para la innovación, la creatividad y el acceso al conocimiento, un documento de síntesis elaborado por más de 100 expertos de 20 países que recoge los principios legales fundamentales que deben inspirar este nuevo horizonte.

En particular, consideramos que en estos momentos es especialmente urgentes la implementación por parte de gobiernos e instituciones competentes, de los siguientes aspectos recogidos en la Carta:

1. Los artistas como todos los trabajadores tienen que poder vivir de su trabajo (referencia punto 2 “Demandas legales“, párrafo B. “Estímulo de la creatividad y la innovación”, de la Carta);
2. La sociedad necesita para su desarrollo de una red abierta y libre (referencia punto 2 “Demandas legales“, párrafo D, “Acceso a las infraestructuras tecnológicas”, de la Carta);
3. El derecho a cita y el derecho a compartir tienen que ser potenciado y no limitado como fundamento de toda posibilidad de información y constitutivo de todo conocimiento (referencia punto 2 “Demandas legales“, párrafo A, “Derechos en un contexto digital”, de la Carta);
4. La ciudadanía debe poder disfrutar libremente de los derechos exclusivos de los bienes públicos que se pagan con su dinero, con el dinero publico (referencia punto 2 “Demandas legales“, párrafo C, “Conocimiento común y dominio público”, de la Carta);
5. Consideramos necesaria una reforma en profundidad del sistema de las entidades de gestión y la abolición del canon digital (referencia punto 2 “Demandas legales“, párrafo B, “Estímulo de la creatividad y la innovación”, de la Carta).

Por todo ello hoy se inicia la campaña INTERNET NO SERA OTRA TELE y se llevarán a cabo diversas acciones ciudadanas durante todo el periodo de la presidencia española de la UE.

Consideramos particularmente importantes en el calendario de la presidencia de turno española el II Congreso de Economía de la Cultura (29 y 30 de marzo en Barcelona), Reunión Informal de ministros de Cultura (30 y 31 de marzo en Barcelona) y la reunión de ministros de Telecomunicaciones (18 a 20 de abril en Granada).

La Red tiene previsto reunirse con representantes nacionales e internacionales de partidos políticos, representantes de la cultura y delegaciones diplomáticas.

Firmado
Red SOStenible

La Red SOStenible somos todos. Si quieres adherirte a este texto, cópialo, blogguéalo, difúndelo.

Hasta ahora no había hablado de él y ya va siendo hora dado que, desde que lo descubrí, se ha convertido en una de esas aplicaciones imprescindibles que, trabaje en el equipo que trabaje, tengo que instalar:

Jing es un estupendo capturador de pantalla de una compañía que en esto de la Experiencia de Usuario ya tiene tablas, Techsmith, y que tiene una serie de características que lo hacen más que recomendable:

• Permite grabar vídeo gratuitamente en formato SWF o en formato MP4 en la versión de pago (15$ al año) que se puede editar posteriormente con Camtasia. Ideal para test de usuario.
• Tiene un gestor o histórico de capturas de imágenes y vídeos que va guardando aquellas/os que hemos hecho y mediante el que podemos recuperarlos en cualquier momento.
• Tiene un pequeño editor que permite resaltar áreas, zonas o elementos de la captura de pantalla mediante una flecha, marco o área semitransparente de color así como agregar texto en el mismo momento de la captura.
• Permite subir las imágenes capturadas con un sólo clic a Screencast.com, un servicio de almacenamiento en línea puesto en marcha por Techsmith o a nuestra cuenta de Flickr especificando el título que deseemos (una pena que no tenga la opción de incorporar tags a la misma y que en la versión gratuita ponga siempre la etiqueta de Jing, pero bueno, al fin y al cabo alguna limitación ha de tener la versión gratuita).
• Permite subir imágenes al servidor FTP que configuremos.
• En la versión de pago, permite subir los vídeos a YouTube.
• Permite lanzar el editor de Snagit una vez hecha la captura si tenemos la aplicación instalada en nuestro ordenador.
• Posibilita hacer un copiar y pegar al portapapeles para editar la imagen en Photoshop si es necesario o en nuestro programa de edición de imágenes favorito.
• Por supuesto, si lo preferimos podemos guardar las capturas con el formato que deseemos en nuestro ordenador.
• Y para guinda, una nueva característica que acaban de añadir, permite con un sólo clic twittear una imagen junto a un enlace que lleva a la captura de pantalla en Screencast.com.

Lo dicho, toda una pequeña maravilla altamente recomendable de instalar que en su versión gratuita ofrece unas características estupendas. Y lo mejor, está disponible tanto para Windows como para Mac.

Pd. Y de postre, una estupenda noticia que anuncian en el web de Techsmith. Ya está disponible una beta de Snagit para Mac :-D

Post actualizado (*)

Y de nuevo, el equipo de UX y diseño gráfico de 11870.com lo ha vuelto a hacer y ¡los ROBOTS vuelven a la carga!

Esta es una captura del pie de hoy de su home:

No sé si vosotros hacíais recortables de pequeños. Yo sí. Y estas son justo el tipo de cosas que te traen a la memoria aquellas épocas y te hacen esbozar cuando menos una sonrisa. El tipo de cosas que humanizan una interfaz y un sitio frío. Y el tipo de cosas que pueden crear tendencia en cuanto a diseño de UX, look & feel y diseño emocional se refiere en los sitios web.

¡¡¡A imaginar diseñadores…!!! (Y a ser un poco más humanos directores/gestores/responsables de las webs, que de esto trata la cosa, de crear experiencias de usuario. Tus usuarios y tu cuenta de resultados lo agradecerán. ¿Acaso necesitas más razones para empezar a poner en práctica este tipo de iniciativas?

Y lo mejor de todo es que, aparte del pie… tienes un enlace bien majo para descargarte el recortable navideño del robot con su ZX Spectrum 48k :-)

Ante esto sólo puedo decir una cosa, de nuevo, enhorabuena a Esther, al equipo y al Director de UX. Buenísimo.

Pd. No me resisto a hacer una pequeñísima sugerencia, ya sé que el diseño es plano pero precisamente por eso y para resaltar aún más el enlace ¿habéis probado a ponerle una sombra debajo muy pequeña para crear un efecto de oclusión y potenciarlo como foco de atención? Podría quedar bien :-)

(*) Otros pies de página que acabo de ver y que me han llamado la atención:

Smashing Magazine - Pie de página

Foodspoting.com - Pie de página

Algunos controles de interfaz y páginas web que me han llamado la atención navegando:

En Boo.com me he encontrado un curioso filtro. En la home se puede observar junto al box de búsqueda por ciudad o nombre de hotel un deslizador que permite restringir los resultados a los hoteles de “n” estrellas. El uso del deslizador permite establecer un rango de las categorías de hoteles que nos gustaría consultar: entre ninguna y 3 estrellas, entre 2 y 5 estrellas..

Lograr el mismo comportamiento sin utilizar el deslizador y con controles “más estándares” es complicado y menos usable. Un posible diseño sería disponer de dos combos desplegables, uno rotulado como “hoteles desde…” y cuyos valores fueran desde ninguna estrella hasta 5, separando ambos combos la palabra “hasta” y otro combo rotulado como “hoteles hasta…” con valores que deberían variar en función de la selección que hiciera el usuario en el primer combo.

Muy complejo. Mejor el deslizador aunque habría que chequear su uso de cara a accesibilidad para asegurarnos de que no da ningún problema.

Por cierto, la forma en que se ha resuelto el diseño gráfico de las pestañas en ese módulo de búsqueda es francamente mala cuesta muchísimo percibirlas como tales y establecer la correcta asociación entre la pestaña que está activa y la parte inferior.

Cuando se ha hecho una búsqueda cualquiera me ha llamado también la forma en que han resuelto el sistema de navegación más allá de la propia home:

Boo.com Barra de navegadión con filtros (combos desplegables) en segundo nivel de navegación

En el segundo nivel de navegación, situados a la izquierda, los dos combos desplegables permiten escoger el país y la ciudad y en función de la selección realizada, el resto de opciones de segundo nivel de navegación que a su vez actúan como filtros, se actualizan. Algo similar al sistema de navegación de Idealista.com u 11870.com. Quizá, lo mejor de ello sea lo compacto que queda, y la fuerte jerarquía y relación horizontal que se establece. Normalmente los filtros solemos verlos en una columna situada a la derecha y cuyos elementos se jerarquizan de arriba a abajo. Esta es otra opción de navegación. Me gusta.

Cambiando de sitio, navegando he ido a dar con una consultora inglesa cuyo diseño del sitio me parece francamente majo: Clearleft.com

Un diseño muy limpio, una escala de colores muy cálida, cercana, verde lima, con todos los valores positivos que se le asocian. En la home dejan bien claro lo que hacen, sus fortalezas, lo que quieren y la forma de contacto todo por encima del pliegue de pantalla y haciendo scroll vertical, desplegando el resto de información importante en tres bloques adicionales “Web design & Consultancy”, “Clearleft news” y “What next” resaltados fuertemente gráficamente sobre un rectángulo de fondo marrón con un borde de 1px blanco que lo potencia respecto del fondo y que funciona como conector entre las camas de color de los cuatro bloques en los que está separada la home, el primero situado por encima del pliegue de pantalla y los tres restantes citados.

La retícula en tres columnas al 33% con sus medianiles y que rompen en el primer módulo (el pliegue de pantalla) en el que se entra al 100% de ancho  y el último “What next” en el que las columnas se distribuyen al 66% y 33% respectivamente dan fuerza, ritmo e interés al diseño.

Se utiliza una jerarquía tipográfica muy clara jugando con los tamaños y con los cuerpos en negrita para centrar la atención donde interesa. Se hace un uso muy comedido de la imagen y con excepción del tercer módulo, se cuida bastante la carga textual de cada bloque.

Home de la consultora de UX inglesa Clearleft.com

Me gusta el detalle de las pestañas superiores y como crean una fuerte tensión visual rompiendo la linealidad del bloque de la cabecera con las opciones de navegación, y la pestaña activa que conecta la cabecera con el módulo inferior al desbordar sus límites. Utilizan además una sombra creando un efecto de oclusión o 3D sutil, para resaltarla. Asimismo, me gusta también el efecto de hover en el que se establece claramente el estado de transición antes de hacer clic en la pestaña sobre la que se encuentra situado el cursor:

Estado de transición de las pestañas de la navegación principal. Cuando el cursor se posiciona encima de una (en este caso "What we do") se resalta ligeramente por debajo de las demás pero no tanto como la actual seleccionada, y su cuerpo cambia de color a gris oscuro

Por último, como comentaba, se hace un buen uso de la imagen. En la captura, la página del equipo. Muy buen detalle el romper la linealidad recta del diseño alabeando ligeramente a izquierda y derecha las fotos de los miembros y superponiéndo las esquinas unas encima de otras como si las tuviéramos encima de una mesa y no enfrente de nosotros:

Equipo de trabajo de Clearleft.com

Por cierto, no tengo absolutamente nada que ver con ellos, ni les conozco ni pienso irme a trabajar a Inglaterra. Simplemente, me gusta el diseño de su site. Por estos lares también tenemos muy buenos ejemplos, y por latinoamérica también.

Si vendes consultoría de Experiencia de Usuario hay que predicar con el ejemplo. Si tu web tiene más de 4 años quizá sea hora de ir dándola una vuelta y actualizándola. Al fin y al cabo, la Web, es un organismo mutable y vivo, extremadamente dinámico. Y una de las mejores tarjetas de presentación de tu trabajo es el site de tu consultora. Yo no confiaría en alguién cuya imagen no refleja un mínimo de calidad, pero lo mismo es que soy un poco de Marte, quién sabe :-)

Actualización 31 dic 2009 (*)

Me gusta bucear por los webs de la Fundación Mozilla, por sus Wikis y sus grupos de discusión. Y me gusta porque son uno de los lugares donde más Diseño de Interacción y Diseño de Información aprendo.

El equipo de UX de Mozilla es francamente bueno y algunas de sus discusiones son antológicas y de libro. No hay muchos sitios en donde se pueda aprender interacción como en estos lugares en donde uno tiene la sensación de que realmente la Experiencia de Usuario se valora en lo que vale. Razones no les faltan. Con un público de 300 millones de usuarios, o lo haces bien, o pasas a ser jugador de segunda en nada de tiempo.

En España, aunque la UX ha avanzado muchísimo desde el 2000, todavía nos quedan un par de vueltas antes de que nos pongamos al mismo nivel que en otros países en cuanto a inversión de recursos en UX se refiere. Por aquí, no conozco muchos lugares donde de manera sistemática se hagan tests de usuarios como parte del proceso de diseño/rediseño de los sites o productos que se acometen y se haga diseño centrado en el usuario por mucho que se predique que se hace. El coste que conlleva tanto económico, como en tiempo y Recursos Humanos lo hacen inviable dado que, de momento, no hay muchos clientes que puedan o quieran asumirlo cuando pueden tener un producto “más o menos” aceptable desde un punto de vista de usabilidad con una rebaja de presupuesto del ¿30? ¿40%?

No obstante, poco a poco, se va abriendo brecha y algunas empresas punteras sensibilizadas van poniendo en marcha sus propios labs (que por cierto, a ver para cuando alguna consultora se anima a realizar la inversión y abre su propio dominio que empiece con labs.xxxxxx.xxx). El problema es una vez más el coste, aunque hay jugadores muy grandes que podrían acometer la inversión holgadamente. Todavía falta implantar realmente una cultura del I+D+i.

Y volviendo a la materia que da origen al título de este post, navegando por los Wikis de Mozilla he ido a dar con esta maqueta en donde se plantea el rediseño del sistema de notificaciones para Firefox 4.0.

Me gusta la forma en que se han utilizado los colores para comparar las características del antiguo rediseño y el nuevo por las siguientes razones:

• Los colores definen capas de información, relacionan elementos y permiten realizar con precisión comparaciones entre ellos.
• Permite hacer emerger el conocimiento implícito en el rediseño explicitándo gráficamente las razones por las que se lleva a cabo, para que sean entendidas sin ambiguedades y rápidamente por parte del cliente.
• Facilita juzgar fácilmente el peso que se le otorga a los distintos elementos de la interfaz y la mejora que supone en cuanto usabilidad.
• Facilita estudiar la interrelación semántica que se establece entre los distintos componentes de la interfaz y entrar a considerar cuestiones como la idoneidad de su posicionamiento espacial.

Sin el uso de los colores sobre un prototipo en blancos, negros y grises, no sería posible obtener una visión y realizar una comparación tan clara de la interfaz original y la propuesta como evolución como se consigue en el presente ejemplo. Una buena práctica que se puede utilizar en nuestro trabajo diario:

Propuesta de rediseño para las notificaciones de Firefox 4.0. Los colores definen capas de información delimitando y relacionando con claridad y sin ambiguedades los distintos elementos de la interfaz original y la propuesta. La maqueta es de Alex Faaborg

(*) Para ver otro buen ejemplo de comparación de interfaces y uso del color (en este caso se comparan estados) se puede echar un vistazo a: “A piece with a lot of screenshots about the close tab behaviour in Google Chrome”

Los anuncios de Coca-Cola no tienen desperdicio. Son auténticas joyas para diseccionar en una estupenda clase de análisis semiótico de Diseño.

Y es que, según su particular visión y concepción “feliz” del mundo, Coca-Cola te desea una vez más, Feliz Navi$a$:

La foto está echa a una de las marquesinas de los autobuses del Ayuntamiento de Madrid en la que se ve el último anuncio de Coca-Cola. Perdonar la calidad de la imagen pero aparte de que, como comentaba en el anterior post, la cámara de mi HTC no es ninguna maravilla había un señor delante y no he podido coger una captura mejor. A ver si luego puedo hacerle unas cuantas más de la parte de abajo que alguna cosa más he visto en el cartel. Los creativos de Coca-Cola juegan mucho con las figuras y fondos y los espacios positivos y negativos de la imagen. Aunque no se aprecia muy bien en esta foto, a mano derecha de Papa Noel se ve la silueta de un padre sonriente que sostiene en alto en sus brazos a un niño mirando hacia Papa Noel.

Pues eso. Coca-Cola y su particular “mundo feliz”.

Para quien quiera ver a Papa Noel con su saco de “regalos” y todo lujo de detalles puede descargarse el $alvapantalla$ en la web de Coca-Cola.

A este paso lo de publicar por diciembre fotos en el blog con Madrid nevado se va a convertir en una tradición. Bendito metro.

La calidad de la segunda foto no es buena sorry. Tienen que mejorar bastante la cámara de los HTC y ponerle flash:

Pues eso, que aunque yo no soy muy dado a estas cosas, felices fiestas queridos lectores y buenos prototipos para el 2010.

Pd. La primera foto está tomada con un iPhone y es de Fernando (gracias por el permiso para publicarla)