Tentándole (interacción)

francisco tosete | usabilidad, interacción, diseño y arquitectura de información

histórico de posts

July 18, 2009

Metapatrones de diseño ambientales o Experiencia de Usuario y Diseño de Interacción Ambiental

Acabo de incorporarme a un proyecto en el que vamos a trabajar, como ha comentado en alguna ocasión Jesus Encinar, “al pixel”. En el que cada cambio que se acomete de la interfaz cuenta y ha de estar sustentado por una serie de decisiones que muevan a decidir la conveniencia de llevarlo a cabo o no. Y esta circunstancia, junto al hecho del transfondo de los proyectos que llevo como consultor de Experiencia de Usuario, Arquitecto de Información y Diseñador de Interacción (perdonad lo rimbombante que pueda parecer citar los tres campos principales de mi área de trabajo pero creo que es fundamental hacerlo a propósito de la esencia o idea principal que voy a tratar de exponer y defender en el presente post), me ha llevado a plantearme una cuestión interesante:

¿Existen metapatrones de diseño ambientales en UX, AI en HCI y más genéricamente en Diseño de Interacción?

¿Existen realmente?

En este proyecto acaban de pedirme que presente argumentos para ver la conveniencia de cambiar de lugar un “Teléfono de Atención al Cliente”. Lo curioso del tema es que la web en cuestión en la que estoy trabajando, por sus características, es bastante singular, no tiene un amplio campo (al menos a priori) de “competidores” o webs similares con las que poder comparar y realizar el clásico benchmarking a partir del cual extraer conclusiones válidas de diseño. De hecho, en España, es única, y en el mundo, que yo sepa, sólo hay tres organismos que se la puedan equiparar.

¿Cómo presentar razones sobre las que defender o no la conveniencia de acometer el cambio de lugar del teléfono a otra parte de la interfaz?

Bueno, hay muchas formas, y el benchmarking no es sino una de tantas. Por ejemplo, se pueden hacer test A/B, testar con usuarios reales, medir el aumento o disminución del número de llamadas al Call Center en función del lugar en el que se posicione el teléfono, echar mano de CrazyEg y monitorizar los puntos focales de atención o puntos calientes de interacción mediante mapas calientes generados a partir de donde clickan los usuarios en el actual diseño de interfaz, se pueden analizar los logs y tratar de extraer las pertinentes conclusiones asociadas al hecho de moverlo o no de lugar, etc.

Unas son más accesibles para el trabajo diario de cualquier consultor. Otras no. Así que una de las cosas que estaba haciendo era realizar un benchmarking cruzado de otro tipo de webs, no extrictamente ceñidas al campo de la actual (de hecho es lo que me habían aconsejado que hiciera para la presente tarea). Y con ello se me estaba planteando algo curioso.

Realmente creo que existen patrones de diseño que pueden considerarse desde múltiples y muy variados puntos de vista: UX, AI, HCI y Diseño de Interacción y en general, que exceden o implican a muchas más áreas de conocimiento a la vez. De ahí el hablar de metapatrones de diseño ambientales parafraseando a Peter Morville y su “nueva” disciplina, como ha dado en llamarla “Ambient Findability”.

Porque a pesar de hacer un benchmarking cruzado de diferentes sitios para observar dónde posicionan el “Teléfono de Atención al Cliente” en sus respectivas homes y webs, y a pesar de que son de campos de negocio diferentes, la cuestión principal, el leit motiv, o uno de los principales y más fuertes motivos, que puede mover a posicionar en todas ellas un teléfono en una posición particular es cuando menos fuertemente similar:

Es potenciar su visibilidad para que los clientes o usuarios del web lo vean con extremada facilidad, si tal es la meta -potenciar el Call Center-, u ocultarlo o posicionarlo en un lugar menos importante o con una jerarquía informativa inferior en la página para reducir el número de llamadas al mismo, frente al uso de la web u otros sistemas o ayudas en línea, si tal es el objetivo principal que se busca con el rediseño.

