Guía de construcción
Para construir un producto óptimo, necesitamos seguir varios lineamientos para facilitar la revisión hemos creado una lista de tareas relacionadas que cada proyecto debería seguir y cumplir a cabalidad. Puedes revisar la tabla de contenidos para más detalle. Nuestro sistema de diseño se estructura en un diseño atómico, el cuál suele ser bastante útil para poder jerarquizar interfaces complejas, con un gran número de interacciones y elementos. Esto ayuda a los desarrolladores a construir el código de una manera más limpia y clara. Además, ayuda a los diseñadores en la comunicación y a la hora de ubicar y controlar posibles cambios o problemas que puedan surgir cuando el diseño se está programando. El diseño atómico puede ser usado, también, en interfaces más sencillas ya que nos otorgará limpieza a la hora de ordenar los elementos usados.
Checklist Usabilidad
La Usabilidad es la medida de la calidad de la experiencia que tiene un usuario cuando interactúa con un producto o sistema. Esto se mide a través del estudio (test de usabilidad) de la relación que se produce entre las herramientas (entendidas en un Sitio Web el conjunto integrado por el sistema de navegación, las funcionalidades y los contenidos ofrecidos) y quienes las utilizan, para determinar la eficiencia en el uso de los diferentes elementos ofrecidos en las pantallas y la efectividad en el cumplimiento de las tareas que se pueden llevar a cabo a través de ellas.
Abordar la Usabilidad implica también revisar una serie de aspectos relacionados con el uso y la manera en que las personas se relacionan con los sistemas que se les ofrecen. Por lo mismo, se ha hecho necesario hacer una serie de comprobaciones de estos aspectos, mediante la revisión completa de la forma en que el espacio digital apoya a los usuarios en cumplir sus tareas en la mejor forma posible. Dicha revisión debe ser hecha a través de diferentes factores, entre los que se cuentan los siguientes:
Facilidad de aprendizaje: define en cuánto tiempo un usuario, que nunca ha visto una interfaz, puede aprender a usarla bien y realizar operaciones básicas.
Facilidad y Eficiencia de uso: determina la rapidez con que se pueden desarrollar las tareas, una vez que se ha aprendido a usar el sistema.
Facilidad de recordar cómo funciona: se refiere a la capacidad de recordar las caractersticas y forma de uso de un sistema para volver a utilizarlo a futuro.
Frecuencia y gravedad de errores: plantea la ayuda que se le entrega a los usuarios para apoyarlos cuando deban enfrentar los errores que cometen al usar el sistema.
Satisfacción subjetiva: indica lo satisfechos que quedan los usuarios cuando han empleado el sistema, gracias a la facilidad y simplicidad de uso de sus pantallas.
Checklist Experiencia del Usuario
Para definir el éxito en nuestra experiencia de usuario necesitamos revisar cada parte de nuestro producto. El testing de experiencia de usuario es el proceso de probar diferentes aspectos de la experiencia para determinar la mejor manera de entregar nuestra solución y mejorar la interacción que tienen los usuarios. Leer más aquí: UX testing
Útil: es necesario preguntarnos si nuestros productos y sistemas son útiles, y aplicar nuestro conocimiento para definir soluciones innovadoras que apoyan la utilidad.
Usable: corresponde a la facilidad de uso o Usabilidad sigue siendo un aspecto fundamental, necesario pero no suficiente, por lo que se debe complementar con las demás facetas.
Deseable: si bien los sitios deben ser eficientes, en particular con el uso de medios ms complejos (imágenes, sonidos, animaciones), esto se debe equilibrar con los demás valores del diseño emocional.
Encontrable: los Sitios Web deben ser navegables y permitir que los usuarios puedan encontrar lo que necesitan.
Accesible: los sitios Web deben ser accesibles a las personas con discapacidades (más de 10% de la población). Para los Sitios Web de Gobierno ya es un requisito normativo.
Creíble: la credibilidad es uno de los factores más importantes de tener en cuenta y por ello se deben revisar los elementos de diseño que afectan la confianza que nos tienen los usuarios.
Valioso: las facetas ayudan a determinar los aspectos que llevan a que nuestros sitios ofrezcan valor para nuestros usuarios.
Recomendaciones generales
Cada página debe llevar titulo y breadcrumbs
Los nombres de los menús de navegación deben ser descriptivos, no siglas.
Todas las tablas deben ser 100% de ancho.
Utilizar tooltips para los iconos del menu / left panel
Los botones de acción superiores e inferiores deben estar ubicados a la derecha de la página
Se deben respetar los estados en cada paso: por ejemplo el estado activo en el menú
Se debe seguir la elección de colores primarios para botones con acciones de avance (por ejemplo: guardar), secundario para acciones de retroceso (por ejemplo cancelar)
⬛ Link a el archivo de la librería de Figma
Tabla de contenidos