¿dónde hay que hacer click?
DESCRIPTION
Una presentación acerca de Arquitectura de Información y Diseño de Experiencia de Usuario realizada en la Semana 5DD de Duoc, Palza Vespucio, Santiago de Chile.TRANSCRIPT
![Page 1: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/1.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 1
Una presentación acerca de Arquitectura de Información
y Diseño de Experiencia de Usuario
Juan C. Camus
2014
¿Dónde hay que hacer click?
![Page 2: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/2.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 2
![Page 3: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/3.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 3
![Page 4: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/4.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 4
![Page 5: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/5.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 5
![Page 6: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/6.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 6
Imagen: http://jessbyrn.blogspot.com/2011/05/usability.html
![Page 7: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/7.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 7
![Page 8: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/8.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 8
un sitio web funciona
si el usuario actúa
sin preguntar
cómo se opera
![Page 9: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/9.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 9
construimos
autoservicios
de información
![Page 10: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/10.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 10
Autores y herramientas
Wurman Rosenfeld y Morville Garrett Wodtke Krug Nielsen
![Page 11: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/11.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 11
Arquitectura de Información:
• Es un arte y una ciencia.
• Organiza conjuntos de información.
• Permite que cualquier persona entienda la información que se ofrece.
• Favorece el “autoservicio”.
Desde el web:
Es el conjunto de prácticas que entendiendo el objetivo de un sitio web, organiza el
contenido en subconjuntos de nombres comprensibles para el usuario final, facilitando
las operaciones de búsqueda y uso de la información que contienen.
Un par de definiciones
![Page 12: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/12.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 12
Usabilidad:• Es la medida de la calidad de la experiencia que tiene un usuario cuando interactúa
con un producto o sistema y mide la relación entre las herramientas y sus usuarios.
Es la combinación de varios factores que afectan la experiencia del usuario que usa
dicho producto o sistema. Dichos factores son:
• Facilidad de aprendizaje
• Facilidad y Eficiencia de uso
• Facilidad de recordar cómo funciona
• Frecuencia y gravedad de errores
• Satisfacción subjetiva
• ISO/IEC 9241:
• "Usabilidad es la eficacia, 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”.
Un par de definiciones
![Page 13: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/13.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 13
Diseño de Experiencia de Usuario:
• Es la experiencia que tiene un usuario al interactuar con un producto o sistema.
• Puede ser diseñada la interfaz y la interacción, pero no se puede garantizar los
efectos que se obtendrán con ella.
• No obstante, hay formas de medirlo:
• Test de Usuario
• Test Heurístico
• Observaciones participantes
• …
Un par de definiciones
![Page 14: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/14.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 14
![Page 15: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/15.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 15
Test Interactivo de Eyetracking (Poynter 2004)
![Page 16: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/16.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 16
Test Interactivo de Eyetracking (Poynter 2004)
![Page 17: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/17.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 17
Eyetracking
![Page 18: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/18.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 18
Eyetracking
![Page 19: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/19.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 19
![Page 20: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/20.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 20
![Page 21: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/21.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 21
Jesse
James
GarrettPara hacer un sitio web
•Primero: entender al cliente
•Luego: entender a la audiencia
Después
•Qué contenidos se quieren ofrecer
•Qué va a hacer el usuario con ellos
Con todo eso:
•Definir la estructura
•Definir la navegación
Y, por último…
•…definir el diseño visual
![Page 22: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/22.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 22
Jesse
James
GarrettPara hacer un sitio web
![Page 23: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/23.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 23
Jesse
James
GarrettPara hacer un sitio web
![Page 24: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/24.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 24
Para hacer un sitio web
•Se nota que el sitio web está bien hecho, cuando un usuario entra por
primera vez y...
•... puede entender el sitio en forma rápida y sin esfuerzo.
•...puede encontrar la información fácilmente.
•... quienes producen el sitio pueden ubicar la nueva información sin
tener crear nuevas estructuras.
![Page 25: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/25.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 25
Modelos Mentales
Imagen: http://blog.crazyegg.com/2012/09/24/how-to-design-mental-models/
![Page 26: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/26.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 26
Personas y Escenarios
Imagen: http://www.guiadigital.gob.cl/articulo/aseguramiento-de-usabilidad
![Page 27: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/27.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 27
Wireframes
![Page 28: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/28.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 28
Return
Of
Investment
ROI
![Page 29: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/29.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 29
“Half the money I spend
on advertising is wasted;
the trouble is I don't know
which half ”
![Page 30: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/30.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 30
John Wanamaker (July 11, 1838 – December 12, 1922)
![Page 31: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/31.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 31
¿Cuánto vale un botón?
![Page 32: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/32.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 32
![Page 33: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/33.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 33
¿Cuánto vale un botón?
En el lugar adecuado, con el nombre correcto y la
interacción bien diseñada…
![Page 34: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/34.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 34
• PDF – gratis; Licencia CC BY NC SA
• Desde 5 Nov. 2009 hasta hoy: 25.000
• www.tienes5segundos.cl
![Page 35: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/35.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 35
Una presentación acerca de Arquitectura de Información
y Diseño de Experiencia de Usuario
Juan C. Camus
2014
¿Dónde hay que hacer click?
![Page 36: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/36.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 36
Arquitectos de Información en el Mundo (inglés):• IA Institute: http://www.iainstitute.org/• Wurman: http://wurman.com/rsw/• Rosenfeld: http://www.louisrosenfeld.com/• Morville: http://www.semanticstudios.com/• Garrett: http://jjg.net/• Wodtke: http://www.eleganthack.com/• IA Institute: http://www.iainstitute.org/
Arquitectos de Información en el Mundo (español):• Webestilo: http://www.webestilo.com/guia/• J. Arango: http://www.jarango.com/es/
Arquitectos de Información en Chile:• J.Velasco: http://www.mantruc.com/• J. Barahona: http://www.ayerviernes.com/• J.C.Camus: http://www.usando.info/
Enlaces para temas de AI
![Page 37: ¿Dónde hay que hacer click?](https://reader030.vdocuments.pub/reader030/viewer/2022020207/5589b426d8b42a02598b45f2/html5/thumbnails/37.jpg)
@jccamus - www.usando.info – DUOC 5DD – Octubre 2014 - 37
•Usabilidad en el mundo (en inglés)
• Jakob Nielsen: http://www.useit.com/
• Steve Krug: http://www.sensible.com/
• Alan Cooper: http://www.cooper.com/index.asp
• Bruce Toganizzini: http://www.asktog.com/basics/firstPrinciples.html
• A list Apart: http://www.alistapart.com/topics/userscience/usability/
• Usable Web: http://usableweb.com/
• User Effects: http://www.usereffect.com/
•Usabilidad en Chile (en español)
• No sólo Usabilidad: http://www.nosolousabilidad.com/
• Daniel Torres Burriel: http://www.torresburriel.com/weblog/
• Ainda: http://www.ainda.info/que_es_usabilidad.htm
• UsoLab: http://www.usolab.com/publicaciones/
• Jorge Barahona: http://www.jbarahona.com
• Juan C. Camus: http.//www.usando.info
Enlaces para temas de Usabilidad