Así, no parece descabellado, sino ciertamente pertinente, conveniente, e incluso necesario realizar un benchmarking cruzado de sitios de diferentes áreas y modelos de negocio para analizar cómo y por qué posicionan el Teléfono de Atención al Cliente en determinados lugares en sus respectivas webs: evaluando tanto las razones contextuales que pueden llevar a tal decisión -las características particulares de diseño de la interfaz y los condicionamientos que pueden haber dado lugar a esa decisión en esa web concreta y en esa interfaz específica-, y las características que pueden haber llevado a tal decisión en otras webs no relacionadas e incluso en otros dispositivos y/o en otras interficies (no necesariamente superficies interactivas).

Un análisis ambiental intentando inferir las razones de diseño que guían un objetivo que se busca respecto a un propósito específico con un diseño en distintos soportes, interficies (web, papel) y dispositivos.

La busqueda de metapatrones de diseño ambientales.

Existen, pienso. Los patrones de diseño lo son, sólo hay que leerse el libro de Jennifer Tidwell uno de tantos otros por ejemplo, para ser conscientes de ello, y ampliar un poco el campo del razonamiento a otras interficies y dispositivos.

En general, analizar qué cuestiones desde un punto de vista ambiental pueden forzar a tomar una determinada decisión de diseño respecto a un elemento específico a evaluar y a un objetivo o meta concretos, tanto gráficamente hablando, de acuerdo a la importancia jerarquica informativa que tiene en la interfaz, hasta las razones desde un punto de vista diseño ergónomico (por ejemplo por qué en la máquina de café de nuestra oficina se pone el Teléfono de Atención al Cliente donde se pone -¿esquina superior derecha? donde suele estar la ranura por la que echamos la moneda para obtener el café? ¿Está posicionada en ese lugar por el condicionamiento físico de que una gran mayoría de la población es diestra y a una determinada altura porque la media de altura de la población, o más genéricamente del hombre y la mujer es “X”?) físico ¿qué factores influyen en el diseño del objeto físico, qué affordances ofrece? o cognitivo ¿cómo las percibimos y procesamos? con el fin de extrapolarlas al entorno digital.

Al fin y al cabo, el proceso psicofísico de percepción de nuestro mundo tridimensional, aunque complejísimo, reduce (creo, por favor, entiéndase esto con el debido, necesario y considerado excepticismo científico de quién no puede comprobarlo en laboratorio) la complejidad de los factores implicados en la toma de decisiones que guían nuestras acciones, nuestra percepción cotidiana y nuestro proceder cognitivo diario.

Metapatrones de diseño ambientales.

Amplía el campo de análisis de tu benchmarking y no te ciñas únicamente a las webs de tu sector de negocio, a tu interfaz concreta, a tu soporte informativo específico (papel o digital) o al dispositivo con el que trabajes.

Si lo amplías es posible que obtengas información, razonamientos y conclusiones que te pueden llevar a identificar metapatrones de diseño ambientales ciertamente interesantes.

Insisto, todo ello expresado con el necesario excepticismo científico. Pero aún así, creo que es una nueva área en cuanto al Diseño en general, y en cuanto a la Experiencia de Usuario y a la Interacción Hombre-Ordenador en particular se refiere, que debería comenzar a ser reconocida y tenida en cuenta y por ende, articulada e investigada.

Me gustaría ver algún día el equivalente del libro de Jennifer Tidwell “Diseñando interfaces: Patrones para un Diseño de Interacción efectivo”, el propio título de su libro lo dice, escrito e identificando patrones de diseño, de organización de contenidos y de interacción no ciñéndose a la World Wide Web, sino ampliado a diversas áreas de conocimiento, ocio o negocio, a distintos soportes informativos y a diversos dispositivos que no tienen porque ser necesariamente el ordenador (la interacción que mantenemos actualmente con el mismo y el paradigma que ahora está cayendo sobre el que se ha sustentado hasta ahora la HCI clásica, forma física del ordenador y periféricos de entrada como el teclado o el ratón, es ciertamente limitada cuando podría ser potenciada, como se está comenzando a hacer ahora por otros medios de interacción multimodales como el tacto, la vista, o la voz).

