Kambrica nos aportó gran valor al ayudarnos a ponernos en el lugar de los clientes e incorporar la lógica de UX en la transformación de nuestra forma de dar servicio.

Gerente Propuesta de Valor

Compañía multinacional de seguros y servicios financieros

* Este proyecto se presenta de forma anonimizada, en el marco de acuerdos de confidencialidad corporativa.

Cuando el proyecto entra a una reunión y sale convertido en una máquina de quemar presupuesto

Cuando una organización corporativa inicia un proyecto digital, el problema entra a una reunión y sale convertido en una estructura enorme de recursos, plataformas y meses de desarrollo. No porque sea realmente necesario, sino porque los incentivos de la industria están puestos ahí.

Las software factories facturan crecimiento del proyecto: más equipos, más horas, más complejidad. Nunca menos. En este caso, la organización empezaba las reuniones con una conclusión tomada: “necesitamos una App”. Los usuarios llamaban para consultar información de sus productos financieros y no utilizaban el sitio web existente, que “había quedado viejo”.

Ante este pedido, los comerciales de las agencias se frotaban las manos: “¡Claro que necesitás una App!”. Y tiene que ser para iPhone, Android y tablets. Con un backend moderno, QA, DevOps, múltiples equipos y varios meses de ejecución. En minutos, una idea se había transformado en un equipo de 12–14 personas.

Nosotros hicimos algo distinto: redujimos el problema antes de escalar la estructura. Porque ejecutar rápido la primer interpretación que se tiene del problema, no es agilidad: es desperdicio a gran velocidad. Y evitarlo, nos llevó tan solo una hora.

Una sola reunión alcanza para desenredar el proyecto

Aplicando nuestra metodología XDM (Experience Decision Making), trabajamos separando tres capas que en la mayoría de los proyectos aparecen mezcladas desde el inicio: hechos, interpretaciones, y propuestas de solución.

Ese análisis reveló un dato que nadie había considerado: la frecuencia de consulta de los usuarios estaba entre seis meses y dos años. Eso invalidaba la hipótesis de desarrollar una App: los datos mostraban que a los usuarios se les “llenaba” el teléfono cada tres meses… proponiéndoles eliminar las Apps que no usaban.

El proyecto tenía que contemplar entonces una primer etapa de investigación UX estratégica para entender por qué los usuarios rechazaban el sitio existente y preferían llamar. Sin esa información, cualquier iniciativa era una apuesta a ciegas.

El cliente pensaba que el sitio era “viejo” y “feo”. Quizás tenía razón. Pero las verdaderas respuestas estaban delante de las pantallas.

Mientras que la interfaz (UI) vive dentro de las pantallas, lo que los usuarios experimentan (UX) es lo que sucede delante de ellas.

Ese fue el foco de la investigación estratégica que en tan sólo dos semanas, reveló el problema de fondo: el sitio mostraba menos de la mitad de la información que los usuarios necesitaban para sus procesos de toma de decisiones. Por eso los usuarios llamaban.

La interfaz no estaba fallando por cuestiones tecnológicas o estéticas.
Sino porque no respondía las preguntas que tenían los clientes.

Algo que ninguna agencia se había propuesto atender, perpetuando la trampa de todo RFP.
Después de 4 a 6 meses, el cliente habría recibido exactamente lo que pidió. Pero que no era lo que realmente necesitaba.

Reducir complejidad e incertidumbre antes empezar la ejecución

Nuestra metodología parte de un hecho: los grandes proyectos no fracasan por razones técnicas. Fracasan porque las complejidades se revelan y atienden recién cuando toda la estructura ya está en movimiento.

Por eso trabajamos despejando complejidades de UX, institucionales y tecnológicas desde el inicio del proyecto.

Porque verdadera agilidad no es ejecutar apurados el primer plan que parece tener sentido: es tener la cintura para cambiar dirección cuando aparece nueva evidencia.

1. Complejidades UX: la distancia entre el Negocio y las personas

Para identificar y reducir esta distancia, trabajamos relevando procesos reales de toma de decisiones, entendiendo qué información necesitan los usuarios, cómo la interpretan, y a qué procesos o herramientas de soporte terminan acudiendo.

Eso permite redefinir la arquitectura de información, los criterios de visualización y las prioridades del producto antes de cristalizar decisiones de diseño UI y desarrollo.

2. Complejidades institucionales y políticas

En proyectos corporativos, gran parte del desgaste aparece cuando la solución ya está avanzada y comienzan los rechazos internos: branding, marketing, compliance, stakeholders.

Por eso desde el primer día, realizamos un mapa político de todas las áreas afectadas. Las incorporamos tempranamente en el proyecto en tracks paralelos, despejando todos los riesgos (tales como inconsistencias entre manuales y criterios internos) antes de que impacten en el proyecto.

Nuestro resultado son proyectos sin retrabajos políticos ni ciclos interminables de aprobación.

3. Complejidades IT: factibilidad técnica

En la industria de Banca, Finanzas y Seguros, existe una capa tecnológica crítica de sistemas legados, cuyos responsables deben estar involucrados desde el primer momento. En este caso, la cantidad de información financiera involucrada generaba esperas incompatibles con la experiencia que el producto necesitaba entregar.

Nuestra solución fue construir un motor de front-end inteligente y agnóstico, capaz de reutilizar información ya obtenida, reducir roundtrips innecesarios y realizar carga progresiva de datos sin bloquear la navegación y uso del sistema.

Eso permitió resolver performance sin degradar experiencia, ni sumar más arquitecturas a un stack de por sí sumamente complejo.

Resultados

Mientras las agencias proponían estructuras enormes y costosas para “cumplir con el pedido”, Kambrica superó los objetivos con un equipo reducido, foco estratégico y dirección clara.

Porque nuestros incentivos no están puestos en colocar gente ni vender horas, sino en resolver el problema correcto.

En este caso, el proyecto no necesitaba una App, ni una plataforma tecnológica de punta. Necesitaba entender qué estaba fallando entre la organización y sus clientes.

