77
TÉCNICAS DE USABILIDAD + INVESTIGACIÓN DE USUARIOS PARTE 2: INTRODUCCIÓN A LA USABILIDAD 09.2014 VERÓNICA TRAYNOR

INTRODUCCIÓN A LA USABILIDAD

Embed Size (px)

DESCRIPTION

QUÉ ES LA USABILIDAD Y CÓMO SE MIDE?

Citation preview

Page 1: INTRODUCCIÓN A LA USABILIDAD

TÉCNICAS DE USABILIDAD + INVESTIGACIÓN DE USUARIOS!!PARTE 2: !INTRODUCCIÓN A LA USABILIDAD!09.2014 VERÓNICA TRAYNOR!

Page 2: INTRODUCCIÓN A LA USABILIDAD

Índice!!1.  PERCEPCIÓN VS. OBSERVACIÓN DEL APRENDIZAJE!2.  EXPECTATIVAS Y APRENDIZAJE!3.  PERSONAS PROFILES!4.  ESCENARIOS !5.  MODELOS MENTALES!6.  HEURÍSTICAS!7.  WCAG 2.0!

Page 3: INTRODUCCIÓN A LA USABILIDAD

01 / 07 !

PERCEPCIÓN VS. OBSERVACIÓN DEL APRENDIZAJE!

Page 4: INTRODUCCIÓN A LA USABILIDAD

No saben usar un teléfono https://www.youtube.com/watch?feature=player_embedded&v=spzsIBdANxs !

Page 5: INTRODUCCIÓN A LA USABILIDAD

¿QUÉ ESTAMOS EVALUANDO CUANDO HABLAMOS DE “USABILIDAD”?!

UX | Verónica Traynor | @verotraynor!

Page 6: INTRODUCCIÓN A LA USABILIDAD

UX | Verónica Traynor | @verotraynor!

COMPRENSIÓN!

TIEMPO!

Page 7: INTRODUCCIÓN A LA USABILIDAD

¿CUÁNTO  SIRVE  PREGUNTARLE  A  UN  

USUARIO  SI  UNA  INTERFAZ  LE  RESULTÓ  FÁCIL  DE  

USAR?  

Page 8: INTRODUCCIÓN A LA USABILIDAD

LO  QUE  LE  SUCEDIÓ  

UX | Verónica Traynor | @verotraynor!

LO  QUE  EXPRESA  LO  QUE  INTERPRETÓ  

Page 9: INTRODUCCIÓN A LA USABILIDAD

LO  QUE  LE  SUCEDIÓ  

UX | Verónica Traynor | @verotraynor!

LO  QUE  EXPRESA  LO  QUE  INTERPRETÓ  

PERCEPCIÓN!

Page 10: INTRODUCCIÓN A LA USABILIDAD

UX | Verónica Traynor | @verotraynor!

PERCEPCIÓN!

Page 11: INTRODUCCIÓN A LA USABILIDAD

02 / 07!

EXPECTATIVAS Y APRENDIZAJE!

Page 12: INTRODUCCIÓN A LA USABILIDAD

EN EL VIDEO,!¿QUÉ FUE LO QUE CONDICIONÓ EL APRENDIZAJE?!

UX | Verónica Traynor | @verotraynor!

Page 13: INTRODUCCIÓN A LA USABILIDAD
Page 14: INTRODUCCIÓN A LA USABILIDAD

PROFUNDIZAR  EN:    

•   CÓMO  RESUELVE  EL  USUARIO  EL  MISMO  OBJETIVO  EN  SU  VIDA  NO  

VIRTUAL  

•  QUÉ  APRENDIZAJE  PREVIO  TIENE  DE  OTROS  SITIOS/APPS    

 (MISMA  INDUSTRIA  O  NO)  

Page 15: INTRODUCCIÓN A LA USABILIDAD

TODO  AFECTA  LAS  EXPECTATIVAS  Y  EL  APRENDIZAJE  

Page 16: INTRODUCCIÓN A LA USABILIDAD

03 / 07!PERSONAS PROFILES!

Page 17: INTRODUCCIÓN A LA USABILIDAD

¿CÓMO?!•  CONCRETOS Y DEFINIDOS!•  NO REUSABLES!•  NO ESTEREOTIPOS!•  QUE MUESTREN CARACTERÍSTICAS,

MIEDOS, MOTIVACIONES Y OBJETIVOS!

UX | Verónica Traynor | @verotraynor!