Una concepción mucho más universal del Diseño de Interacción y la Experiencia de Usuario en línea o mucho más próxima a la Teoría del Diseño de Información e Interacción integral explicitada por Nathan Shedroff.

“One of the most important skills for almost everyone to have in the next decade and beyond will be those that allow us to create valuable, compelling, and empowering information and experiences for others. To do this, we must learn existing ways of organizing and presenting data and information and develop new ones. Whether our communication tools are traditional print products, electronic products, broadcast programming, interactive experiences, or live performances makes little difference. Nor does it matter if we are employing physical or electronic devices or our own bodies and voices. The process of creating is roughly the same in any medium. The processes involved in solving problems, responding to audiences, and communicating to others are similar enough to consider them identical for the purposes of this paper. These issues apply across all types of media and experiences, because they directly address the phenomena of information overload, information anxiety, media literacy, media immersion, and technological overload–all which need better solutions. The intersection of these issues can be addressed by the process of Information Interaction Design. In other circles, it is called simply Information Design, Information Architecture, or Interaction Design, Instructional Design, or just plain Common Sense”.

Explicitada por Sharp, Rogers y Preece (1):

“How many interactive products are there in everyday use? Think for a minute about what you use in a typical day: cell (mobile) phone, computer, personal organizer, remote control, coffe machine, ATM, ticket machine, library information system, the web, phtocopier, watch, printer, stereo, DVD player, calculator, video game… the list is endless. Now think for a minute about how usable they are. How many area actually easy, effortless, anda ajoyable to use? All of them, several, or just one or two? This list is probably considerably shorter. Why is this so?…

The main aims of this chapter are to:

Explain the difference between good and porr interaction design.
Describe what interaction design is and how it relates to human-computer interaction and other fields.
Explain what is meant by the user experience and usability.
Describe what and who is involverd in the process of interaction design.
Outline the differente forms of guidance used in interaction design.
Enable you to evaluate an interactive product and explain what is good and bad about it in terms of the goals and core principles of interaction design”

¿What is Interaction Design?”

o implicita en la definición comunitaria de la Wikipedia sobre Arquitectura de la Información:

“La Arquitectura de la Información (AI) es la disciplina y arte encargada del estudio, análisis, organización, disposición y estructuración de la información en espacios de información, y de la selección y presentación de los datos en los sistemas de información interactivos y no interactivos.

La Arquitectura de la Información trata indistintamente del diseño de: sitios web, interfaces de dispositivos móviles o gadgets (como los iPod), CDs interactivos, videoclips digitales, relojes, tableros de instrumentos de aviones de combate o civiles, interfaces de máquinas dispensadoras, interfaces de juegos electrónicos, etc.

Su principal objetivo es facilitar al máximo los procesos de comprensión y asimilación de la información, así como las tareas que ejecutan los usuarios en un espacio de información definido”.

Realmente está todo escrito. El conocimiento y la Ciencia avanzan a partir de, y evolucionando, el propio conocimiento y la Ciencia existente en un momento dado, examinando el “estado del arte” en un campo o cuestión determinada. Tan sólo hay que tener curiosidad y otro (muchas veces necesario) punto de vista.

Metapatrones de diseño ambientales.

–0–

REFERENCIAS BIBLIOGRÁFICAS:

(1) Capítulo 1. p. 0: Sharp, Helen; Rogers, Yvonne; Preece, Jenny. Interaction design : beyond human-computer interaction. 2ª ed. reimpr. corr. Hoboken : John Wiley & Sons, 2007. 775 p. ISBN 978-0-470-01866-8

(nota, lo de página 0 no es una errata, realmente es el primer libro que veo que empieza por la página 0 en lugar de por la 1 ¿error del editor? :-)

May 1, 2009

El Diseño Gráfico, el color, la estética, la usabilidad y los fundamentos psicofísicos del Diseño de Información y de la Experiencia de Usuario

Automatic text translation to english

Talibanes de la Usabilidad sí, pero también del Diseño Gráfico y de la estética.

