1. Arquitectura de Información
Diseño de Experiencia de Usuario
AI+UX
Juan C CamusJuan C. Camus
2014
@jccamus - www.usando.info – Julio 2014 - 1 de 40

2. John Wanamaker
(July 11, 1838 – December 12, 1922)
@jccamus - www.usando.info – Julio 2014 - 2 de 40

3. “Half the money I spend
on advertising is wasted;g
the trouble is I don't know
which half”
@jccamus - www.usando.info – Julio 2014 - 3 de 40

4. @jccamus - www.usando.info – Julio 2014 - 4 de 40

5. @jccamus - www.usando.info – Julio 2014 - 5 de 40

6. @jccamus - www.usando.info – Julio 2014 - 6 de 40

7. @jccamus - www.usando.info – Julio 2014 - 7 de 40

8. US$ 3,4 MMM US$ 3,8 MMMUS$ 3,4 MMM
3 meses
US$ 3,8 MMM
1 año
@jccamus - www.usando.info – Julio 2014 - 8 de 40

9. un sitio web funciona
si el usuario actúa
sin preguntar
cómo se opera
@jccamus - www.usando.info – Julio 2014 - 9 de 40

10. @jccamus - www.usando.info – Julio 2014 - 10 de 40

11. @jccamus - www.usando.info – Julio 2014 - 11 de 40

12. @jccamus - www.usando.info – Julio 2014 - 12 de 40

13. @jccamus - www.usando.info – Julio 2014 - 13 de 40

14. Test Interactivo de Eyetracking (Poynter 2004)Test Interactivo de Eyetracking (Poynter 2004)
@jccamus - www.usando.info – Julio 2014 - 14 de 40

15. EyetrackingEyetracking
@jccamus - www.usando.info – Julio 2014 - 15 de 40

16. Banner blindnessBanner blindness
@jccamus - www.usando.info – Julio 2014 - 16 de 40

17. Steve Krug Jakob Nielsen
@jccamus - www.usando.info – Julio 2014 - 17 de 40

18. @jccamus - www.usando.info – Julio 2014 - 18 de 40

19. @jccamus - www.usando.info – Julio 2014 - 19 de 40

20. @jccamus - www.usando.info – Julio 2014 - 20 de 40

21. @jccamus - www.usando.info – Julio 2014 - 21 de 40

22. Audio Highway Listen Up – circa 1996Audio Highway Listen Up circa 1996
@jccamus - www.usando.info – Julio 2014 - 22 de 40

23. NOMAD Jukebox Zen – circa 2004NOMAD Jukebox Zen circa 2004
@jccamus - www.usando.info – Julio 2014 - 23 de 40

24. iPod Nano – circa 2006iPod Nano circa 2006
@jccamus - www.usando.info – Julio 2014 - 24 de 40

25. Ipod Nano 2nd Gen– circa 2006
@jccamus - www.usando.info – Julio 2014 - 25 de 40

26. • PDF gratis; Licencia CC BY NC SA• PDF – gratis; Licencia CC BY NC SA
• Desde 5 Nov. 2009 hasta hoy: 22.000
• www.tienes5segundos.cl
@jccamus - www.usando.info – Julio 2014 - 26 de 40

27. Jesse
James
Para hacer un sitio web:J
Garrett
Para hacer un sitio web:
@jccamus - www.usando.info – Julio 2014 - 27 de 40

28. Jesse
James
Para hacer un sitio web:J
Garrett
Para hacer un sitio web:
@jccamus - www.usando.info – Julio 2014 - 28 de 40

29. Jesse
James
Para hacer un sitio web:J
Garrett
Para hacer un sitio web:
• Primero: entender al cliente
• Luego: entender a la audiencia• Luego: entender a la audiencia
Después
• Qué contenidos se quieren ofrecerQué contenidos se quieren ofrecer
• Qué va a hacer el usuario con ellos
Con todo eso:Con todo eso:
• Definir la estructura
• Definir la navegaciónv g
Y, por último…
• …definir el diseño visual
@jccamus - www.usando.info – Julio 2014 - 29 de 40