Sin diagnóstico y dirección, la velocidad solo escala el error.

La mayoría de las organizaciones no necesita más velocidad.
Necesita mejores diagnósticos antes de escalar estructuras, presupuesto y complejidad. Eso es lo que hacemos.

Si sos responsable del éxito de productos o proyectos y sospechás que el problema que tienen entre manos está siendo interpretado de forma incorrecta, hablemos.

Podemos ayudarte a verlo antes de que el costo, la complejidad y el riesgo político sigan creciendo.

La entrada Banca, Finanzas & Seguros se publicó primero en Kambrica.

Clase online para diseñadores en el marco del curso “Seniority UX“.

Una clase que los ayudará a aprender sobre una de las habilidades distintivas que debe tener un diseñador, saber presentar su trabajo frente a un cliente.

Veremos algunos tips sobre cómo prepararte antes, durante y después de una reunión. Cómo fundamentar tus decisiones, hacia donde enfocar la presentación y como comunicarte de manera efectiva con la audiencia.

A quién esta dirigido

Para diseñadores de todos los niveles y para leaders que quieran motivar e impulsar este skills para su equipo.

Te irás sabiendo

• Cómo prepararte para una reunión.
• Cómo comunicarte con tu cliente (ya sea interno o externo).
• Qué formatos usar en una presentación.
• Cómo presentar opciones de diseño.
• Cómo manejar las objeciones de la audiencia.
• Cómo recibir feedback.
• Cómo cerrar una presentación.

Al finalizar

Recibirás por mail el material de la charla. La presentación en PDF que se mostrará durante la misma y el video de los oradores presentando.

Oradores

Román Paparella, Product Designer en Kambrica.
Pamela Vanni, UX Lead en Kambrica.

¡Próximamente! Apertura de inscripciones

Si querés enterarte cuando esté abierta la convocatoria de inscripciones como parte del curso “Seniority UX“, escribinos un mensaje y te avisamos!

Gran charla sobre una temática que los diseñadores vivimos a diario y pocas veces, nos detenemos a analizar para encarar de una mejor manera. Muy interesante el enfoque, con ejemplos claros para una fácil comprensión. El modo de llevar adelante la charla, habla de una gran experiencia en el campo. ¡Espero ansioso nuevas charlas! Lucas de Recarga Pay.

La entrada Cómo presentar diseño se publicó primero en Kambrica.

Desde 2012 trabajamos junto a los equipos de Producto Digital del Grupo Telefónica diseñando y mejorando las experiencias de usuario web y móvil con las que interactúan millones de personas.

Ayudamos a mejorar la usabilidad de los procesos de compra de telefonía fija, móvil e internet para incrementar ventas, reducir llamados al call center y optimizar procesos. 

Trabajamos en el desarrollo de landings promocionales, mejoras en los procesos de atención al cliente y comunicación de productos y ofertas, mejorando la comprensión y captación de la propuesta de valor.

• Disminuimos los costos de soporte y redujimos la frustración de los usuarios.
• Ayudamos a mejorar la madurez en UX de los equipos de producto digital, con impacto en otras áreas de la compañía.

Cómo ayudamos

• Rediseñamos la home de telefonía fija y móvil.
• Mejoramos los flujos de navegación del sitio.
• Rediseñamos el flujo de compra de planes de telefonía móvil.
• Rediseñamos el flujo de compra de planes de Internet.
• Rediseñamos el flujo de compra de fibra y planes de TV.
• Diseñamos y mejoramos el impacto de landings promocionales: portabilidad, Hotsale, Multiplicate, día de la madre, del padre, etc.
• Mejoramos los procesos de descubrimiento, adquisición y upselling de líneas telefónicas, Internet y líneas móviles.
• Mejoramos los procesos de autogestión de grandes clientes.
• Mejoramos la calidad de la información de la sección Atención al Cliente.
• Análisis de usabilidad y necesidades de comunicación para el lanzamiento del rediseño de la app de Movistar.
• Análisis de usabilidad y propuestas de mejora accionables para procesos críticos de negocio.
• Análisis cualitativo y cuantitativo de la performance de páginas y flujos específicos.
• Creamos el primer manual de usabilidad para la compañía, permitiendo alinear a todas las áreas.
• Creamos herramientas para reducir costos y tiempos en procesos de toma de decisiones, diseño y desarrollo.
• Desarrollo de workshops con stakeholders para definir visión de producto, facilitar la toma de decisiones de producto y diseño.
• Capacitaciones sobre metodología Lean UX, diseño centrado en el usuario, Design Thinking.

La entrada Movistar se publicó primero en Kambrica.

El buen diseño es producto de buenas decisiones y excelente ejecución. Design Research comprende a las técnicas que informan a las decisiones de Diseño.

Lo que creemos saber … ¿es realmente válido? ¿O es sólo una colección de estereotipos y prejuicios? ¿Qué es lo que realmente necesitamos saber? ¿De quién podemos obtener esa información? ¿Cómo podemos obtenerlo sin contaminar la muestra?

Esta charla presenta las técnicas esenciales para responder a estas preguntas a lo largo del proceso de diseño. Desarrolla un caso real de aplicación de estas técnicas en un proyecto de rediseño de imagen institucional.

Temario