El diseño gráfico y el color son, correspondientemente, un ejercicio, y un componente y una parte del Diseño de Información tan esencial y fundamental para conseguir una interfaz usable como cualquier otro aspecto implicado en su construcción tal, como por ejemplo, el Diseño de Interación.

¿Por qué?

Pues debido a que la percepción visual del ser humano es un complejísimo y amplísimo conjunto de factores psicofísicos que son la suma de estímulos ambientales e internos y de procesos que se producen a nivel físico y químico en nuestro aparato visual y en nuestro cerebro.

Ellos nos permiten que percibamos nuestro entorno, que procesemos la información que nos llega, que lo reconozcamos gracias a factores como la oclusión (que un objeto esté por delante de otro, o que tape parcial o totalmente a otro -más próximo-, o por detrás, visible parcial, o totalmente oculto -es decir, más lejano-) la perspectiva, mediante la cual nos hacemos una idea entre otras cosas de la profundidad del espacio y la distancia, la escala y el tamaño, el sombreado, la textura, el color, el contraste, la luminancia, el brillo, la cantidad de luz, la comparación, la extracción de formas y de fondos basándonos en los patrones anteriores, etc. Al mismo tiempo, nuestro sistema cognitivo y la memoria nos permiten comprenderlos, almacenarlos y memorizarlos, extraerlos, utilizarlos y compararlos para ayudarnos a percibir, aprender y entender nuestro entorno.

Conocer, comprender y entender el proceso psicofísico de la percepción visual es fundamental para tener elementos y argumentos para poder defender un diseño, para poder juzgar una interfaz y para poder entender y comprender qué funciona y qué no funciona de la misma.

Cuanto más leo, más cuenta me doy de lo poco que realmente sé, y de la importancia que tiene la psicología y el funcionamiento de nuestro sistema cognitivo y visual humano, así como de las limitaciones con las que se suele abordar y trabajar en el área de la Experiencia de Usuario en nuestra labor cotidiana, algo por otra parte inevitable excepto quizá, para las grandes multinacionales que pueden tener los recursos necesarios y que se pueden permitir hacer realmente I+D+I.

Cierto es que el trabajo del día a día es el trabajo del día a día y que un Arquitecto de Experiencia de Usuario (por englobar bajo una “etiqueta” común a Arquitectos de Información, Diseñadores de Información, Diseñadores Gráficos y Diseñadores de Interacción) de manera inconsciente, y gracias a su experiencia, suele aplicar y hacer un buen uso de los recursos enumerados y de otros tantos para hacer buenos diseños de interfaces pero sin lugar a dudas, un conocimiento aunque sea somero de los factores reseñados ayudaría mucho a mejorarlos y a dotarle con excelentes herramientas de juicio y de trabajo. Por otra parte, algunos factores del diseño caen más allá de su responsabilidad y dominio entrando en los del Diseñador Gráfico. De ahí que sea tan importante y esencial una comunicación directa, fluida, cordial y eficaz con el mismo, profesional ante todo y con la suficiente delicadeza como para poder transmitirle las recomendaciones oportunas para realzar un diseño. Y por supuesto, viceversa, tener las entendenderas bien abiertas para mirar con la suficiente profesionalidad debida los diseños que surgen basados en nuestros prototipos ya que en muchas ocasiones son sorprendentes y pueden poner de relieve aspectos en los que no habíamos pensando ya sea realzando determinadas partes de la interfaz, creando puntos focales mediante el diseño gráfico, jerarquizando la importancia de los elementos mediante el uso de los tamaños o colores, separándolos visualmente, provocando sentimientos mediante la elección de determinadas gamas cromáticas, etc.

Talibanes de la Usabilidad sí, pero también del Diseño Gráfico y de la estética. Son una parte indisociable de ese conjunto y todo que conocemos como la Experiencia de Usuario. Si te dedicas a la consultoría es esencial formar un equipo multidisciplinar de personas en el que arquitectos de información - diseñadores de interacción y diseñadores gráficos se sienten unos al lado de otros y puedan comunicarse. No hay mejor forma de crear un producto excelente.