30. ¿Cómo seguir?¿Cómo seguir?
Wurman Rosenfeld y Morville Garrett WodtkeWurman Rosenfeld y Morville Garrett Wodtke
@jccamus - www.usando.info – Julio 2014 - 30 de 40

31. DefinicionesDefiniciones
• 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– Permite que cualquier persona entienda la información que se ofrece.
– Favorece el “autoservicio”.
• Desde el web:• Desde el web:
– Arquitectura de Información 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.
@jccamus - www.usando.info – Julio 2014 - 31 de 40

32. DefinicionesDefiniciones
• Organización de los patrones inherentes a la información – Wurman
• Usa herramientas, técnicas y experiencias de disciplinas que ven la información
como algo importante y valioso por sí mismo – Rosenfeld
• El arte y la ciencia de organizar y etiquetar para apoyar las capacidades de uso y
búsqueda Morvillebúsqueda - Morville
• Define cómo las personas procesan la información y construye relaciones entre
sus diferentes elementos – Garrett
• Sistema para asegurar que un sitio web efectivamente incorpora las necesidades
del usuario – Wodtke
@jccamus - www.usando.info – Julio 2014 - 32 de 40

33. Definiciones
L
Definiciones
Lou
“Information architecture involves the design of organization and navigation
systems to help people find and manage information more successfully”systems to help people find and manage information more successfully.
Garrett
Information Architecture: Stuctural design of the informaiton space to facilitateInformation Architecture: Stuctural design of the informaiton space to facilitate
intuive access to content.“
Peter
[information architecture is]“… creating consistent and functional systems for
navigation, graphics, page layout and title languages so that the user knows
where to go, what to do, and encourages them to return.
@jccamus - www.usando.info – Julio 2014 - 33 de 40

34. AI – Definiciones
• Otra visión de RosenfeldOtra visión de Rosenfeld
@jccamus - www.usando.info – Julio 2014 - 34 de 40

35. DefinicionesDefiniciones
• El panal de Morville: Facetas de la
E i i d l U iExperiencia del Usuario
@jccamus - www.usando.info – Julio 2014 - 35 de 40

36. DefinicionesDefiniciones
• Los círculos de Rosenfeld
Usuario
Contenido
“La ArquitecturaLa Arquitectura
de Información es
la cola que
mueve al perro”
Contexto
@jccamus - www.usando.info – Julio 2014 - 36 de 40

37. Herramientas: diseñar con wireframesHerramientas: diseñar con wireframes
@jccamus - www.usando.info – Julio 2014 - 37 de 40

38. Herramientas: diseñar la experienciaHerramientas: diseñar la experiencia
@jccamus - www.usando.info – Julio 2014 - 38 de 40

39. Herramientas: probar con usuariosHerramientas: probar con usuarios
@jccamus - www.usando.info – Julio 2014 - 39 de 40

40. Herramientas: cómo seguirHerramientas: cómo seguir
• Arquitectos de Información en el Mundo (inglés):
– IA Institute: http://www.iainstitute.org/
– Wurman: http://wurman.com/rsw/
R f ld h // l i f ld /– Rosenfeld: http://www.louisrosenfeld.com/
– Morville: http://www.semanticstudios.com/
– Garrett: http://jjg.net/
– Wodtke: http://www.eleganthack.com/Wodtke: http://www.eleganthack.com/
• Arquitectos de Información en el Mundo (español):
– Webestilo: http://www.webestilo.com/guia/
– J. Arango: http://www.jarango.com/es/
– Alzado: http://www.alzado.org/
• Arquitectos de Información en Chile:• Arquitectos de Información en Chile:
– D. Vergara: http://www.darcy.cl/
– J.Velasco: http://www.mantruc.com/
– M. Gutierrez: http://www.malisa.cl/p // /
– J. Barahona: http://www.ayerviernes.com/
– J.C.Camus: http://www.usando.info/
@jccamus - www.usando.info – Julio 2014 - 40 de 40