• Objetivos vs. Requerimientos.
• Los Objetivos encuadran decisiones de diseño. Design Research informa esas decisiones.
• Qué lugar tienen los requerimientos y por qué son problemáticos cuando no son resultado de un proceso de diseño previo.
• Proceso de diseño iterativo: las decisiones de diseño siempre abren nuevas preguntas.
• Dimensiones de métodos de Design Research: Cualitativo vs. Cuantitativo; Conductual vs. Actitudinal; Contexto de uso.
• Qué necesitamos saber? Validar lo que creemos saber que sabemos; Investigar lo que sabemos que no sabemos; explorar lo que no sabemos que no sabemos.
• Sujetos de investigación: ¿De quién podemos obtener qué información?
• Decisiones informadas en cada iteración vs. “estómago”. Involucrar al cliente en las decisiones y en el proceso de diseño.
• Caso: Jorge Frascara, Seguridad vial en Alberta (Canadá). Impacto de esa investigación 25 años después.
• Técnica #1: Procesar información disponible. Fuentes de información. Construcción de sentido: de Datos a Información, Conocimiento e Inteligencia.
• Técnica #2: Entrevista. Cómo evitar contaminar la muestra. 7 pasos desde la planificación hasta la obtención de insights. Cómo empezar a practicar. Entrevistas cualitativas, entrevistas contextuales, desarrollo de Arquetipos (Personas).
• Técnica #3: Mapeo. Características y posibilidades. Mapeo de requerimientos, Card sorting, mapeo improvisado.
• Caso real: rediseño de imagen institucional. Definición de objetivos. Primeras entrevistas. Ajuste de objetivos, definición de estrategia. Investigación de lenguaje de diseño: elementos característicos y lenguaje establecido en el mercado. Primeros prototipos: presentación y conclusiones. Exploración morfológica. Investigación de diseño: paletas de color. Exploración combinatoria. Iteración final y satisfacción de objetivos del proyecto.

Core Design

Core Design es una iniciativa de IxDA BA para el desarrollo de talleres y módulos teórico-prácticos, destinados a su incorporación en la formación universitaria de las carreras tradicionales de Diseño (Gráfico, Industrial, Multimedia, Indumentaria, Interiores, Arquitectura, etc).

“Design Research…” es el primer módulo creado dentro de esta iniciativa. Presentado en 2017 en Lamar University (Beaumont, TX USA), Universidad de Palermo (Buenos Aires) y Artmedia 2017 (Universidad Maimónides / Centro Cultural San Martín), brinda una introducción a fundamentos y técnicas de Design Research para estudiantes de Diseño Gráfico.

¿Querés proyectar tu UX Seniority?

¡Nuevo curso!

Seniority UX: Llevá tu carrera a otro nivel

Un curso para entender qué necesitás para proyectarte como UX Senior, y cómo lograrlo.

Conocé el temario y sumate!

La entrada Design Research: Cómo realizar las preguntas correctas para el proceso de diseño se publicó primero en Kambrica.

Mercado Libre había desarrollado y documentado una plataforma tan valiosa como compleja.

La documentación técnica producida era necesaria, pero no suficiente, para lograr adopción de parte de quienes desarrollaban, diseñaban e implementaban soluciones de e-commerce, parte vital de su ecosistema.

Era necesaria otra mirada.

Aplicamos técnicas de investigación cualitativa y cuantitativa para comprender los perfiles actitudinales involucrados, sus intereses y procesos de toma de decisiones, y estrategias apropiadas de comunicación.

Rediseñamos y validamos con usuarios reales la oferta de valor, landing pages, comunicación y navegación. Tomamos el diseño final y desarrollo front-end, siguiendo las definiciones de marca para asegurar que el producto final formara parte consistente de la plataforma.

Antes y Después

Áreas de trabajo

• Consultoría de UX, marketing y comunicación
• Entrevistas cualitativas
• Perfiles actitudinales (Personas)
• Diseño de propuesta de valor
• Arquitectura de información
• Redacción publicitaria
• Diseño de prototipos (Wireframes)
• Pruebas con usuarios
• Diseño visual
• Diseño Responsive
• Desarrollo front-end
• Metodología Lean UX

Resultados

• Mejoras de conversión.
• Reducción de los procesos explicativos sobre las herramientas disponibles.
• Mercado Libre obtuvo más leads que los proyectados.

La entrada Mercado Shops se publicó primero en Kambrica.

Además de desafíos técnicos particulares, el desarrollo de software para dispositivos táctiles y móviles requiere satisfacer necesidades y contextos de uso muy diferentes a las que se dan en entornos de escritorio.

Conocer estas dimensiones es esencial para lograr software que los usuarios finales puedan realmente aprovechar y valorar. Las guías oficiales de diseño de interfaces para cada plataforma son un paso indispensable, y a la vez son sólo la punta del iceberg.

Esta presentación muestra el proceso de diseño y desarrollo centrado en el usuario necesario para lograr buenos resultados.

La entrada UX Touch vs. Ouch! User Experience para dispositivos móviles se publicó primero en Kambrica.

En 2010 el banco Santander Río necesitaba migrar la solicitud de sus productos del canal físico al online. Hasta ese momento el pedido de tarjetas de crédito era un trámite que muy pocos clientes estaban dispuestos a realizar de forma online.

Los motivos: escasa confianza en el canal online y formularios que requerían datos que los usuarios no comprendían o no estaban dispuestos a completar.

Áreas de trabajo

Rediseñamos todos los formularios de contratación siguiendo buenas prácticas de usabilidad y accesibilidad.

• UX Research para evaluar los procesos existentes, motivaciones e intereses de los usuarios, oportunidades y áreas de mejora.
• Rediseño del proceso de contratación de tarjetas y paquetes bancarios siguiendo mejores prácticas de persuasión, usabilidad, accesibilidad y diseño responsive.
• Rediseño de sistemas internos de Gestión del Conocimiento
• Realizamos entrevistas con el Call Center para conocer mejores prácticas de venta, aplicadas a procesos de upselling.

La entrada Santander Río se publicó primero en Kambrica.

Realizamos un trabajo de rediseño y consultoría estratégica que tuvo como objetivos mejorar la interacción y el engagement de los usuarios y generar nuevos modelos de negocios.

Gracias a los insights logrados, se pudieron explotar nuevas fuentes de monetización: anuncios, descuentos, categorías y formas de pago sponsoreadas.

El proyecto es hoy caso de ejemplo en la incorporación de metodologías ágiles al proceso de diseño.

Problemática inicial

• El sitio había crecido de forma desorganizada a lo largo del tiempo: inconsistencia, problemas de mantenibilidad.
• Como producto de diseño autoreferencial, no se conocía el impacto real de muchas decisiones sobre la interfaz.
• Muchas ideas de mejora sin priorizar, de difícil aplicación dada la falta de consistencia y solidez del sitio.
• Nuevas amenazas en el mercado.