A continuación un ejemplo muy simple de la utilización del color, el espacio, el contraste, la proximidad, la separación de áreas, la alineación, la agrupación basándose en todos o en parte de los anteriores aspectos citados, la agrupación basándose en atributos semánticos comunes (asociamos números con números, texto con texto, líneas con líneas, áreas coloreadas con áreas coloreadas, etc) para el diseño de tablas jugando con la percepción de la información presentada y consecuentemente para mejorar o decrementar nuestra capacidad para comprenderla, abstraerla y memorizarla.

Incluso con un ejemplo tan aparentemente simple de diseño de información como éste, la deconstrucción y el análisis semiótico y psicofísico es francamente complejo.

La Experiencia de Usuario es un todo, y el Diseño Gráfico es una parte fundamental de la misma para lograr productos usables.

Diseño de tablas jugando con el espacio horizontal y vertical y camas de color gris y amarilla

Diseño de tablas jugando con el espacio horizontal y vertical y camas de color gris y amarilla

Diseño de tablas jugando con el espacio horizontal y vertical y camas de color gris y amarilla entre cada tres líneas de texto

Diseño de tablas jugando con el espacio horizontal y vertical y camas de color gris y amarilla entre líneas alternas

Todas las tablas juntas. Comparación por múltiples pequeños:

Tablas. Todas juntas. Comparación por múltiples pequeños

Si en este caso jugamos con un reducísimo número de factores de diseño controlados y finito, imaginaros la increible cantidad de elementos que intervienen en el diseño de cualquier interfaz que utilizamos diariamente como por ejemplo, el escritorio de un sistema operativo.

Todavía está pendiente un post para explicar el por qué es conveniente y ayuda a la visualización de información el utilizar escalas cromáticas armónicas de colores en nuestras hojas excel cuando realizamos arquitecturas de información y mapas de arquitecturas (y en general para cualquier diseño).

February 22, 2009

Acceder a la paleta de colores extendida en Microsoft Excel 2003 para seleccionar nuevos colores

Automatic translation of the text to english

Si trabajas con Excel 2003 hay veces que uno desearía poder utilizar otros colores distintos de los que vienen por defecto en la paleta de colores de la hoja de cálculo para, por ejemplo, establecer una gama cromática armónica de tonalidades que ayude a distinguir visual y rápidamente los niveles jerárquicos de una Arquitectura de Información (profundidad de las secciones y subsecciones del sitio que estamos re/diseñando). Con ello podemos facilitarle el trabajo a la gente de desarrollo y ya de paso, a nosotros mismos.

Aunque en Excel 2007 se puede acceder directamente a la paleta de colores de 16 millones desde el propio icono de la cinta de Office (más conocida como Ribbon) en Excel 2003 no existe la opción en la misma paleta. No obstante, sí es posible acceder a ella para configurar los colores a nuestro gusto, aunque la opción se encuentra un poco más escondida.

Paleta de colores de Microsoft Excel 2003
Paleta de colores de Excel 2003

Para visualizar la paleta extendida de colores hay que ir al menú “Herramientas > Opciones” y en el cuadro de diálogo que aparece elegir la ficha o pestaña de “color”. En ella se nos mostrarán los colores estándar que se están empleando en la hoja y haciendo clic en el botón de “Modificar color…” aparecerá la paleta extendida de colores. Una opción muy útil para que podamos elegir aquellos con los que nos sintamos más cómodos trabajando o que nos pueda interesar usar.

Paleta de colores de Microsoft Excel 2003
Ficha de color en el cuadro de diálogo del menú “Herramientas > Opciones” de Excel 2003
para acceder a la paleta extendida de 16 millones de colores de la hoja de cálculo

¿Por qué elegir gamas cromáticas armónicas de color para nuestras arquitecturas o para nuestros diseños si somos diseñadores gráficos? La respuesta para próximos posts quizá ;-)

January 16, 2009

Google Chrome 2.0, Ubiquity, navegadores, sistemas operativos y el nuevo modelo de interacción

Automatic translation of the text to english

De una noticia publicada en elpais.com:

“De momento, el negocio principal de Google sigue siendo su buscador, que no es sólo eficiente a la hora de localizar páginas, noticias o documentos sino que, según la compañía, también lo es energéticamente.”

