La Evolución de una Idea

Diseño de Interfaces

Una de las cosas que me apasiona en el diseño de interfaces es observar el proceso de evolución de una idea. Acabo de ver en Signals vs. Noise un post sobre el desarrollo de una idea que están incorporando a uno de sus productos estrella, Basecamp.

Se trata de una idea simple, pero que cualquiera que haya usado alguna de las aplicaciones de gestión de proyectos en línea valora: mientras estás editando una tarea o trabajando en un proyecto, no siempre es fácil cambiar a un proyecto diferente. Normalmente requiere ir a la sección de proyectos o al dashboard para seleccionar el proyecto. Pues bien, lo que están haciendo los chicos de 37Signals es agregar un menú que permite desde cualquier página cambiar al detalle de otro proyecto.

Claro, esto que parece simple, puede no serlo tanto al momento de diseñarlo. El proceso de desarrollo de esa idea es lo que nos muestran en el post Design Decisions: Basecamp Project Switcher. Con fotos y video.

Cómo Volkswagen Hace Sitios Web

General

[vía Buenos Aires de Diseño] Esto es irresistible, el video del lanzamiento del nuevo sitio deVolkswagen en el Reino Unido, construido tal como construyen los autos. Me hubiera encantado ver cómo hacen los wireframes y los diagramas de interacción

Manejando la Crisis de Información

General

Luego de contarles sobre mi más reciente crisis de información recibí muchos comentarios (al menos para los estándares de este blog) de quienes han lidiado con el tema de uno u otro modo. Me dediqué entonces a investigar y finalmente llegué a una combinación que hasta ahora me resulta muy bien.

Para contextualizar un poco, les recuerdo el problema: el uso de feeds (RSS y otros) para acceder a información es una gran ventaja para mantenerse actualizado sobre diversos temas. Sin embargo, cuando la cantidad de feeds a los que uno se suscribe puede salirse de control y termina transformándose en una carga antes que una ayuda. Al momento de escribir el post anterior, y luego de mis vacaciones, tenía 6.000 posts sin leer. Eso ciertamente no es manejable.

Pues bien, no es por nada que exista una gran cantidad de herramientas dedicadas a asistir en el manejo de los feeds, no sólo los lectores como Bloglines o Google Reader, sino que además hay filtros más o menos inteligentes que permiten seleccionar contenido portérminos claves, memes, entre otros.

Luego de investigar un poco, he encontrado mi combinación ideal para mí: estoy usando FeedHub para manejar los feeds y Google Reader para leerlos. La combinación es muy buena y se complementan perfectamente, les cuento cómo funciona.

feedhub-google-reader

La combinación de FeedHub con Google Reader me ha permitido volver a tomar control de mis fuentes de información.

FeedHub

FeedHub es un servicio que permite administrar los feeds a los que te suscribes. Puedes entregarle un OPML con tus suscripciones de otros lectores o agregar manualmente los feeds que te interesan, y luego de un tiempo de educación FeedHub te ofrece sugerencias basadas en los temas que te interesan. Con la ayuda de uno el sistema va a prendiendo qué cosas son de mayor interés y va ofreciendo contenido más adecuado.

FeedHub no es un lector de feeds, por lo que necesitamos un lector para ver los posts. Aquí es donde entre Google Reader.

Google Reader

He usado Bloglines por mucho tiempo, pero necesitaba un cambio real para modificar mis hábitos. Así que decidí darle una prueba a Google Reader. FeedHub genera un feed único con todos los posts correspondientes a tus contenidos. Suscribes a esa URL desde Google Reader y éste te ayuda a manejar qué es lo que has visto, te informa de la cantidad de posts sin leer y te permite fácilmente marcarlos todos como leídos.

Cada ítem que FeedHub le entrega a Google Reader contiene una interfaz que permitemarcar si el posts es de tu interés o no, y eso ayuda a refinar los filtros.

Mejor aún, la combinación de ambos servicios permite determinar cuántos posts se desea ver simultáneamente, por ejemplo, decir que sólo se desea ver un máximo de 100 posts diarios, FeedHub determinará cuáles son los más relevantes.

Por ahora, esto me ha funcionado, y veo que en la medida que pasa el tiempo los filtros son mas precisos. Espero que mi receta le pueda servir a alguien más que se encuentre en crisis informativa. Y de paso, gracias a todos por las sugerencias.

Crisis de Exceso de Información

General

Con lo escaso que anda el tiempo en esta época, la forma en que administramos la gran cantidad de información a la que tenemos acceso es un asunto esencial. Pero cuando la forma de acceder, administrar y revisar toda esa información hace crisis, estamos ante un problema.