Page 18: INTRODUCCIÓN A LA USABILIDAD

FUENTE: AmericanTours International & AAA Website Redesign https://www.behance.net/gallery/6296213/AmericanTours-International-AAA-Website-Redesign!

UX | Verónica Traynor | @verotraynor!

Page 19: INTRODUCCIÓN A LA USABILIDAD

“Personas were created to understand the various types of users that were currently using the ATI & AAA websites. User's ranged from America to Europe and Asia”.!

UX | Verónica Traynor | @verotraynor!

FUENTE: AmericanTours International & AAA Website Redesign https://www.behance.net/gallery/6296213/AmericanTours-International-AAA-Website-Redesign!

Page 20: INTRODUCCIÓN A LA USABILIDAD

FUENTE: 6 reasons why bad UX is killing your users and how you can radically transform it http://frontdigital.com/category/user-experience-ux/!

UX | Verónica Traynor | @verotraynor!

Page 21: INTRODUCCIÓN A LA USABILIDAD

“Once you have developed your personas (…) you can create scenarios to tell the story of  how one of your personas will visit the site, what they need to do, and how they might achieve it. For example, a persona named George might wish to visit your site to register, find out information about a particular event and fill in an online application.”!

UX | Verónica Traynor | @verotraynor!

FUENTE: 6 reasons why bad UX is killing your users and how you can radically transform it http://frontdigital.com/category/user-experience-ux/!

Page 22: INTRODUCCIÓN A LA USABILIDAD

FUENTE: http://www.politeux.com/wp-content/uploads/2012/08/EMT_personas-1024x768.jpg!

UX | Verónica Traynor | @verotraynor!

Page 23: INTRODUCCIÓN A LA USABILIDAD

¿CON QUÉ FIN?!•  FACILITAR LA COMUNICACIÓN INTERNA!•  IMAGINARNOS TODOS LA MISMA

ESCENA !•  EVITAR EL USUARIO ELÁSTICO!•  PREVENIR EL DISEÑO

AUTORREFERENCIAL!

UX | Verónica Traynor | @verotraynor!

Page 24: INTRODUCCIÓN A LA USABILIDAD
Page 25: INTRODUCCIÓN A LA USABILIDAD

¿CÓMO OBTENEMOS LA INFO?!•  NEGOCIO!•  CENTRO DE ATENCIÓN AL CLIENTE!•  USUARIOS!

UX | Verónica Traynor | @verotraynor!

Page 26: INTRODUCCIÓN A LA USABILIDAD

04 / 07!

ESCENARIOS!

Page 27: INTRODUCCIÓN A LA USABILIDAD

¿EN  QUÉ  ESCENARIO  NOS  IMAGINAMOS  QUE  LA  PERSONA  USARÁ  LA  

INTERFAZ?  

Page 28: INTRODUCCIÓN A LA USABILIDAD

http://accesibilidadweb.dlsi.ua.es/contenido/evaluacion/laboratorio/stationair-usability-lab.jpg !

Page 29: INTRODUCCIÓN A LA USABILIDAD

¿…  Y  SI  AGREGÁRAMOS  A  LOS  PROFILES  UNA  BREVE  

NARRACIÓN  DEL  ESCENARIO  DE  USO?  

¿…  Y  SI  EL  TESTING  LO  REALIZÁRAMOS  EN  UN  ESCENARIO  REAL?  

Page 30: INTRODUCCIÓN A LA USABILIDAD

05 / 07!

MODELOS MENTALES!

Page 31: INTRODUCCIÓN A LA USABILIDAD
Page 32: INTRODUCCIÓN A LA USABILIDAD

QUÉ RAZONAMIENTO SIGUE EL USUARIO PARA RESOLVER SU NECESIDAD!

UX | Verónica Traynor | @verotraynor!

Page 33: INTRODUCCIÓN A LA USABILIDAD

CON QUÉ LÓGICA ESPERA ENCONTRARSE EN LA INTERFAZ!

UX | Verónica Traynor | @verotraynor!

Page 34: INTRODUCCIÓN A LA USABILIDAD

¿UN  PROGRAMADOR  TIENE  LA  MISMA  FORMA  DE  RAZONAR  QUE  UN    

NO-­‐PROGRAMADOR?  

Page 35: INTRODUCCIÓN A LA USABILIDAD

UX | Verónica Traynor | @verotraynor!

Page 36: INTRODUCCIÓN A LA USABILIDAD

