Archivo de Categoría «Diseño de Interacción»

Captura de pantalla de una vista de Mailchimp

Patrones de interacción y trends

Diseño de Interacción, Diseño de Interfaces, Usabilidad

Hace unos días leía en «8 habits of veteran UX designers» en The Next Web, un párrafo que me llamó la atención. Se trata de la importante distinción entre patrones de interacción y tendencias.

(…) it can be difficult to discern a trend sneaking into mainstream design when it becomes ubiquitous. Overtime, popular trends have potential to morph into established patterns, but that isn’t always the case.

8 habits of veteran UX designers

La diferencia entre patrones de interacción y tendencias es clave. No distinguirlos correctamente puede ser el origen de importantes problemas en la usabilidad de un sitio o sistema.

La diferencia entre patrones de interacción y tendencias

Un  patrón de interacción es una solución comprobada —no sólo por uso, sino por observación, comprobación y documentación—, para un problema común en la interacción entre un usuario y una interfaz. Se puede tratar de un patrón para una interacción simple —como el menú de rastros— o de una interacción compleja —como la reserva de vuelos u hoteles.

Una tendencia —o trend— es una moda, una práctica relativamente extendida, que no necesariamente resuelve un problema, pero que es adoptada por razones estéticas, por disponibilidad —es de fácil acceso— o por la creencia, no necesariamente justificada, de que resuelve un problema —¿carrusel, me escuchas?

La adopción irreflexiva de tendencias puede introducir nuevos problemas, en lugar de resolverlos, pero también es posible que una tendencia que resuelve problemas reales se convierta en un patrón.

En general, existe coincidencia en las ventajas del uso de patrones de interacción, así como muchos patrones documentados y librerías, pero eso no es garantía de que estén libres de tendencias que aún no se han consolidado como patrones.

Lo recomendable, finalmente, es tomar cada uno de estos elementos —patrones y tendencias— con una pausa para distinguir cuál es el problema que buscan resolver y, en lo posible, probar con usuarios si efectivamente los resuelven.

(Imagen principal: patrones de interacción de MailChimp)

Breve reseña del concepto Experiencia de Usuario

Arquitectura de Información, Diseño de Interacción, Diseño de Interfaces, Experiencia de Usuario, Usabilidad

Comencemos por lo primero: ¿qué es Experiencia de Usuario? Aunque se puede definir desde diferentes perspectivas, podemos decir que se trata de un enfoque en el diseño de productos —en gran medida digitales, aunque no restringido a ellos— que se basa en la investigación de las necesidades y comportamiento de los usuarios para crear productos que, a la vez de ser funcionales, generan satisfacción en sus usuarios.

El concepto de Experiencia de Usuario —o User Experience, en inglés—, es relativamente nuevo. Digo relativamente, porque su uso extendido se observa recién desde los últimos 10 años.

El término, sin embargo, tiene una historia más extensa. Ya a mediados de los ’90 Donald Norman, mencionaba la «Experiencia de Usuario» y la describía como la forma en que

(…) cover some of the critical aspects of human interface research and application.

cubrimos algunas de los aspectos críticos de la investigación y aplicación de la interfaz humana.

What You See, Some of What’s in the Future, And How We Go About Doing It, Don Norman, Jim Miller, Austin Henderson

Esto como parte de los debates de CHI ’95 y en relación a su trabajo en Apple.

Otro hito relevante es la publicación en 2002 de «The elements of user experience» —Los elementos de la experiencia de usuario—, de Jesse James Garrett, que ordena la serie de disciplinas que se relacionan con la experiencia de usuario y lo visualiza en un conocido diagrama (PDF).

elements-of-user-experience

Pero no fue sino en 2005 cuando el concepto de User Experience comienza a tomar vuelo por sí mismo. El contexto era el rebote luego del desastre de las «.com» y la emergencia de la llamada «Web 2.0».

De hecho, en 2005 Garrett acuña el concepto de «Ajax», parte central de la web 2.0 y Adaptive Path —de la que Garrett es co-fundador— organiza la primera UX Week. De ahí en adelante, la UX fue mainstream.

IMG_1312

UX week de 2005, foto © Jared Spool

Quizá la señal más potente de lo que el concepto UX traía a la industria, fue el reconocimiento de la Usability Professionals Association —UPA—, una de las organizaciones profesionales con un perfil más académico, que en 2012, luego de una extensa y compleja discusión extensa, cambia su nombre a User Experience Professionals Association, UXPA.

Esto fue polémico y causó la irritación de las otras asociaciones y disciplinas profesionales, que acusaron a la UXPA de oportunismo, de monopolizar un concepto que incluía también a los profesionales de la Arquitectura de Información o el Diseño de Interacción.

Hubo reacciones indignadas de notables miembros de la comunidad, como Louis Rosenfeld, con su respuesta a la «Carta abierta a la comunidad de Experiencia de Usuario», con que Rich Gunther, Presidente de UPA a la fecha, anunciaba el cambio a UXPA.

Pero el concepto continuó extendiéndose, al punto que hoy es un concepto establecido y parte de la descripción laboral de muchos profesionales y equipos.

Al día de hoy, ya es un nombre establecido, difundido y, hasta cierto punto, comprendido por practicantes y clientes.