Mi primera crisis de ese tipo fue con las listas de correo. Estaba suscrito a una cantidad importante de listas, hasta que llegó el momento en que no les pude seguir el paso. Se me acumulaban cientos, en ocasiones hasta algunos miles de mensajes sin leer y que jamás serían leídos, pese a mi resistencia para asumirlo. La primera opción fue jugar con los filtros de correo para detectar los emails con los temas que más me interesaban. Luego eso fue insuficiente. Comencé con los digests, un listado diario con todos los correos de una lista. Así, con un escaneo rápido se puede seguir la pista de las discusiones más interesantes. Pero en un momento esto también deja de ser eficiente.

exceso-de-informacion

Esta es mi cuenta en Bloglines con más de 6.000 feeds sin leer.

Es ahí cuando aparecen el RSS o la sindicación de contenidos y los agregadores. Para mí, al menos hasta ahora, Bloglines es fundamental. Pero nuevamente llegó la crisis de información: mi cuenta, luego de las vacaciones y volver a retomar el trabajo, tiene más de 6000 posts sin leer, muchos de los que en realidad vengo arrastrando desde antes de las vacaciones. Aún no encuentro la forma en que resolveré el problema de cómo estar al día, seguir los temas que me interesan y aún ser productivo (y tener familia).

Si alguien ha encontrado cómo hacerlo, le agradecería la receta.

Pizarras Muro a Muro

Diseño de Interacción, Diseño de Interfaces, Experiencia de Usuario

Una de las cosas más útiles cuando uno está trabajando en equipo boceteando diagramas o realizando cualquier actividad de arquitectura de información o diseño de interacción, es una buena pizarra. Pero en la medida que las cosas se van complicando, y los diagramas crecen, las clásicas pizarras se hacen pequeñas. Por eso, desde hace tiempo que soñaba conpizarras gigantes, y eso es lo que armamos en la nueva oficina de Amable en Santiago. Son paneles de fibra de madera aglomerada de alta densidad con una cubierta lacada blanca, en dimensiones de 2,44 x 1,52 metros. Los invito a ver los resultados:

pizarra-01

Incluso una pizarra así de grande se hace pequeña a veces. Este es un panel completo adosado a la pared.

pizarra-02

Esta es una pizarra de dos paneles… y también está llena.

Además de lo simple, estos paneles son muy baratos, así que la única excusa para no armar algo así, es no tener suficiente espacio.

Desde la Mirada de los Niños

General

Hay cosas que uno escucha a veces involuntariamente y que hacen ver aquello a lo que uno está habituado de un modo completamente diferente. En particular, estos días me he encontrado con un par de joyas protagonizadas por niños.

Más Rápido por e-Mail

Unos días antes de navidad, mientras hacía la fila en un banco escuché a una mamá que comentaba lo que su hijo le había dicho: ¡Mamá, no le he escrito la carta al viejito pascuero, voy a tener que enviarle un e-mail que es más rápido!

Cuadraditos

Un poco de contexto para la segunda. Paty vocales es un personaje de un material educativo que usan en el jardín infantil de mis hijos. Yo les había mostrado el sitio web donde aparecen algunas canciones, pero los DVDs no los tengo. Pues bien, hoy en la mañana, mi hija de cuatro años me dice mientras yo hacía algo en el notebook: Papá, quiero ver Paty vocales en tu computador. A lo que yo respondo, Mi amor, ahora no podemos, no tengo Pati vocales aquí. Y ella: Sí papá, está en uno de los cuadraditos. Me tomó un momento entender que se refería a las ventanas del navegador.

cuadraditos-ventanas

Para mi hija las ventanas eran cuadraditos, yo sólo tenía que abrir un cuadradito para que ella viera lo que me pedía.

Es muy entretenido encontrar estas cosas que te hacen ver de un modo completamente diferente lo que para uno es cotidiano.

Diseño de Información y Disonancia Cognitiva

Diseño de Interfaces

Hace unos días en casa compramos un hervidor eléctrico de agua. El aparato funciona bien, hace lo que se supone que tiene que hacer: hervir agua. Sin embargo, cuando quise calentar agua para dos tazas grandes de té, algo así como 500ml, me llevé una sorpresa.

hervidor-02

El hervidor eléctrico en cuestión.

