<ul><li>El diseño centrado en la experiencia del usuario y la usabilidad </li></ul>
HAGAMOS PEQUEÑOS EJERCICIOS…
¿Qué hace y por qué esta “online”…
 
¿A DAR INFORMACIÓN DEL CLIMA?
¡NO!  VENDE APARATOS ELECTRODOMÉSTICOS Y TECNOLOGÍA PARA EL HOGAR
¿Qué hace y por qué esta “online”…
 
¿A DAR NOTICIAS Y EVENTOS DE GOBIERNO?
¡NO!  ES UN PORTAL DE PARTICIPACIÓN CIUDADANA
¿Qué hace y por qué esta “online”…
 
¿FABRICA AVIONES?
¡NO!  VENDE ANILLOS DE NICKEL Y TITANIO
¿Qué tienen en común estas organizaciones?
No hubo planeación, ni estrategia de diseño
Además…
<ul><li>Invirtieron recursos económicos. </li></ul><ul><li>Hubo esfuerzo en la labor de diseñar una experiencia para sus c...
¿Qué fue lo que pasó?
<ul><li>No hay un seguimiento adecuado. </li></ul><ul><li>No se planeo en función de lo que se es importante para el clien...
Hacerlo adecuadamente se conoce como…   DISEÑO CENTRADO EN LA EXPERIENCIA DEL USUARIO … y no es algo nuevo.
En 1990 Donald Norman definió que…
“ El diseñador debe conducir sus actividades teniendo en cuenta a la persona, en lugar de pensar sobre las posibilidades t...
Los problemas….
<ul><li>El diseño de experiencias interactivas: </li></ul><ul><ul><li>No es planificado </li></ul></ul><ul><ul><li>Persigu...
 