LAS PRUEBAS DE USABILIDAD SIRVEN PARA COMPRENDER LA FORMA DE RAZONAR DEL OTRO ;)!

UX | Verónica Traynor | @verotraynor!

Page 37: INTRODUCCIÓN A LA USABILIDAD

POR ESO NO NOS SIRVE HACER LAS PRUEBAS CON COLEGAS PROGRAMADORES NI DISEÑADORES ;)!

UX | Verónica Traynor | @verotraynor!

Page 38: INTRODUCCIÓN A LA USABILIDAD

SÍ ! HICIMOS PRUEBAS DE USABILIDAD ! AQUÍ CON LOS

CHICOS DEL EQUIPO!

Page 39: INTRODUCCIÓN A LA USABILIDAD

WHAT?!

Page 40: INTRODUCCIÓN A LA USABILIDAD

05 / 07!

HEURÍSTICAS!DE USABILIDAD!

Page 41: INTRODUCCIÓN A LA USABILIDAD

¿SON  UN  MARCO  DE  REFERENCIA  O  UN  

CHECKLIST  PARA  UN  AUTO-­‐INFORME?  

Page 42: INTRODUCCIÓN A LA USABILIDAD

1. Visibilidad del estado del sistema. El sistema debe informar a los usuarios del estado del sistema, dando una retroalimentación apropiada en un tiempo razonable.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 43: INTRODUCCIÓN A LA USABILIDAD

¿CÓMO  SÉ  SI  LA  RETROALIMENTACIÓN  RESULTÓ  APROPIADA?  

Page 44: INTRODUCCIÓN A LA USABILIDAD

2. Utilizar el lenguaje de los usuarios. El sistema debe utilizar el lenguaje de los usuarios, con palabras o frases que le sean conocidas, en lugar de los términos que se utilizan en el sistema, para que al usuario no se le dificulte utilizar el sistema.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 45: INTRODUCCIÓN A LA USABILIDAD

¿CÓMO  SABES  CUÁLES  PALABRAS  RESULTAN  CONOCIDAS  PARA  LOS  

USUARIOS  Y  CUÁLES  NO?  

Page 46: INTRODUCCIÓN A LA USABILIDAD

3. Control y libertad para el usuario. En casos en los que los usuarios elijan una opción del sistema por error, éste debe contar con las opciones de deshacer y rehacer para proveer al usuario de una salida fácil sin tener que utilizar diálogo extendido.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 47: INTRODUCCIÓN A LA USABILIDAD

¿CÓMO  SABES  SI  LA  SALIDA  ES  FÁCIL  PARA  EL  

USUARIO?  

Page 48: INTRODUCCIÓN A LA USABILIDAD

4. Consistencia y estándares. El usuario debe seguir las normas y convenciones de la plataforma sobre la que está implementando el sistema, para que no se tenga que preguntar el significado de las palabras, situaciones o acciones del sistema.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 49: INTRODUCCIÓN A LA USABILIDAD

5. Prevención de errores. Es más importante prevenir la aparición de errores que generar buenos mensajes de error. Hay que eliminar acciones predispuestas al error o - en todo caso - localizarlas y preguntar al usuario si está seguro de realizarlas.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 50: INTRODUCCIÓN A LA USABILIDAD

¿CÓMO  SABES  QUÉ  ELEMENTOS  GENERAN  

TROPIEZOS  Y  CONFUSIONES  SI  NO  OBSERVAMOS  A  LOS  USUARIOS  USANDO  LA  

INTERFAZ?  

Page 51: INTRODUCCIÓN A LA USABILIDAD

6. Minimizar la carga de la memoria del usuario. El sistema debe minimizar la información que el usuario debe recordar mostrándola a través de objetos, acciones u opciones. El usuario no tiene por qué recordar la información que recibió anteriormente. Las instrucciones para el uso del sistema deberían ser visibles o estar al alcance del usuario cuando se requieran.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 52: INTRODUCCIÓN A LA USABILIDAD

7. Flexibilidad y eficiencia de uso. Los aceleradores permiten aumentar la velocidad de interacción para el usuario experto tal que el sistema pueda atraer a usuarios principiantes y experimentados. Es importante que el sistema permita personalizar acciones frecuentes para así acelerar el uso de éste.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 53: INTRODUCCIÓN A LA USABILIDAD

8. Diálogos estéticos y diseño minimalista. La interfaz no debe contener información que no sea relevante o se utilice raramente, pues cada unidad adicional de información en un diálogo compite con las unidades relevantes de la información y disminuye su visibilidad relativa.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 54: INTRODUCCIÓN A LA USABILIDAD