El hervidor tiene una zona translúcida que permite ver el nivel de llenado, y al costado, en vertical, tiene una serie de íconos pequeños de tazas con un número en su interior. Evidentemente es una escala que indica algo. El problema es que lo que indica es completamente ambiguo, porque existe una disonancia entre el ícono y la informaciónque busca entregar.

hervidor-01

Detalle del hervidor, donde se aprecia la escala que indica el nivel de llenado.

Desde abajo hacia arriba, hay 3 íconos de tazas con indicadores numéricos: 0,5 (MIN), 1,0 y 1,7 (MAX). Supuse que lo que se informa es la cantidad de tazas que corresponden al nivel de llenado. Pero la cantidad de agua para una taza era evidentemente demasiada. Lo que realmente busca informar es la cantidad de agua en litros.

El problema se origina en que el ícono de las tazas conduce a pensar una cosa, en circunstancias que se trata de otra. Si veo una taza asociada a un número, pienso que me indica cuántas tazas de agua contiene el hervidor. Este es un caso típico en que los íconos están siendo usados como elemento decorativo antes que informativo.

Esto es lo que en psicología se conoce como disonancia cognitiva. Según Wikipedia,disonancia cognitiva es:

(…) la tensión o desarmonía interna del sistema de ideas, creencias, emociones y actitudes (cogniciones) que percibe una persona al mantener al mismo tiempo dos pensamientos que están en conflicto (…)

En concreto, un sistema de información, los íconos que representan las tazas dispuestos verticalmente como una escala, indican tanto una forma de graduar (1, 1,7), así como uncontenedor (una taza de agua). En tanto el volumen de agua contradice la información aparente: lo que se indica como una taza, es claramente más que el contenido de una taza de agua. Lo que obtengo, entonces, es una información que contradice a otra, por lo que tengo que resolver la tensión en un acto consciente

Este ejemplo es algo simple y uno puede resolver la ambigüedad rápidamente, luego de un momento de atención. A lo peor, va a terminar con más o menos agua caliente de lo que se necesita. Pero cuando vemos este tipo de conflictos en sistemas más sensibles, como por ejemplo flujos de pago, procesos de compra o transferencias de dinero, la situación cambia.

La moraleja de todo esto es: los mensajes ambiguos o contradictorios pueden ser un elemento negativo e incluso provocar problemas serios en interfaces para procesos complejos, por lo tanto hay que cuidar que la información sea directa, precisa y sin ambigüedades.

Primer Número de Revista Faz

Diseño de Interacción

Luego de un esfuerzo enorme de los involucrados en el proyecto, Revista Faz ha salido a la luz con su número 1. Felicidades a Marcelo , Jorge y a todo el equipo.

revistafaz

Portada del primer número de Revista Faz.

La revista está dedicada al diseño de interacción y contiene artículos de divulgación y papers. En este número los temas son:

  • Especialización u homogenización en la interacción con software.
  • Interfaces e intuición.
  • Análisis del estado actual de los congresos de HCI.
  • Comparación entre la web chilena y la española.
  • Geoposicionamiento, comunidades e interfaces apropiadas.
  • Diseño de interacción en ATM’s.
  • Diseño de nuevos agentes virtuales en telefonía.
  • Diseño para prevenir el fraude.

La revista está abierta a recibir material para publicar, el que debe cumplir con una serie de pautas para asegurar la calidad y afinidad de los temas.

Faz está disponible para descargas en formato PDF de alta o baja resolución, aunque también es posible descargar artículos individuales.

Uno de los aspectos tal vez anecdóticos, pero que hablan del cuidado que se puso en su edición, es que este número está acompañado de trabajos de una artista norteamericana, Elise Milley, como la pintura que ilustra la portada, con la idea tender un puente entre los temas técnicos y científicos con los artísticos.

Normativas y Estándares para el Web: el Objetivo es la Gente

Accesibilidad, Estándares Web, Gobierno Digital

Leo en el blog de John Allsopp una reflexión que coincide mucho con comentarios que he escuchado repetidas veces por estos lados. John escribe un post titulado Accessibility is about people, not compliance, o La accesibilidad es acerca de la gente, no del cumplimiento, donde habla sobre el cumplimiento de las normativas y estándares y el objetivo de fondo para hacerlo.

Sucede que desde agosto de este año está vigente en Chile el Decreto Supremo 100 (D100), que establece una serie de normas para los sitios web del Gobierno, fundamentalmente sobre disponibilidad, estándares y accesibilidad básica. Por su carácter normativo, los sitios de Gobierno deben acatar y cumplir la norma, a diferencia de iniciativas anteriores como la Guía Web para los Sitios de Gobierno, que establecía recomendaciones y buenas prácticas.