<ul><li>¿Dónde empieza  </li></ul><ul><li>la experiencia  </li></ul><ul><li>del usuario? </li></ul>
El modelo causal
Ricardo Baeza-Yates Director de Yahoo Research Latin America Encuéntrame, descárgame y úsame. Déjate luego seducir  y vuel...
Ubicuidad:  findability ¿Cómo buscarían esta empresa? www.kelvin.com.mx
1 2 3 ? Ubicuidad:  visibilidad
Necesidades reales Necesidades esperadas Diseño Ubicuidad Arquitectura de  Información Uso Usabilidad Minería de Uso
www.cemexmexico.com Arquitectura de información:  contenido y estructura
Necesidades reales Necesidades esperadas Diseño Ubicuidad Arquitectura de  Información Uso Usabilidad Minería de Uso
Minería de uso
¿Qué es la usabilidad?
“ La usabilidad se refiere a la  capacidad de un software de ser comprendido, aprendido, usado y ser atractivo  para el us...
“ Usabilidad es la  eficiencia y satisfacción  con la que un producto permite alcanzar  objetivos específicos  a  usuarios...
“ La usabilidad es un  atributo de calidad  que asegura la  facilidad de uso  en las interfaces de usuario.  También se re...
Atributos de la usabilidad
Facilidad de aprendizaje www.sat.gob.mx
Facilidad de aprendizaje Internet Explorer Mozilla Firefox Netscape Navigator
MSN Messenger Skype Eficiencia
Retención sobre el tiempo 2005 2006 2007 2009
www.useit.com Tasa de error de los usuarios
Satisfacción subjetiva www.hotmail.com www.gmail.com
Transformación del diseño web
Diseño centrado en la compañía
Diseño centrado en la tecnología
Diseño centrado en el diseño
Diseño centrado en la experiencia del usuario
Necesidades del Usuario Objetivos del Sitio Necesidades a partir de la investigación de los usuarios (Demo / Etno / Psicog...
Necesidades del Usuario Objetivos del Sitio Especificaciones Funcionales Requerimientos de Contenido Funcionalidades y her...
Necesidades del Usuario Objetivos del Sitio Especificaciones Funcionales Requerimientos de Contenido Diseño de Interacción...
Necesidades del Usuario Objetivos del Sitio Especificaciones Funcionales Requerimientos de Contenido Diseño de Interacción...
Necesidades del Usuario Objetivos del Sitio Especificaciones Funcionales Requerimientos de Contenido Diseño de Interacción...
Metodología
<ul><li>Etnografía/Antropología </li></ul><ul><li>Psicología congnitiva </li></ul><ul><ul><li>Persuación </li></ul></ul><u...
<ul><li>Ingeniería de requerimientos </li></ul><ul><ul><li>Qué espera el cliente </li></ul></ul><ul><li>Mercadotecnia </li...
<ul><li>Aspectos sociales y cognitivos </li></ul><ul><ul><li>Antropología </li></ul></ul><ul><ul><li>Etnografía </li></ul>...
<ul><li>Evaluaciones de usabilidad </li></ul><ul><ul><li>Inspecciones y heurísticas </li></ul></ul><ul><ul><li>Pruebas con...
<ul><li>Arquitectura de información </li></ul><ul><ul><li>Sistemas de navegación </li></ul></ul><ul><ul><li>Sistemas de or...
<ul><li>Diseño de interfaces </li></ul><ul><li>Diseño de navegación </li></ul><ul><li>Diseño de información </li></ul><ul>...
<ul><li>Diseño   visual </li></ul><ul><ul><li>Tipografías </li></ul></ul><ul><ul><li>Colores </li></ul></ul><ul><ul><li>Íc...
Fuente: The Future of Wireframes de  Information Architects Inc.
Upcoming SlideShare
Loading in...5
×

Usabilidad y diseño centrado en la experiencia del usuario

7,825

Published on

Introducción a la usabilidad presentando la relación con el diseño centrado en el usuario. Se muestran ejemplos que indican los elementos relevantes de cada concepto

Published in: Design, Technology
1 Comment
17 Likes
Statistics
Notes
No Downloads
Views
Total Views
7,825
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
0
Comments
1
Likes
17
Embeds 0
No embeds

No notes for slide

Transcript of "Usabilidad y diseño centrado en la experiencia del usuario"

  1. 1. <ul><li>El diseño centrado en la experiencia del usuario y la usabilidad </li></ul>
  2. 2. HAGAMOS PEQUEÑOS EJERCICIOS…
  3. 3. ¿Qué hace y por qué esta “online”…
  4. 5. ¿A DAR INFORMACIÓN DEL CLIMA?
  5. 6. ¡NO! VENDE APARATOS ELECTRODOMÉSTICOS Y TECNOLOGÍA PARA EL HOGAR
  6. 7. ¿Qué hace y por qué esta “online”…
  7. 9. ¿A DAR NOTICIAS Y EVENTOS DE GOBIERNO?
  8. 10. ¡NO! ES UN PORTAL DE PARTICIPACIÓN CIUDADANA
  9. 11. ¿Qué hace y por qué esta “online”…
  10. 13. ¿FABRICA AVIONES?
  11. 14. ¡NO! VENDE ANILLOS DE NICKEL Y TITANIO
  12. 15. ¿Qué tienen en común estas organizaciones?
  13. 16. No hubo planeación, ni estrategia de diseño
  14. 17. Además…
  15. 18. <ul><li>Invirtieron recursos económicos. </li></ul><ul><li>Hubo esfuerzo en la labor de diseñar una experiencia para sus clientes/usuarios. </li></ul><ul><li>Son organizaciones medianas o grandes. </li></ul>
  16. 19. ¿Qué fue lo que pasó?
  17. 20. <ul><li>No hay un seguimiento adecuado. </li></ul><ul><li>No se planeo en función de lo que se es importante para el cliente/usuario. </li></ul><ul><li>No se evaluó la experiencia y percepción del cliente/usuario. </li></ul>
  18. 21. Hacerlo adecuadamente se conoce como… DISEÑO CENTRADO EN LA EXPERIENCIA DEL USUARIO … y no es algo nuevo.
  19. 22. En 1990 Donald Norman definió que…
  20. 23. “ El diseñador debe conducir sus actividades teniendo en cuenta a la persona, en lugar de pensar sobre las posibilidades tecnológicas o sus propios gustos”
  21. 24. Los problemas….
  22. 25. <ul><li>El diseño de experiencias interactivas: </li></ul><ul><ul><li>No es planificado </li></ul></ul><ul><ul><li>Persigue modas </li></ul></ul><ul><ul><li>No se utilizan las herramientas correctas </li></ul></ul><ul><ul><li>No tiene un seguimiento adecuado con personas preparadas </li></ul></ul>
  23. 27. <ul><li>¿Dónde empieza </li></ul><ul><li>la experiencia </li></ul><ul><li>del usuario? </li></ul>
  24. 28. El modelo causal
  25. 29. Ricardo Baeza-Yates Director de Yahoo Research Latin America Encuéntrame, descárgame y úsame. Déjate luego seducir y vuelve a mí una y otra vez. Yo por mi parte usaré mucho, mucho sentido común y trataré de sorprenderte cada día. “ ”
  26. 30. Ubicuidad: findability ¿Cómo buscarían esta empresa? www.kelvin.com.mx
  27. 31. 1 2 3 ? Ubicuidad: visibilidad
  28. 32. Necesidades reales Necesidades esperadas Diseño Ubicuidad Arquitectura de Información Uso Usabilidad Minería de Uso
  29. 33. www.cemexmexico.com Arquitectura de información: contenido y estructura
  30. 34. Necesidades reales Necesidades esperadas Diseño Ubicuidad Arquitectura de Información Uso Usabilidad Minería de Uso
  31. 35. Minería de uso
  32. 36. ¿Qué es la usabilidad?
  33. 37. “ La usabilidad se refiere a la capacidad de un software de ser comprendido, aprendido, usado y ser atractivo para el usuario, en condiciones específicas de uso” ISO/IEC 9126
  34. 38. “ Usabilidad es la eficiencia y satisfacción con la que un producto permite alcanzar objetivos específicos a usuarios específicos en un contexto de uso específico ” ISO/IEC 9241
  35. 39. “ La usabilidad es un atributo de calidad que asegura la facilidad de uso en las interfaces de usuario. También se refiere a los métodos empleados en el proceso de diseño para mejorar la facilidad de uso” Jakob Nielsen
  36. 40. Atributos de la usabilidad
  37. 41. Facilidad de aprendizaje www.sat.gob.mx
  38. 42. Facilidad de aprendizaje Internet Explorer Mozilla Firefox Netscape Navigator
  39. 43. MSN Messenger Skype Eficiencia
  40. 44. Retención sobre el tiempo 2005 2006 2007 2009
  41. 45. www.useit.com Tasa de error de los usuarios
  42. 46. Satisfacción subjetiva www.hotmail.com www.gmail.com
  43. 47. Transformación del diseño web
  44. 48. Diseño centrado en la compañía
  45. 49. Diseño centrado en la tecnología
  46. 50. Diseño centrado en el diseño
  47. 51. Diseño centrado en la experiencia del usuario
  48. 52. Necesidades del Usuario Objetivos del Sitio Necesidades a partir de la investigación de los usuarios (Demo / Etno / Psicográficos) Objetivos del negocio y obtenidos de la organización El diseño centrado en el usuario Fuente: Jesse James Garrett. http://www.jjg.net
  49. 53. Necesidades del Usuario Objetivos del Sitio Especificaciones Funcionales Requerimientos de Contenido Funcionalidades y herramientas que satisfacen las necesidades del usuario Elementos de contenido que satisfacen los requerimientos del usuario El diseño centrado en el usuario Fuente: Jesse James Garrett. http://www.jjg.net
  50. 54. Necesidades del Usuario Objetivos del Sitio Especificaciones Funcionales Requerimientos de Contenido Diseño de Interacción Arquitectura de Información Definición de cómo el usuario interactúa con la funcionalidad (tecnología trabaja por ellos) Definición de la estructura de la información para que sea lógica e intuitiva El diseño centrado en el usuario Fuente: Jesse James Garrett. http://www.jjg.net
  51. 55. Necesidades del Usuario Objetivos del Sitio Especificaciones Funcionales Requerimientos de Contenido Diseño de Interacción Arquitectura de Información Interfaces - Navegación Diseño de la Información Diseño de los elementos de la interfaz que faciliten el uso Diseño de los movimientos del usuario a través de la arquitectura de información Diseño de la presentación e integración de la información para que sea fácil de entender El diseño centrado en el usuario Fuente: Jesse James Garrett. http://www.jjg.net
  52. 56. Necesidades del Usuario Objetivos del Sitio Especificaciones Funcionales Requerimientos de Contenido Diseño de Interacción Arquitectura de Información Interfaces - Navegación Diseño de la Información Diseño Visual Composición y tratamiento de los elementos visuales (texto y gráficos), componentes de la navegación y elementos de la interfaz (“look & feel”) El diseño centrado en el usuario Fuente: Jesse James Garrett. http://www.jjg.net
  53. 57. Metodología
  54. 58. <ul><li>Etnografía/Antropología </li></ul><ul><li>Psicología congnitiva </li></ul><ul><ul><li>Persuación </li></ul></ul><ul><ul><li>Emoción </li></ul></ul><ul><ul><li>Confianza </li></ul></ul>
  55. 59. <ul><li>Ingeniería de requerimientos </li></ul><ul><ul><li>Qué espera el cliente </li></ul></ul><ul><li>Mercadotecnia </li></ul><ul><ul><li>Segmentación de usuarios </li></ul></ul><ul><ul><li>Técnicas para recopilar necesidades y opiniones </li></ul></ul><ul><ul><li>Grupos de enfoque </li></ul></ul><ul><ul><li>Comportamiento del consumidor </li></ul></ul>
  56. 60. <ul><li>Aspectos sociales y cognitivos </li></ul><ul><ul><li>Antropología </li></ul></ul><ul><ul><li>Etnografía </li></ul></ul><ul><ul><li>Aprendizaje </li></ul></ul>
  57. 61. <ul><li>Evaluaciones de usabilidad </li></ul><ul><ul><li>Inspecciones y heurísticas </li></ul></ul><ul><ul><li>Pruebas con usuarios </li></ul></ul><ul><ul><li>Pruebas automatizadas </li></ul></ul><ul><li>Diseño de interacción </li></ul>
  58. 62. <ul><li>Arquitectura de información </li></ul><ul><ul><li>Sistemas de navegación </li></ul></ul><ul><ul><li>Sistemas de organización </li></ul></ul><ul><ul><li>Sistemas de rotulado y etiquetado </li></ul></ul><ul><ul><li>Sistemas de búsqueda </li></ul></ul><ul><ul><li>Lenguajes visuales y de representación </li></ul></ul>
  59. 63. <ul><li>Diseño de interfaces </li></ul><ul><li>Diseño de navegación </li></ul><ul><li>Diseño de información </li></ul><ul><li>Lenguaje plano </li></ul>
  60. 64. <ul><li>Diseño visual </li></ul><ul><ul><li>Tipografías </li></ul></ul><ul><ul><li>Colores </li></ul></ul><ul><ul><li>Íconos </li></ul></ul><ul><ul><li>Retículas </li></ul></ul><ul><ul><li>Imágenes </li></ul></ul><ul><li>Accesibilidad </li></ul><ul><li>Tecnología </li></ul><ul><ul><li>Administradores de contenidos </li></ul></ul><ul><ul><li>Estándares: HTML, CSS </li></ul></ul><ul><ul><li>Internet y sus características </li></ul></ul><ul><ul><li>Seguridad </li></ul></ul>
  61. 65. Fuente: The Future of Wireframes de Information Architects Inc.

×