La pregunta de rigor es: ¿por qué «User Experience» se impuso por sobre las etiquetas previamente existentes? Creo que son dos las razones principales:

  • La facilidad de comprender un proceso más completo, en el que convergen diferentes disciplinas, con un concepto unificador;
  • Desde una perspectiva comercial, la facilidad de comunicar un concepto claro, con resultados concretos.

Un proceso unificado

Hasta antes de asimilar masivamente el concepto de UX, hablábamos de usabilidad, arquitectura de información, diseño de interacción, diseño de interfaces, diseño visual, etc. Si bien existen diferencias entre las diferentes disciplinas, el tener una visión unificada del resultado, y una cierta visión sobre el proceso, tiene ventajas. Ha contribuido a entender que cada disciplina aporta al resultado, y que el resultado es mucho más que sólo la suma de las disciplinas.

Un término fácil de comunicar

Hasta antes de que se acuñara y se asimilara la UX como concepto, abundaban los nombres para describir procesos y resultados similares. Pero la confusión para los clientes era grande. Y el esfuerzo para intentar explicar lo que proponías a un cliente, era mayor.

De hecho, las etiquetas para las descripciones laborales reflejaban esa confusión: podías ser un Arquitecto de Información, Experto en Usabilidad o Diseñador de Interacciones, pero en la práctica hacías lo mismo, o cosas muy similares. O las hacías todas en diferentes momentos.

En suma, el concepto de Experiencia de Usuario ha venido a resolver un clásico problema de significante y significado, en el que teníamos un contenido —las disciplinas, métodos y procesos—, pero no había un denominador que facilitara su comunicación.

UX ha facilitado eso. Claro, ahora surgen otros problemas, como la de-significación del concepto —ya se quejaba de ello Norman en 2007 en una entrevista con Peter Merholz— o la trivialización de la práctica, pero esas son otras batallas.

API de Notificaciones, Facebook y experiencia de usuario

Diseño de Interacción, Experiencia de Usuario

HTML5 pone a disposición una serie de API que permiten mejorar la experiencia de usuario, agregando funcionalidades que hasta hace poco sólo estaban disponibles para aplicaciones nativas en móviles.

Geolocalización y notificaciones son ejemplos de ellas. Si embargo, requieren de aprobación del usuario para hacerlas disponibles a cada sitio. Eso está bien, es protección de la privacidad, nadie quiere que un sitio registre indiscriminadamente su posición sin una autorización de por medio.

En el caso de las notificaciones, para algunos sitios web es un muy buen complemento contar con la posibilidad de agregar avisos nativos del sistema. Si usas Gmail, probablemente has autorizado el uso de notificaciones de escritorio, con lo que ya te has familiarizado con la funcionalidad de esta API.

Todo esto, para comentar un muy buen ejemplo con el que me crucé hoy, de manejo de las preferencias de notificaciones. La cosa va así: para poder mostrar notificaciones, un sitio debe pedir autorización al usuario. Este proceso lo maneja el navegador, junto con las preferencias para revocar o aprobar el permiso. Como cada navegador lo maneja de modo diferente, es complejo soportar estos flujos.

Pero Facebook lo maneja de modo muy interesante.

Manejo de preferencias de notificaciones

En primer lugar, si rechazas que el sitio utilice notificaciones, Facebook muestra un mensaje justo bajo el candado de la URL —esto al menos en Chrome—, informando que puedes modificar las preferencias de uso de notificaciones desde este lugar.

preferencias-notificaciones

Si pinchas el candado asociado a la barra de ubicación, el navegador despliega las preferencias de privacidad, entre las cuales se encuentran los permisos, uno de ellos corresponde a Notificaciones.

En suma, si vas a usar las API de notificaciones o de geolocalización, cuida estos detalles, que son una parte importante de la experiencia de usuario.

Modelos Mentales, Proyectores y Candidatos Presidenciales

Diseño de Interacción

Hace un par de semanas fui a un seminario sobre Modernización del Estado y Democracia Digital, en el que participaron un par de tempranos pre-candidatos presidenciales (digo, si consideramos que falta más de un año y medio para las elecciones presidenciales en Chile). Todo esto es más bien materia del blog de e-Gobierno de Amable (que en gran medida es responsable del estado de abandono de este blog), pero lo que me llamó la atención fue un detalle peculiar, que sí tiene que ver con interfaces. La anécdota se las cuento ahora.

La apertura del seminario estuvo a cargo de uno de los precandidatos, Sebastián Piñera, quien utilizó un presentación en PowerPoint para apoyar su discurso. Tras de él, un proyector dibujaba las diapositivas en un enorme telón. El personaje en cuestión tenía un control remoto en su mano, que tenía como objetivo manejar el paso de las diapositivas. Aquí viene lo interesante: un problema de modelos mentales.

pinera

El pre-candidato presidencial Piñera en el momento en que intenta resolver su conflicto con el control remoto.

El señor Piñera para cambiar de página apuntaba el control remoto al telón, en lugar del portátil que contenía la presentación. Evidentemente la lógica es: quiero controlar lo que pasa en la proyección, por lo tanto apunto a donde está la proyección. El problema está en que el dispositivo no funciona de esa manera, lo que nos permite mirar el problema desde dos perspectivas:

  1. El conflicto entre el modelo mental que el usuario tenía en su cabeza y la forma en que el objeto funciona
  2. Las expectativas que uno pudiera tener de un personaje tan visible, que se vende como moderno y digital y sus aptitudes reales en el mundo digital.

El juicio de valor se los dejo a ustedes.

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.

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.