Antes y después

Plan general

Diseño y desarrollo en sprints

Se inició el proyecto con un sprint inicial (Sprint 0) de relevamiento del sitio, modelo mental de los usuarios, entendimiento del modelo de negocio, áreas de mejora y oportunidades.

Áreas de trabajo Sprint 0

• Análisis FODA y de analíticas.
• Revisión experta de usabilidad.
• Entrevistas cualitativas con usuarios.
• Proyección a futuro: brainstorming y exploración de hipótesis.

Las conclusiones del Sprint 0 alimentaron un plan de 3 sprints para trabajar –respectivamente– sobre lo urgente, lo importante y lo deseable.

Áreas de trabajo Sprints 1, 2 y 3

• Diseño de prototipos.
• Diseño visual.
• Pruebas de usabilidad.
• Ajustes luego de las pruebas.
• Desarrollo front-end.
• Cada sprint genera entregables.

El trabajo que hicieron es excelente. Estoy feliz!

Esteban Brenman, Fundador Guía Óleo

La entrada Guía Óleo se publicó primero en Kambrica.

Entre muchas otras cosas, este modelo me ha ayudado a entender cómo enfocar mi propia carrera. Cuando me encontraba en la facultad, parecía ser mejor diseñador quien dominara mayor cantidad de recursos estéticos impactantes… o al menos, ésa era la persona que recibía las mejores calificaciones. ¿Era ésa la única vara posible para medir el Diseño? ¿Era eso a lo que yo quería dedicarme? ¿O había otra búsqueda posible para mí?

En menor escala, este modelo me ha servido para identificar qué función debería primar en una pieza, y en dónde dedicar mayor esfuerzo. Por ejemplo, el problema… ¿es que la pieza es aburrida? ¿O tal vez el problema será otro?

Para poder entender cada función, veámoslas primero por separado:

• Cuando sólo está presente la función Información, tenemos datos en crudo.
• La función Presentación refiere a la expresión estética. En estado puro (sin transmisión de información ni permitir el uso), resulta en figuras, colores y movimiento que provocan una experiencia estética.
• La función Uso refiere a la posibilidad de interpretación y operación que la pieza permite a quien accede a ella. Un caso de la función uso en estado puro (sin transmisión de información ni expresión propia de la pieza), es un papel en blanco.

Como verán, ninguno de los ejemplos de cada función aislada, es un diseño. 

Eso es porque en este modelo, el Diseño resulta del encuentro de estas tres funciones, en mayor o menor proporción. Si sólo están presentes una o dos funciones, no es una pieza de diseño.

Veamos cómo agregando funciones, paso a paso, nos lleva a una pieza de Diseño, y a entender mejor el carácter que debe tener.

Agregando funciones, paso a paso: del dato al Diseño

Tomemos como punto de partida las siguientes series numéricas (el cuarteto de Anscombe):

( 10.0/8.04; 8.0/6.95; 13.0/7.58; 9.0/8.81; 11.0/8.33; 14.0/9.96; 6.0/7.24; 4.0/4.26; 12.0/10.84; 7.0/4.82; 5.0/5.68 ), ( 10.0/9.14; 8.0/8.14; 13.0/8.74; 9.0/8.77; 11.0/9.26; 14.0/8.10; 6.0/6.13; 4.0/3.10; 12.0/9.13; 7.0/7.26; 5.0/4.74 ), ( 10.0/7.46; 8.0/6.77; 13.0/12.74; 9.0/7.11; 11.0/7.81; 14.0/8.84; 6.0/6.08; 4.0/5.39; 12.0/8.15; 7.0/6.42; 5.0/5.73 ), ( 8.0/6.58; 8.0/5.76; 8.0/7.71; 8.0/8.84; 8.0/8.47; 8.0/7.04; 8.0/5.25; 19.0/12.50; 8.0/5.56; 8.0/7.91; 8.0/6.89 )

En este caso, acabamos de mostrar datos en crudo: sólo está presente la función información. Si presentamos estos datos en una tabla, permitimos cierta lectura de los datos, incrementando la función uso:

Y por último, la presentación visual de esta información, incrementa la función Presentación:

El empleo del formato correcto, nos permite ahora ofrecer conclusiones al usuario. No sólo es posible distinguir rápidamente que estas series son distintas: a primera vista, también se puede reconocer el carácter de cada una (dispersión, progresión lineal, etc).

Como contaba antes, es por el encuentro de las tres funciones que llegamos a una pieza de diseño. En este caso, por el balance de las funciones, se trata de una pieza de diseño de información.

El balance de funciones hace a una disciplina de Diseño

Cada disciplina de diseño se caracteriza por un balance y priorización particular de estas funciones. Por ejemplo, en el diseño publicitario prevalece la función de presentación, en el diseño editorial la información, y en el Diseño de Interacción y de Experiencia de Usuario (UX), el uso.

Es por esto que muchas veces, el diseño centrado en el usuario puede ser percibido como “aburrido” por quienes entienden al diseño como sinónimo de publicidad. Y es por esto que los esfuerzos de volver a UX más “visual”, más “disruptiva”, más… publicitaria, en definitiva, suelen partir de ignorar a la usabilidad como foco de UX, con los resultados esperables: la degradación final de la experiencia del usuario.

Este modelo nos permite entender que el espacio de diseño es limitado, y que no es posible “agregarle impacto” a una pieza de diseño: sólo es posible cambiar su carácter. La cuestión, entonces, es cuál es el carácter que el diseñador o el cliente buscan… y si ése es realmente el carácter que esa pieza debería tener para resolverle un problema real a sus usuarios reales.

Santiago Bustelo

La entrada Las tres funciones del diseño se publicó primero en Kambrica.

El acelerado acceso a la tecnología a través de PCs, notebooks, tablets y smartphones, entre otros dispositivos, ha dado origen a una nueva disciplina de gran importancia y no siempre explorada por los profesionales de la web: el diseño de interacción (IxD, por sus siglas en inglés).