Lo que me hace notar el post de John Allsopp es que he observado que se enfrenta el tema del D100 como el cumplir con la norma sin entender el alcance de ella. Un ejemplo, y tal vez el más notorio, es el del uso y la validación de HTML y CSS. El D100 indica que se debe utilizar HTML estándar y válido, el objetivo es que exista mejor interoperatividad, separar contenido de presentación, estructurar mejor el contenido. Pero algunos funcionarios, e incluso proveedores, lo perciben como que hay que validar, sin importar la calidad del HTML, porque es lo que pide la ley, por desconocimiento de la naturaleza de lo que se está normando.

Yo no digo que se deba descuidar la validación, pero es importante tener en cuenta que el objetivo es generar sitios de mejor calidad, no sólo aprobar formalmente los estándares. Y eso finalmente significa validar HTML porque se hizo un buen trabajo separando el contenido de la presentación, estructurando el contenido apropiadamente y no porque el objetivo fuera sólo validar.

Hasta la Vista Windows, Hola Ubuntu, 20 Días Después

General

Hace 20 días decidí abandonar Windows Vista y comenzar a usar Ubuntu Linux, versión Feisty Fawn. No me arrepiento ni por un minuto. Ubuntu no se ha interpuesto en mi camino, mi productividad no se ha visto afectada (no por Ubuntu al menos) y mi felicidad es evidente. El tema es polémico y como se puede ver en los comentarios, no soy el único que ha sufrido con Vista. Pero hice el cambio y estoy muy contento.

Aplicaciones

El sistema ya está adaptado a mis preferencias, tengo las aplicaciones instaladas e incluso hice algo que hace mucho tiempo no hacía, bajé un par de juegos. Todo anda de lujo. Para los interesados (Jorge preguntaba qué aplicaciones estaba usando, disculpas por la demora) les cuento qué tengo en mi menú:

  • El correo electrónico lo estoy gestionando con Evolution, en lugar de Thunderbird que era mi preferido por años, esto básicamente porque el calendario está mejor integrado
  • La mensajería instantánea sigo manejándola con Gaim/Pidgin y con Skype, que tiene una versión para Linux que sólo está un poco más atrás que la de Windows
  • La ofimática sigo manejándola con Openoffice, sin ningún traspié, tal como lo hago desde hace al menos tres años
  • Mi navegador preferido es Firefox y viene instalado con Ubuntu
  • Como mencionaba en el post original, para los gráficos necesito Fireworks, Gimp requiere de demasiada vocación, por llamarlo de algún modo. Todo está solucionado con Wine, Fireworks funciona tal cual como en Windows, para bien o para mal.
  • En estos días cada vez tengo que meter las manos al código, sea PHP, HTML o CSS, pero para las excepciones estoy usando Screem
  • Tomboy ha sido una sorpresa interesante. Es una libreta de notas que utiliza un formato de wiki para editar, es un buen reemplazo de los clásicos .txt con Notepad
  • En la nota algo trivial, Enemy Territory corre de lujo y Battle for Wesnoth está muy entretenido

Lo Malo

Como no todo en el mundo puede ser perfecto, hay un par de cosas que aún no logro ajustar. Mi notebook es un Sony Vaio y el manejo de poder de Ubuntu en modo de baterías no es de lo más efectivo. El rendimiento de las baterías es bajo y muy irregular y no parece ajustarse apropiadamente al modelo que uso. Eso es todo de lo que me puedo quejar.

Mi Recomendación

Ubuntu me ha funcionado muy bien, más que versiones anteriores que instalé y que otras distribuciones en al menos tres notebooks. Fedora, Suse y Mandrake (cuando aún se llamaba así) todos resultaban más complejos de usar o presentaban más problemas. La más reciente versión de Ubuntu, Feisty Fawn, ha superado mis expectativas con creces y la recomiendo si se dan las siguientes condiciones (de modo excluyente, es decir, una o la otra):

  • Tienes espíritu geek y no le temes a entrar de vez en cuando al terminal, de hecho, hasta alimenta tu ego
  • No eres un usuario/a técnico/a, pero alguien en la casa/oficina te puede ayudar, tal como cuando tienes que instalar una impresora en Windows

El clásico argumento de tengo un par de aplicaciones en Windows que me retienen para pasarme a Linux no es tan efectivo con Wine, eso al menos me ha funcionado a mí.

Esto es lo que les puedo contar de la transición de Windows Vista a Ubuntu, luego de veinte días.