Hoy día el negocio principal de Google no es ya exclusivamente el buscador entendiendo por tal la conocida home google.com. Hoy día el punto de entrada a la Red que tiene que controlar Google (o Microsoft) y que constituye la clave del dominio de la World Wide Web son los box de búsqueda de los navegadores y la página por defecto de inicio del mismo configurada en las preferencias por el usuario tanto en dispositivos no móviles como móviles ya que:

  • El navegador es la aplicación informática que cualquier usuario está obligado a utilizar para interaccionar con la Red y será una de las aplicaciones claves en cualquier dispositivo móvil.
  • La página que el usuario tiene configurada por defecto en las preferencias de su navegador y la barra de navegación son los puntos naturales de inicio de la interacción con la Web.

El negocio de Google es la INFORMACIÓN, en mayúsculas, y más concretamente, la intermediación en el acceso a la información o la FINDABILITY. Y lo es porque en el proceso comunicativo Google es capaz de:

  1. Generar valor añadido para el usuario sin ningún coste para este, respondiendo de manera efectiva a sus necesidades informativas. El coste lo paga, como tiene que ser, la empresa o el publicista que corresponda de acuerdo a la necesidad informativa del usuario.
  2. Generar valor económico para su cuenta de resultados asociando publicidad contextual ad-hoc a las palabras clave utilizadas para realizar la búsqueda (o para expresar la necesidad informativa) por el usuario.

Google es muchísimas cosas pero una de ellas y la clave de su extraordinario éxito es que es la herramienta de marketing más perfecta que se haya desarrollado hasta la fecha. La micropublicidad que explota la mínima unidad informativa posible de la que consta un mensaje, la palabra, que tiene valor y que se puede vender. Es la antítesis de la publicidad en los medios de comunicación de masas, y un ecosistema de aplicaciones informáticas (sistema operativo) cuya potencia reside en la capacidad para segmentar como nunca antes se ha hecho al público con el fin de lograr impactos publicitarios efectivos (más o menos lo que hace en otro orden de cosas Amazon) conjuntamente con un entorno en el que se crea valor mediante la aplicación de los principios de la economía de escalas (la Larga Cola) y el en el que se obtienen de manera instantánea los retornos económicos.

Y en este sentido Google Chrome es más que un navegador. Google Chrome es un nuevo sistema operativo, ubicuo y multidispositivo. Google Chrome significa controlar la herramienta con la que se realiza la interacción en la Red y el punto de acceso a través del cual se hace un extraordinario número de búsquedas, la barra de navegación o el box de búsqueda del navegador.

Paradójicamente, en la versión española de Firefox (problema de la traducción, tendré que chequearlo en la Minefield inglesa) la barra de navegación en las preferencias del navegador se llama barra de búsqueda y paradójicamente en Firefox (y en Opera, y en Explorer), sigue coexistiendo la barra de navegación con el box de los búscadores cuando creo que deberían tender a integrarse en una sola por coherencia y facilidad de uso para los usuarios. De hecho, en Google Chrome sólo existe un único box que es a la vez barra de navegación para la introducción de urls y barra de búsqueda. ¿Tenderán el resto de navegadores a unificarlos? Creo que deberían y asimismo, deberían trabajar de manera intensiva en la mejora de esta “barra de navegación-búsqueda”.

En este sentido, Mozilla está desarrollando Ubiquity del que ya he hablado recientemente, que es un avance en cuanto al modelo de interacción entre el usuario y la Red (y del usuario con el ordenador) se refiere. Este proyecto lo veremos integrado en la próxima generación de navegadores, al menos en Firefox, y quizá también algo similar en los tradicionales sistemas operativos desktop -Windows 7, Leopard (Spotlight debe evolucionar) y puede que en las diversas distribuciones de Linux: Ubuntu, Gnome, etc-.

Ubiquity - Firefox - Sistema operativo ubicuo
Ubiquity, sistema operativo ubicuo de Mozilla