En la charla se presenta un caso hipotético de creación de una aplicación en la que se repiten algunos de los problemas comunes a los que enfrentan diseñadores, programadores y emprendedores.

Se muestra cómo se resolvería el mismo encargo desde el diseño de interacción y tomando en cuenta la experiencia de usuario, exponiendo las diferencias de criterio y proceso, y la aplicación de un modelo cuantificado para comparar los resultados y lograr calidad.

La entrada Diseño Centrado en el Usuario: UX, IxD, usabilidad aplicada se publicó primero en Kambrica.

UX (Diseño de Experiencia de Usuario) y Diseño de Interacción, son nuevas disciplinas de diseño relacionadas con Diseño Industrial, Diseño Gráfico, Usabilidad e Ingeniería de Software.

En la charla se presentaron diferencias y puntos en común del Diseño de Interacción con el Diseño Gráfico y Diseño Industrial. Además, qué nuevas habilidades requieren los profesionales del diseño para desempeñarse dentro de estas disciplinas, técnicas y metodologías de trabajo específicas.

La presentación desarrolla cómo un programador, un diseñador visual y un diseñador de interacción resolverían el mismo caso de ejemplo, exponiendo las diferencias de criterio y proceso, y aplicando un modelo cuantificado para comparar los resultados.

Temario

UX y Diseño: definir cómo es, cómo funciona y cómo luce un producto digital

Disciplinas de diseño, entre lo abstracto y lo concreto: Diseño de Experiencias (UX), Diseño de Interacción (IxD): Define el modelo de operación de productos interactivos para lograr mejores experiencias para más usuarios.

Diseño de Interfaces: define los elementos concretos empleados en la interacción.

Diseño visual: Define lenguaje, carácter e identidad visual del producto.

Funciones del diseño: presentación, información, uso

Usabilidad: forma y función. La usabilidad de una interfaz es una medida de la efectividad, eficiencia y satisfacción con la cual determinados usuarios pueden alcanzar determinados objetivos en un entorno particular con dicha interfaz.
 (ISO 9241, Requerimientos ergonómicos para trabajo de oficina con terminales visuales, Parte 11 – 1997)

Un ejemplo de proceso de diseño aplicado a un caso

Producto: Software de administración de un videoclub. Nuestros personajes: Programador, diseñador, emprendedor.

• Enfoque del Programador:
  Tres entidades: Películas: Datos; Clientes: Datos; Alquileres: Relaciones. Operaciones: Alta, baja, modificación y consulta para cada entidad.
  
• Enfoque del Diseñador:
  Metáforas. Películas: DVDs; Clientes: Fichas; Alquileres: Ficha + DVD.
  Representación, Experiencia inmersiva, Fotorealismo.
  
• Enfoque del Emprendedor:
  Relevamiento competitivo, Definición del mercado, Especificación, Recursos y plan de trabajo.

Problemas comunes a estos enfoques: diseño sin intención / autoreferencial. El usuario final no participa del proceso. Proceso lineal. Falta de metodología. Falta de política de calidad.

Diseño y Usabilidad: siempre ocurren. A un producto no le “falta” diseño o usabilidad; en todo caso, su diseño o usabilidad son malos. Son atributos cualitativos intrínsecos al producto: Como la performance, no se pueden “agregar”. Son definidos por el elemento más débil y afectados por todos los que construyen el producto. Proceso lineal vs. Proceso convergente.

Incorporando UX a nuestro ejemplo

Filosofía de Diseño Centrado en el Usuario: Creación de productos que resuelvan necesidades concretas de sus usuarios finales, consiguiendo la mayor satisfacción y mejor experiencia de uso posible con el mínimo esfuerzo de su parte.

Proceso de Diseño Centrado en el Usuario: Conocer a fondo a los usuarios finales reales. Diseñar un producto que resuelva sus necesidades y se ajuste a sus capacidades, expectativas y motivaciones. Poner a prueba lo diseñado.

Caso Centrado en el Usuario: Proceso de diseño y desarrollo convergente e iterativo. Evaluación competitiva, identificación de oportunidades. Definición preliminar del modelo. Validación y ajuste del modelo con usuarios. Priorización y estrategia de versiones. Prototipado de la interfaz. Pruebas con usuarios y ajuste de prototipos. Metodología ágil. Pruebas de usabilidad y QA antes de cada lanzamiento.

Calidad y cuantificación. Modelo KLM-GOMS. Comparación de los ejemplos previos. Desarrollo de la solución desde principios racionales de diseño y criterio de aceptación. Proceso de exploración y puesta a prueba.

Conclusiones: No hay Experiencia de Usuario sin usuarios

No hay Experiencia de Usuario sin usuarios

Proceso iterativo de análisis y diseño centrado en la operación del usuario

Bases racionales, cuantificación, calidad

Obtener producto como resultado de un proceso, y satisfaciendo metas.

Charla presentada en:

• Microsoft Regional Architect Forum 2008
• Microsoft MIX 2008
• Día de la Usabilidad – Bogotá, Colombia, 2011
• UTN Tucumán, 2012
• Universidad de la Cuenca del Plata, 2013

Video (Día de la Usabilidad – Bogotá, Colombia 2011):

La entrada UX y Diseño de Interacción: Usabilidad aplicada se publicó primero en Kambrica.

Transcipción de la entrevista publicada por TN

SB: Cuando ponemos afip.gov.ar nos encontramos con… una página de error [“El URL solicitado no se puede conseguir”]. Y esa página de error sucede porque el sitio no está preparado para recibir la dirección sin “www” adelante. Antes de recibirte, el sitio ya te está declarando que está hecho de alguna manera y es tu problema resolverlo, no por una intencionalidad sino porque no se ha observado que eso podía suceder y se podía prever.

SB: A través de la web vemos “clave fiscal: ingrese aquí”. OK. Bien. Y si no sé lo que es “clave fiscal”? Solicite clave. OK… “clave fiscal”, además, es un nombre como… Oh… Parece que no anda.

SD: Sí, y acá se ve que fue a blanco.

SB: Todo blanco.

SD: Bueno esto es lo que le pasa todos los días a todo el mundo.

