Una de las buenas practicas de diseño de interfaz de usuario, es que debe contemplarse desde todos los niveles del proyecto. Al principio del proyecto es necesario definir una estrategia y escoger unos lineamientos (guidelines) a seguir, incluyendo los visuales: colores, tipo de letra y tamaño. Adicionalmente, las buenas prácticas que se van a seguir sí o sí.
Es importante, en la interfaz de usuario (UI por su abreviatura en inglés), identificar 3 áreas:
- Forma: Lo que se ve, la organización de cada elemento de UI.
- Contenido: La información, como se muestra y se estructura el contenido, incluye texto y multimedia.
- Comportamiento: Lo que no se ve, el comportamiento del producto, como se comunica con el usuario, difícil de identificar pero no imposible. Ejemplo: que sucede al dar clic a un botón.
Cuando estas 3 áreas están muy bien balanceadas se puede mejorar la usabilidad del
producto. Clasificaremos las buenas prácticas en estas áreas:
Buenas prácticas de forma:
- Tener en cuenta la “postura” adecuada para la plataforma en la que se usa
- el producto.
- Remover elementos innecesarios… “Si quitas un elemento y todavía la
interfaz de usuario cumple su objetivo, no lo necesitas” - Consistencia en organización de los elementos… “Si no hay razón para
cambiar el orden, no es necesario hacerlo” - Si el botón tiene un icono sin texto… agrega un tooltip. “No siempre
entiendo los iconos… a veces necesito un mínimo de información
para aclararlo” - Hacer que los elementos interactivos se noten… “Si quieres que haga clic
que luzca clickable!”
Buenas prácticas de contenido:
- Buena ortografía… (y no soy la mejor en esto, pero vamos aprendiendo) y que este bien escrito.
- Ser consistente en estilo y en uso de etiquetas y términos. “Hey! Háblame de tu o de usted pero no mezcles ambos”
- El texto debe ser claro, informativo y oportuno… “Dame un ejemplo a tiempo en vez de mostrar un error después”
- Evita palabras negativas, escribe oraciones afirmativas señalando cual es la condición correcta en vez de resaltar la incorrecta.
- No ofuscar con elementos multimedia… “Si vas a agregar un elemento multimedia… que sea informativo y no decorativo”
Buenas prácticas de comportamiento:
- Usar feedback visual para dar respuesta a una acción… “El usuario
- puede repetir la acción y llevarla a error… que sepa que sabemos
que presiono el botón” - Ojo con los elementos “touch” y “gesture”:
- No hay efecto “hover”
- Tener en cuenta la accesibilidad
- No afectar la visibilidad cuando el usuario va a alcanzar una acción
- No usar en exceso
- Una interfaz de usuario debe ser predecible
- ¿Dónde estoy?
- ¿Cómo llegue aquí?
- ¿Qué hago aquí?
- ¿Dónde puedo ir desde aquí?
- Si un proceso toma tiempo, usa indicadores de progreso o espera, también
se puede mostrar resultados poco a poco … “hay que hacer lo
posible por que el usuario no piense que es un problema de
desempeño” - Prevenir errores, valida cada campo según su tipo y su valor de negocio +
manejo de errores pero… “Por favor, no uses popups (Message
boxes) si no son necesarios”
Al final de un desarrollo de interfaz de usuario… pruébala! Si tienes un usuario potencial mejor, pero si no, te recomiendo un checklist que confirme que los lineamientos que escogiste al principio del proyecto estén. E itera, itera, itera…
Lo más importante es tratar a tu usuario con respeto, hacerlo sentir en control, que si el sistema hace algo el usuario lo sepa, apoyarse en su modelo mental de cómo funcionan las cosa, y recordar: tu trabajas en el producto digital pero el usuario es el que lo va a usar y es quien va a vivir las consecuencias.
Referencias
¿Qué otras buenas prácticas conoces?