Ubiquity pretende lograr una interacción más natural con el ordenador. Todavía está evolucionando (nótese que con el box de interacción de Ubiquity ya tenemos ni más ni menos que ¡¡tres box diferentes en la misma interfaz del navegador!! cuando deberían integrarse en uno solo). El diálogo se realiza fundamentalmente utilizando el teclado, a través de comandos, pero la idea es hacerlo multimodal y facilitar además la interacción mediante la voz y el ratón.

Ubiquity:

  • Recupera la potencia y efectividad de los sistemas de línea de comandos pero apoyados por interfaces gráficas y asistentes de ayuda al diálogo contextual facilitando el reconocimiento frente al recuerdo, experiencia que se daba con las antiguas interfaces de línea de comandos.
  • Aporta una herramienta multidispositivo que trasciende al portátil y al ordenador personal alcanzando otros dispositivos, principalmente ultraportátiles, smartphones y teléfonos móviles tradicionales (que tenderán a desaparecer para convertirse en smartphones).

Ubiquity supone añadir una capa más a los actuales sistemas operativos y realizar de facto un metasistema operativo ubicuo que puede aprovechar los servicios de la World Wide Web desarrollados por terceros. Es un sistema abierto, configurable y personalizable por el usuario que idealmente podrá utilizar mediante la inclusión a su motor del verbo correspondiente con su programación, cualquier servicio o modelos de negocio desarrollado por cualquiera en la Red. Fundiendo su interfaz con el navegador y más concretamente con la barra de navegación-búsqueda, se convertiría además en un sistema extensible y mejorable por cualquiera en cuanto a la interfaz, mediante los add-ons de la comunidad de desarrolladores.

El navegador se convierte en la pieza clave de la Experiencia de Usuario en la World Wide Web y en plataforma para el desarrollo de un nuevo modelo de negocio, sistema operativo ubicuo que variará en función de las aplicaciones y servicios en línea usados por el usuario. El navegador será la plataforma que centralizará los servicios y aplicaciones que ahora encontramos en los sistemas desktop y por cierto, todo ello, utilizando áreas de publicidad minimalistas como suelen tener los servicios de Google, podrán ser monetizados por la empresa desarrolladora y utilizados gratuitamente por los usuarios. Este es tan sólo uno de tantos modelos de negocio que se pueden explotar basados en el Freemiun.

Un nuevo paradigma de interacción y de sistema operativo. En el ordenador de sobremesa, en el portátil, en el libro electrónico, en el neetbook y en el móvil.

Una bella herramienta en la que semántica (lenguaje) textual y visual, y verbo (interacción), los dos principales ejes del Diseño de Información explicitados por Tufte (Visual Explanations: Images and quantities, evidence and narrative, p. 10) se funden:

“Mis tres libros sobre Diseño de Información guardan la siguiente relación:

The Visual Display of Quantitative Information trata acerca de las imágenes de los números, sobre cómo hacer para representar los datos y reforzar la honestidad estadística.

Envisioning Information se ocupa de las imágenes de los nombres (los mapas y las fotografías aéreas, por ejemplo, son algunos de los muchos grandes nombres yacientes en la tierra)…

Visual Explanations trata acerca de las imágenes de los verbos, la representación del mecanismo y el movimiento, del proceso y de las dinámicas, de las causas y los efectos, de la explicación y la narrativa…”

Ubiquity trata de las imágenes de los verbos. De la interacción mediante la palabra y la imagen y de su integración y aparición en la nueva generación de navegadores como la siguiente versión de Firefox y Google Chrome 2.0.

January 4, 2009

La elipsis como recurso de diseño visual

En el lenguaje visual uno de los recursos con el que se puede jugar para crear atención y que se puede aprovechar para alterar el mensaje transmitido al usuario es la elipsis.

Por tal se entiende la eliminación explícita de algún elemento de la imagen que transforma su significado.

Revisando mis feeds he ido a dar con un post de Infografistas.com que comenta un mapa elaborado por Jonas Dagson sobre un mapa de “Save the children” en el que se muestran los países en los que está prohibido azotar a los niños. Tan sólo 24 en todo el mundo.