SB: Yo creo que cuando suceden estas situaciones es porque justamente no se conocen alternativas, porque no se conocen posibilidades. Recién conociendo posibilidades uno puede reconocer un problema.

SD: Hay una ley que dice que la accesibilidad web es la posibilidad efectiva de que el mayor número de personas accedan de manera satisfactoria una web y hagan uso de sus contenidos. Algo que evidentemente no pasa con la AFIP. Entonces, ¿por qué no se hace? ¿Por desidia, por dejar un sitio diseñado como si fuera en el 1990?

SB: Yo creo que es por falta de conocimiento. Yo creo que es por falta de ver alternativas. Tienen problemas tales que hacen que la gente termine acudiendo a terceros: contadores, hijos que lo ayuden a usar el sitio, nietos, lo que sea. O, terminan haciendo cola, volviendo al canal tradicional y a veces se encuentran, para peor, que el canal tradicional le dicen: “Tiene que entrar al sitio”. Entonces, entramos en un círculo donde el servicio no está ofrecido como servicio y no hay solución. Creo que todo organismo público tiene una responsabilidad hacia los ciudadanos. El estado somos todos, y si el organismo a cada persona que entra a hacer un trámite la obliga a pasar por una serie de situaciones que no son necesarias, que son confusas, que puede dar lugar a problemas y lo esté haciendo con todos los ciudadanos está efectivamente haciendo que el país invierta su tiempo en algo que no es productivo.

Clarín: expertos afirman que la web de AFIP es “poco amigable”

El diario Clarín hizo eco de la entrevista realizada por TN, su canal de noticias. En el artículo disponible en clarin.com sobre los problemas de usabilidad del sitio de la Administración Federal de Ingresos Públicos, recoge algunas partes de la entrevista que no llegaron al aire.

“Santiago Bustelo, consultor en experiencia de usuarios, afirma a Clarín que “la cultura del organismo recaudador se refleja en su sitio, porque está enfocado en brindar un sistema para operar y en menor medida en dar ayuda”.

“Y plantea algunos ejemplos: “El sitio tiene una forma de llamar a las cosas que al normal de la gente no le resulta razonable. Por ejemplo, ‘siradig’ es el nombre del trámite para desgravar ganancias; en vez de factura electrónica se llama ‘comprobante en línea’; el sitio entrega comprobantes de cuil o cuit con guiones pero después pide que se ingresen sin guiones”.

“Planteado como está ahora –dice Bustelo– resulta necesario recurrir a un experto. Porque la gente no logra cumplir con lo que se exige, en un tiempo razonable y sin errores. Y en vez de sentirse orgulloso de haber cumplido un deber ciudadano, cuando logra concluirlo, el usuario siente que por fin se terminó un calvario”.

La entrada ¿Por qué se cae la web de la AFIP? se publicó primero en Kambrica.

Wayra es la aceleradora de proyectos tecnológicos del grupo Telefónica, con presencia en 12 países de América Latina y Europa. Todos los años, selecciona un grupo reducido de startups a las que brinda financiamiento, espacio de trabajo y acceso a una red global de mentores, expertos e inversores.  

Dentro de su programa de aceleración, brindamos consultoría, mentoría y capacitación a las startups sobre metodología Lean UX, diseño UX, diseño centrado en el usuario, pruebas de usabilidad, entrevistas cualitativas, tests A/B, priorización de tareas, identificación de oportunidades de negocio y evaluación de la escalabilidad de las soluciones, entre otras.

Áreas de trabajo

• Brindamos consultoría a más de 35 startups que participaron de nuestro programa de formación en técnicas de UX y metodologías ágiles para el desarrollo de productos digitales.
• Trabajamos con startups de diferentes sectores, incluyendo fin-tech, med-tech, agro-tech, entretenimiento, marketplaces, apps, e-commerce, IoT y smart-cities entre otras.
• Mediante el programa “Lean UX” ayudamos a startups de diferentes industrias a identificar/refinar su propuesta de valor, entender a sus usuarios para ajustar el producto acorde a sus necesidades, mejorar la usabilidad de sus productos para captar más clientes, crecer de forma más consistente y reducir costos.
• Desarrollamos un proceso de trabajo iterativo mediante el cual cada startup pudo ir refinando su producto en cada iteración, agregando más valor para el negocio, sus usuarios finales y sus inversores

Su programa Lean UX ayudó a los emprendedores a testear en ambientes reales sus productos, generando servicios de calidad con menor tiempo de salida al mercado.

Lorena Suárez, Business Development Manager Wayra

La entrada Wayra se publicó primero en Kambrica.

El hipermercado Jumbo, perteneciente a la cadena Cencosud, necesitaba agilizar el proceso de compra online para aumentar las conversiones del sitio.

Diseñamos un nuevo proceso compra online que permitía presentar una mayor cantidad de productos de manera más atractiva y reconocible, facilitando la compra de múltiples artículos. Esto generó impacto positivo en la cantidad de artículos por compra y el ticket promedio.

Antes y después

Áreas de trabajo:

• Siguiendo una metodología de diseño centrado en el usuario, realizamos entrevistas contextuales para observar a los usuarios realizar la compra en su entorno habitual. Esto nos permitió identificar diferentes factores que generaban fricción durante el proceso de compra.
• En función de lo observado, realizamos un prototipo funcional, sobre el cual realizamos pruebas de usabilidad, para validar que el nuevo diseño satisfacía las necesidades de los usuarios

La entrada Jumbo a Casa se publicó primero en Kambrica.

Entonces… ¿cuál es la diferencia entre ellos? ¿Y por qué es importante conocer esa diferencia?

Diseño de Interfaces, o UI

Hace foco en el artefacto, o, dicho de otra manera, en lo que está dentro de la pantalla. Cuando uno diseña interfaces el problema que está resolviendo está en el diseño: selección y distribución de los elementos de la interfaz (ej. textos y campos del formulario), consistencia del diseño (con la plataforma, con otras pantallas), etc.