¿CÓMO  SABES  SI  UN  CONTENIDO  ES  O  NO  RELEVANTE  SI  NO  LO  

MIDES?  

Page 55: INTRODUCCIÓN A LA USABILIDAD

9. Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de los errores. Los mensajes de error deben expresarse en un lenguaje claro, indicar exactamente el problema y ser constructivos.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 56: INTRODUCCIÓN A LA USABILIDAD

¿CÓMO  SABEMOS  SI  EL  LENGUAJE  ES  CLARO?  

Page 57: INTRODUCCIÓN A LA USABILIDAD

10. Ayuda y documentación. A pesar de que es mejor un sistema que no necesite documentación, puede ser necesario disponer de ésta. Si así es, la documentación tiene que ser fácil de encontrar, estar centrada en las tareas del usuario, tener información de las etapas a realizar y no ser muy extensa.!

UX | Verónica Traynor | @verotraynor!

FUENTE: http://es.wikipedia.org/wiki/Heur%C3%ADsticas_de_Nielsen!

Page 58: INTRODUCCIÓN A LA USABILIDAD
Page 59: INTRODUCCIÓN A LA USABILIDAD

¿PARA QUÉ SIRVEN!LAS HEURÍSTICAS !DE USABILIDAD? !

UX | Verónica Traynor | @verotraynor!

Page 60: INTRODUCCIÓN A LA USABILIDAD
Page 61: INTRODUCCIÓN A LA USABILIDAD
Page 62: INTRODUCCIÓN A LA USABILIDAD
Page 63: INTRODUCCIÓN A LA USABILIDAD

UX | Verónica Traynor | @verotraynor!

AUTO-INFORME !SOLITARIO !

DE UN EXPERTO QUE SE AHORRA LA OBSERVACIÓN!

Page 64: INTRODUCCIÓN A LA USABILIDAD

OJO CON EL EL AUTO-INFORME :)

UX | Verónica Traynor | @verotraynor!

Page 65: INTRODUCCIÓN A LA USABILIDAD

07 / 07!

UNA REFERENCIA INTERESANTE: !WCAG 2.0!

Page 66: INTRODUCCIÓN A LA USABILIDAD

¿CONOCEN LOS LINEAMIENTOS DE ACCESIBILIDAD !WCAG 2.0? !

UX | Verónica Traynor | @verotraynor!

Page 67: INTRODUCCIÓN A LA USABILIDAD

WCAG 2.0 = !WEB CONTENT!ACCESSIBILITY GUIDELINES!W3C RECOMMENDATIONS, 2008!

UX | Verónica Traynor | @verotraynor!

Page 68: INTRODUCCIÓN A LA USABILIDAD
Page 69: INTRODUCCIÓN A LA USABILIDAD
Page 70: INTRODUCCIÓN A LA USABILIDAD

•  PERCEPTIBLE!•  COMPRENSIBLE!•  OPERABLE!•  ROBUSTO!

UX | Verónica Traynor | @verotraynor!

Page 71: INTRODUCCIÓN A LA USABILIDAD
Page 72: INTRODUCCIÓN A LA USABILIDAD
Page 73: INTRODUCCIÓN A LA USABILIDAD

¿ESTOS  PRINCIPIOS,  APLICAN  SÓLO  PARA  “DISCAPACITADOS”?  

Page 74: INTRODUCCIÓN A LA USABILIDAD

RESIGNIFICACIÓN!

Page 75: INTRODUCCIÓN A LA USABILIDAD

UX | Verónica Traynor | @verotraynor!

¿Y  SI  USÁRAMOS  LOS  PILARES  DE  LA  WCAG  2.0:    

-­‐  PERCEPTIBILIDAD  -­‐  COMPRENSIÓN    -­‐  OPERABILIDAD    -­‐  ROBUSTEZ  

COMO  BASE  CONCEPTUAL  PARA    DIFERENCIAR  LAS  TÉCNICAS  DE  INVESTIGACIÓN  DE  USUARIOS?  

Page 76: INTRODUCCIÓN A LA USABILIDAD
Page 77: INTRODUCCIÓN A LA USABILIDAD

TÉCNICAS DE USABILIDAD + INVESTIGACIÓN DE USUARIOS!!PARTE 2: !INTRODUCCIÓN A LA USABILIDAD!09.2014 VERÓNICA TRAYNOR!