Este mapa es un estupendo ejemplo de aplicación de la elipsis. El problema en este caso particular no es qué información mostrar, sino qué información no mostrar. Borrando tinta el significado del mensaje se transmite al usuario de una manera extraordinariamente clara y directa:

Mapa (infografia) de \"\"Save the children\" de Jonas Dagson

La carga semántica del mensaje es alterada para realzar lo que se quiere transmitir. En lugar de mostrar todos los países (mapamundi completo) y colorear aquellos en los que está prohibido azotar a los niños, lo cual puede transmitir una carga semántica negativa (todos estos países son distintos de la “normalidad o generalidad”), es decir, en lugar de mostrar todo el contexto, se suprime dicho contexto a propósito para lograr potenciar la singularidad. Se borran todos los países en los que sí se puede azotar a los niños sin temor a ser multado o castigado y se muestran tan sólo aquellos que tiene legislación que lo prohíbe reforzando el mensaje de denuncia en pro de los derechos infantiles y mostrando la “soledad” de dichos países.

No obstante el diseño puede ser mejorado con muy muy poco esfuerzo. Y es que en este caso se está aplicando la metáfora del mapamundi demasiado a rajatabla ya que aproximadamente el 85% de la tinta del gráfico no transmite significado. Y puesto que no transmite significado es ruido visual destinado a embellecer el diseño.

Si se hace uso de la elipsis como figura de retórica visual lo mejor es hacerlo de manera completa y aprovechar el espacio en blanco como potente separador visual de cualquier otro elemento y creador de un contexto muy particular: la nada y en medio de ella, la singularidad.

Mapa rediseñado de \"Save the Children\" dejando sólo los países y fondo en blanco

En el gráfico rediseñado se borra todo aquello que no transmite significado dejando sólo lo que sí lo tiene. Exactamente el recurso que utiliza intensivamente Tufte a lo largo de sus libros cuando habla constamente de “borrar tinta” para hacer emerger la información y el conocimiento implícito en ella a través del diseño visual.

Un gráfico brillante el de Jonas Dagson. Para compararlos mejor podéis descargaros ambas imágenes en una sola más grande, a través del enlace de abajo, abrirla en el navegador y utilizar F11 para verla a pantalla completa:

mapa original y mapa rediseñado de Jonas Dagson en grande

Contrapuesto al mismo, la portada de El País Semanal de hoy ofrece otro bello ejemplo de uso de la elipsis como figura retórica visual.

Portada de El País Semanal. Manos con petróleo sobre fondo negro

“En busca del oro negro: El elixir que mueve el mundo” es el título del artículo cuya fotografía encabeza la portada. Sobre un fondo de color negro dos manos de color carne brillantes unidas, sostienen en sus palmas el preciado elemento del siglo XXI.

El negro es el color que nos envuelve al caer la noche, que nos priva de la visión, de la luz, el color de la muerte, que nos acaricia, el color que nos rodea en el cine eliminando cualquier otro estímulo externo, diluyendo el exterior y provocando una experiencia inmersiva que nos sumerge en la película… el color de Coliris…

Coliris

o en este caso, el del fondo de la imagen de la portada de El País.

El negro del petróleo en el hueco de las palmas y el fondo igualmente negro elegido a propósito conforma la elipsis potenciando el mensaje transmitido y dotándole de una fuerte carga connotativa: Las manos surgen como figura contra el fondo negro “agujereadas” por el petróleo que queremos beber, que nos da… ¿la muerte? en contraposición al translucido del agua que nos aporta la vida y que tomamos cuando bebemos de una fuente, un manantial o el grifo. En la imagen el petróleo que queremos retener gotea por el agujero de las manos inevitablemente y se nos escapa sin que podamos hacer nada para evitarlo dejando nuestras manos aceitosas.

Igual que el mapa anterior, una bella imagen en la que se utiliza la elipsis, recurso potente al alcance de cualquier diseñador gráfico que con un poco de creatividad puede ser usado para crear fuertes puntos focales de atención.

« Artículos anteriores





















Get free blog up and running in minutes with Blogsome
Theme designed by Hadley Wickham