Es importante aclarar que Diseño de Interfaces no equivale a Diseño Gráfico: el diseño de la interfaz puede incluir o no diseño gráfico. Por ejemplo, cuando uno hace un wireframe está diseñando una interfaz pero no está aplicando diseño gráfico, y cuando uno aplica reglas de estilo a una interfaz está aplicando diseño gráfico pero no está diseñando una interfaz.

UI, hace foco en el artefacto. UX, en el usuario. IxD, en el contacto entre el usuario y el artefacto.

Experiencia de Usuario, o UX

Hace foco en el usuario y en la experiencia que se quiere lograr. UX se refiere a lo que experimenta el usuario antes, durante y después de interactuar con el artefacto.

Sin incorporar al usuario, no se puede hacer UX. Por eso, resulta fundamental en el diseño de la experiencia, comprender en primer lugar a los usuarios y sus verdaderas motivaciones y necesidades, considerar desde ese lugar qué interfaz, qué contenidos y qué interacciones lograrán el resultado buscado, y finalmente, validar con usuarios los resultados que produce la interfaz propuesta.

La validación se puede hacer de forma directa (pruebas con usuarios, entrevistas cualitativas, relevamiento de modelos mentales), o de forma indirecta (heat maps, A/B testing, click maps).

La diferencia entre validación directa e indirecta, no es solamente metodológica. La validación directa suele ser cualitativa, es decir, nos permite saber por qué los usuarios hacen lo que hacen, mientras que la validación indirecta nos muestra que es lo que hacen, pero no nos dice por qué. Por eso, es bueno validar en primer lugar la experiencia de forma cualitativa como “ajuste grueso”, y luego en forma cuantitativa para buscar el “ajuste fino”.

Diseño de Interacción, o IxD

Se trata de definir las formas de operar la interfaz (por ejemplo, si el ingreso de información o selección se produce mediante teclado, mouse, touch, o una combinación de ellos), los flujos de operación y las respuestas del sistema. En definitiva, pone el foco en el contacto entre el usuario y el artefacto.

¿Por qué es importante conocer la diferencia entre UI /UX / IxD?

Volviendo a la pregunta inicial,  hay dos respuestas:

• Por un lado, para que podamos comunicar con claridad lo que estamos haciendo, y qué alcance estamos tomando.
• Y por otro, para poder generar un lenguaje común con quien nos realiza el pedido. Si todas las partes entienden que Diseño de Interfaces (UI) no necesariamente implica Experiencia de Usuario (UX), tal vez tengamos la suerte de que ya no nos pidan que “le agreguemos UX a la pantalla”; y, si no somos tan afortunados, por lo menos sabremos hacer las preguntas necesarias para entender qué nos están pidiendo exactamente, y ayudar a reformular ese pedido en función de la verdadera necesidad.

La entrada UI, UX, IxD: ¿Cuál es la diferencia? se publicó primero en Kambrica.

Áreas de trabajo

• Análisis del Negocio
• Diseño de reporte
• Desarrollo de lenguaje visual
• Diseño de Información
• Diseño de Interacción
• Diseño de interfaz
• Evaluación de Usabilidad

En una primera instancia ayudamos a Keepcon en el rediseño de la plataforma de moderación. Trabajamos en el relevamiento de modelos mentales, análisis y mejora de procesos y operaciones.

En una segunda instancia, Keepcon desarrolló una plataforma de reportes estadísticos para sitios. El valor diferencial a comunicar, pocos datos requeridos para obtener información de los sitios y rapidez en el procesamiento de los datos.

El mayor desafío en este caso fue ayudarlos a definir y comunicar una oferta de valor sólida. Lograr la atención, reflejar confianza, credibilidad y efectividad de la herramienta. Generamos una solución para la landing de venta incorporando técnicas de Cold Reading. 

La entrada Keepcon se publicó primero en Kambrica.

Ante los excelentes resultados obtenidos para la nueva versión 3.0, el Consorcio SIU emprendió una versión intermedia 2.5 con menores requerimientos técnicos para facilitar la adopción.

Áreas de trabajo

• Realizamos entrevistas cualitativas con estudiantes usuarios del sistema para relevar problemas con la herramienta existente, necesidades y expectativas.
• En función de lo relevado rediseñamos el sitio, incluyendo: 
  • Arquitectura de Información
  • Diseño de Interacción
  • Diseño de interfaz
  • Pruebas con Usuarios.

La entrada SIU Guaraní se publicó primero en Kambrica.

¿Qué es el Diseño de Interacción? ¿De dónde venimos? ¿A dónde vamos?

En un principio, fue el bit:

Después, toda esa energía se compactó y surgió la interfaz.

Una aplicación, un sitio, se compone necesariamente de estos dos elementos. Aunque la interfaz no la haya hecho un diseñador, o el desarrollo no lo haya hecho un programador.

Esto al usuario no le importa. Al menos, no directamente.

La relación del usuario con la interfaz y el desarrollo, ocurre en un plano superior: la experiencia.

La experiencia, esta atmósfera que rodea la aplicación, tiene que tener la composición y densidad adecuadas. Sino, al usuario que aterriza sobre nuestra aplicación, le puede explotar la cabeza. El Diseño de Interacción busca lograr mejores experiencias para la mayor cantidad de usuarios, definiendo el modelo de operación de nuestros sitios y aplicaciones.

¿De dónde venimos?

El diseño de interacción tiene una larga pre-historia.

En 1968, Douglas Engelbart hace una demostración de tecnologías experimentales…

…el mouse, edición de texto, hipertexto, email y hasta videoconferencia.

Todas ellas, surgidas de su visión del futuro:la computadora potenciando la capacidad intelectual humana para lograr un mundo mejor.

Sobre esa visión, pioneros fueron construyendo paso a paso un modelo de interacción simple y coherente.

Un modeloen el que todas las aplicaciones usaban el mismo lenguaje de ventanas y menúes desplegables. Y se operaban bajo los mismos principios, compartiendo una serie de operaciones básicas, como copiar, pegar, deshacer.

