Presentación en Simposio de la Usma (2010)

1. Usabilidad en
Aplicaciones Web
Mejorando el diseño de la Interfaz de Usuario en las
aplicaciones web
Por: Elsa Canto

2. ¿Qué es la Usabilidad?

3. Usabilidad
Capacidad de una web, o
un producto cualquiera,
de ser usado fácilmente
lo que contribuye a una
Experiencia positiva en
el Usuario.
La Usabilidad, es un concepto central e inherente a la HCI (Human
Computer Interaction). El término es un anglicismo que significa
facilidad de uso, y cuya definición formal se refiere al grado de eficacia,
eficiencia y satisfacción con la que usuarios específicos pueden lograr
objetivos específicos, en contextos de uso específicos (ISO; 1994)

5. UX: Experiencia del
Usuario
La Experiencia del Usuario
es el conjunto de factores y
elementos relativos a la
interacción del usuario, con
un entorno o dispositivo
concretos, cuyo resultado es
la generación de una
percepción positiva de dicho
servicio o producto.

6. ¿Porqué es importante tomar
en cuenta la Experiencia del
Usuario al desarrollar
aplicaciones, interfaces,
sistemas, etc?

7. Beneficios de UX
Ayuda a desarrollar productos que el
usuario quiere y necesita
Ventaja estratégica para mejorar el
producto
Reduce los tiempos de desarrollo al definir
los requerimientos pensando en los
objetivos del negocio y necesidades del
usuario

8. Cosas que odian los
usuarios al usar una
aplicación web

9. Cosas que odian los
usuarios
Aprender a utilizar
nuevas funciones
Las acciones repetidas
Tener que esperar
Tener que buscar
Tener que leer

10. Cosas que odian los
usuarios
Diseño monótono o muy
recargado (“look & feel”)
Restricciones a otras
plataformas / browsers
Funcionalidad rígida
Errores
Brechas en la seguridad

11. 5 Retos de Usabilidad
en aplicaciones web
1. Escalabilidad
2. Diseño Visual
3. Comprensión
4. Interactividad
5. Manejo de Cambios

12. ¿Cómo podemos crear
una experiencia positiva
en el usuario?
Evaluación
Experta
Modelo UCD:
Diseño centrado
en el Usuario

13. Modelo UCD
Diseño Centrado en el Usuario
Busca responder a preguntas acerca del usuario, tareas y
metas, para así desarrollar y diseñar en torno al usuario.

14. Actividades
UCD
Diseño Centrado en el Usuario

15. Técnica del “Card
Sorting”
La técnica de 'card sorting'
se basa en la observación
de cómo los usuarios
agrupan y asocian entre sí
un número predeterminado
de tarjetas etiquetadas con
las diferentes categorías
temáticas del sitio web.
De esta forma, partiendo del comportamiento de los propios usuarios, es posible organizar y
clasificar la información de un sitio web conforme a su modelo mental.

16. Diseñar sin fundamento...

17. Diseño de Interface
Visual
Mejoras a la Interface Visual para
Aplicación Web de Dichter & Neira

18. Aplicación web
Retail Performance Tracker
Es una solución de Dichter & Neira que permite auditar los puntos de
venta (tienditas, supermercados, farmacias, etc) que maneja un fabricante
de consumo masivo en un mercado, con el objetivo de poder brindar
información relevante acerca de su distribución y las variables que puedan
afectar la misma (si hay producto visible en la tienda, si el producto tiene
su publicidad o material de comunicación implementado, si se cumplen
estándares del fabricante en el punto de venta, etc.)

19. Aplicación web
Retail Performance Tracker
Visualizar el nivel de penetración de su
producto y el de su competencia
Conocer niveles de presencia simultánea y
exclusiva en los diferentes canales
comerciales
Medir la efectividad de distribuidores y la
red de mayoreo

20. Retail Performance Tracker
Interface Visual (antes)

21. Retail Performance Tracker
Interface Visual (antes)

22. Retail Performance Tracker
Interface Visual (antes)

23. Retail Performance Tracker
Diseñando la nueva Interface Visual
Las pantallas a continuación muestran ubicación
del contenido y la navegación, al mejorar la
arquitectura ayudamos a que la aplicación sea más
clara y fácil de utilizar para el usuario final. Favor no
fijarse en colores, formas o iconografías ya que
estos serán creados en la fase de diseño visual.

24. Retail Performance Tracker
Diseñando la nueva Interface Visual

25. Retail Performance Tracker
Diseñando la nueva Interface Visual

26. Retail Performance Tracker
Diseñando la nueva Interface Visual

27. Retail Performance Tracker
Diseñando la nueva Interface Visual

28. Retail Performance Tracker
Diseñando la nueva Interface Visual

29. Retail Performance Tracker
Diseñando la nueva Interface Visual

30. 10 Guías de Usabilidad
en aplicaciones web
1. Haz las funciones obvias 8. Provee accesibilidad
2. Crea una jerarquía visual clara 9. Da importancia al diseño
del homepage
3. Sigue las convenciones, patrones
10. Se consistente
4. Evita utilizar textos innecesarios
5. Provee una navegación apropiada
6. Realiza pruebas de usabilidad
7 Provee toda la información que
.
puedas

31. Lecturas recomendadas

32. Gracias
www.enfoqueusuario.com
Twitter: javagial
Linked’In: Elsa Canto
E-mail: elsa@tokenstudio.com