Las aplicaciones de escritorio fueron montándose sobre este modelo unificado, y de a poco extendiéndolo.

Pero este modelo fue opacado y quedó una nebulosa…

…por la aparición de una nueva constelación en la que el usuario necesita bastante más esfuerzo en unir los puntos: las aplicaciones web.

En 1994, aparece la primer versión de Netscape. Las aplicaciones web surgieron sin poder tomar el modelo de las aplicaciones de escritorio, ni tampoco se había planteado un modelo alternativo. Se fue avanzando en esta conquista del espacio por prueba y error.

En el 2004, aparece Gmail, se establece AJAX y aparecen nuevas fronteras. Y en otro orden de cosas, se populariza el término “web 2.0”, signifique lo que signifique.

En todo este tiempo, en esta conquista del espacio, surgió la necesidad de diseñar el modelo de operación de las aplicaciones. Algo que antes sólo hacían unos pocos como Apple, Microsoft, Adobe… cada vez más gente lo estaba haciendo.

2003: se establece consenso sobre el nombre de la disciplina, “Diseño de Interacción”, y se forma la IxDA.Una asociación sin fines de lucro ni costo de membresía, dedicada a impulsar el profesionalismo, evangelismo, educación e innovación en el campo del Diseño de Interacción.

En febrero de 2009 organizamos la primer reunión del capítulo local, IxDA BA. Desde entonces estamos creciendo y tomando los desafíos que encontramos en la región.

¿Dónde estamos hoy? ¿Qué aprendimos en estos 40 años?

De la prueba y error, pasamos a la sistematización, en donde vemos qué funcionó y, lo más importante, por qué funcionó.

Y con eso, sabemos cómo condensar la nebulosa para generar nuevas aplicaciones con las experiencias que buscamos.

Hoy sabemos que conseguir el compromiso del usuario, el engagement, no depende de un atributo particular del diseño, el desarrollo o el modelo de negocios. Sino, de balancear en la interacción los desafíos con las habilidades del usuario, de manera de evitar la frustración (alto desafío, baja habilidad) y el aburrimiento (bajo desafío, alta habilidad). Y permitir al usuario transitar por esa franja del medio…

…que en inglés se llama “flow” y que podríamos traducir como “¡qué copado!”.

Ése es el mayor cumplido que podemos recibir emprendedores, programadores, diseñadores. No que la aplicación esté bien diseñada, bien programada, ni que tenga un buen modelo de negocios. Que está copada.

¿A dónde vamos?

El futuro del diseño, el desarrollo, los negocios en la web, ya está empezando a suceder.

Los desarrolladores (que empiezan del bit) y los diseñadores (que parten de la interfaz) estamos encontrando los conceptos y metodologías para dejar de chocar en el medio…

…y poder trabajar de manera coordinada, mejorando la experiencia en cada iteración.

En una escala mayor, nuestras aplicaciones van a ir formando un sistema con las demás. Miles de experiencias coordinadas por los mismos principios, mejorando la vida de las personas.

Ese es el futuro que tenemos por construir: diseño, desarrollo y negocios centrados en el usuario.

Los invito a sumarse a IxDA, ixda.com.ar.
¡Muchas gracias!

Santiago Bustelo

La entrada Hasta la web 2.0 y más allá se publicó primero en Kambrica.

La Oficina de Asuntos Judiciales de esta Universidad nos eligió por nuestra capacidad de proveer diseño y desarrollo que cumpliera con los estándares de la Sección 508: que fuera accesible a todas las personas, independientemente de sus capacidades técnicas, cognitivas o físicas. Esto le valió el reconocimiento del panel de expertos en el prestigioso Festival South by Southwest (SXSW) en el año 2004.

La arquitectura de información y recomendaciones para el enfoque de contenidos fueron realizadas considerando los casos de uso en que docentes y estudiantes deben consultar el site: temas delicados relacionados con infracciones al código de honor de la universidad, tales como plagio, abuso de sustancias o acoso sexual.

El desarrollo HTML/CSS no sólo permitió resolver con el mismo código situaciones de accesibilidad, sino que también fueron contemplados estilos especiales para diferentes resoluciones y para impresión, de selección automática al imprimir la página o generar PDFs.

Gracias a este enfoque responsive, la página se convirtió en el repositorio único de información oficial para todos los formatos, eliminando los problemas de mantenimiento de la información en múltiples formatos y requiriendo el personal responsable documentación y capacitación sobre una única plataforma.

Áreas de trabajo

• Consultoría
• Accesibilidad
• Arquitectura de Información
• Diseño de interfaces
• Desarrollo front-end
• Validación con usuarios con discapacidad

Declaración oficial de la Universidad de Stanford

Accessibility Design Recognition, SXSW Interactive 2004, Austin, Texas

At the SXSW Interactive 2004 Accessibility Shoot-Out, Judicial Affairs was selected for its commitment to ensure that people of all abilities using any Internet device can access this site.

Accessibility experts attending the panel included:

• John Slatin, Director – Accessibility Institute at the University of Texas
• Jim Allan, Webmaster – Texas School for the Blind and Visually Impaired
• Sharron Rush, Executive Director – Knowbility.org
• Giorgio Brajnik, Asst. Professor – University of Udine, Italy, Usablenet
• Rashmi Bhat, Business Manager – SBC

Each Stanford University website is required to meet the definition of a generally accessible Internet site, and ensure that web pages transform gracefully and remain accessible despite any physical, sensory, or environmental constraints or technological barriers.

To meet these accessibility objectives, the Judicial Affairs site was designed, monitored and tested for compliance with Web Content Accessibility Guidelines (WCAG 1.0), as published by the Web Accessibility Initiative of the W3C. The Judicial Affairs site also complied with the accessibility requirements of Section 508 of the federal Rehabilitation Act Amendments of 1998 (29 U.S.C. § 794d). See 36 C.F.R. Part 1194.

As with most assistive technology, changes made to accommodate those with a disability end up benefiting everyone. A web page that is designed with accessibility in mind will be better structured and more user-friendly.

La entrada Universidad de Stanford se publicó primero en Kambrica.