Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Arquitectura de Información
Diseño de Experiencia de Usuario
AI+UX
Juan C CamusJuan C. Camus
2014
@jccamus - www.usando.in...
John Wanamaker
(July 11, 1838 – December 12, 1922)
@jccamus - www.usando.info – Julio 2014 - 2 de 40
“Half the money I spend
on advertising is wasted;g
the trouble is I don't know
which half”
@jccamus - www.usando.info – Ju...
@jccamus - www.usando.info – Julio 2014 - 4 de 40
@jccamus - www.usando.info – Julio 2014 - 5 de 40
@jccamus - www.usando.info – Julio 2014 - 6 de 40
@jccamus - www.usando.info – Julio 2014 - 7 de 40
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
un sitio web funciona
si el usuario actúa
sin preguntar
cómo se opera
@jccamus - www.usando.info – Julio 2014 - 9 de 40
@jccamus - www.usando.info – Julio 2014 - 10 de 40
@jccamus - www.usando.info – Julio 2014 - 11 de 40
@jccamus - www.usando.info – Julio 2014 - 12 de 40
@jccamus - www.usando.info – Julio 2014 - 13 de 40
Test Interactivo de Eyetracking (Poynter 2004)Test Interactivo de Eyetracking (Poynter 2004)
@jccamus - www.usando.info – ...
EyetrackingEyetracking
@jccamus - www.usando.info – Julio 2014 - 15 de 40
Banner blindnessBanner blindness
@jccamus - www.usando.info – Julio 2014 - 16 de 40
Steve Krug Jakob Nielsen
@jccamus - www.usando.info – Julio 2014 - 17 de 40
@jccamus - www.usando.info – Julio 2014 - 18 de 40
@jccamus - www.usando.info – Julio 2014 - 19 de 40
@jccamus - www.usando.info – Julio 2014 - 20 de 40
@jccamus - www.usando.info – Julio 2014 - 21 de 40
Audio Highway Listen Up – circa 1996Audio Highway Listen Up circa 1996
@jccamus - www.usando.info – Julio 2014 - 22 de 40
NOMAD Jukebox Zen – circa 2004NOMAD Jukebox Zen circa 2004
@jccamus - www.usando.info – Julio 2014 - 23 de 40
iPod Nano – circa 2006iPod Nano circa 2006
@jccamus - www.usando.info – Julio 2014 - 24 de 40
Ipod Nano 2nd Gen– circa 2006
@jccamus - www.usando.info – Julio 2014 - 25 de 40
• PDF gratis; Licencia CC BY NC SA• PDF – gratis; Licencia CC BY NC SA
• Desde 5 Nov. 2009 hasta hoy: 22.000
• www.tienes5...
Jesse
James
Para hacer un sitio web:J
Garrett
Para hacer un sitio web:
@jccamus - www.usando.info – Julio 2014 - 27 de 40
Jesse
James
Para hacer un sitio web:J
Garrett
Para hacer un sitio web:
@jccamus - www.usando.info – Julio 2014 - 28 de 40
Jesse
James
Para hacer un sitio web:J
Garrett
Para hacer un sitio web:
• Primero: entender al cliente
• Luego: entender a ...
¿Cómo seguir?¿Cómo seguir?
Wurman Rosenfeld y Morville Garrett WodtkeWurman Rosenfeld y Morville Garrett Wodtke
@jccamus -...
DefinicionesDefiniciones
• Arquitectura de Información:
– Es un arte y una ciencia.
– Organiza conjuntos de información.
P...
DefinicionesDefiniciones
• Organización de los patrones inherentes a la información – Wurman
• Usa herramientas, técnicas ...
Definiciones
L
Definiciones
Lou
“Information architecture involves the design of organization and navigation
systems to he...
AI – Definiciones
• Otra visión de RosenfeldOtra visión de Rosenfeld
@jccamus - www.usando.info – Julio 2014 - 34 de 40
DefinicionesDefiniciones
• El panal de Morville: Facetas de la
E i i d l U iExperiencia del Usuario
@jccamus - www.usando....
DefinicionesDefiniciones
• Los círculos de Rosenfeld
Usuario
Contenido
“La ArquitecturaLa Arquitectura
de Información es
l...
Herramientas: diseñar con wireframesHerramientas: diseñar con wireframes
@jccamus - www.usando.info – Julio 2014 - 37 de 40
Herramientas: diseñar la experienciaHerramientas: diseñar la experiencia
@jccamus - www.usando.info – Julio 2014 - 38 de 40
Herramientas: probar con usuariosHerramientas: probar con usuarios
@jccamus - www.usando.info – Julio 2014 - 39 de 40
Herramientas: cómo seguirHerramientas: cómo seguir
• Arquitectos de Información en el Mundo (inglés):
– IA Institute: http...
Upcoming SlideShare
Loading in …5
×

Arquitectura de Información y Diseño de Experiencia del Usuario

1,434 views

Published on

Presentación acerca de los fundamentos de las disciplinas de la Arquitectura de Información y Diseño de Experiencia del Usuario, hecha para un departamento de marketing de una gran empresa.

Published in: Design
  • Be the first to comment

Arquitectura de Información y Diseño de Experiencia del Usuario

  1. 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. 2. John Wanamaker (July 11, 1838 – December 12, 1922) @jccamus - www.usando.info – Julio 2014 - 2 de 40
  3. 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. 4. @jccamus - www.usando.info – Julio 2014 - 4 de 40
  5. 5. @jccamus - www.usando.info – Julio 2014 - 5 de 40
  6. 6. @jccamus - www.usando.info – Julio 2014 - 6 de 40
  7. 7. @jccamus - www.usando.info – Julio 2014 - 7 de 40
  8. 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. 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. 10. @jccamus - www.usando.info – Julio 2014 - 10 de 40
  11. 11. @jccamus - www.usando.info – Julio 2014 - 11 de 40
  12. 12. @jccamus - www.usando.info – Julio 2014 - 12 de 40
  13. 13. @jccamus - www.usando.info – Julio 2014 - 13 de 40
  14. 14. Test Interactivo de Eyetracking (Poynter 2004)Test Interactivo de Eyetracking (Poynter 2004) @jccamus - www.usando.info – Julio 2014 - 14 de 40
  15. 15. EyetrackingEyetracking @jccamus - www.usando.info – Julio 2014 - 15 de 40
  16. 16. Banner blindnessBanner blindness @jccamus - www.usando.info – Julio 2014 - 16 de 40
  17. 17. Steve Krug Jakob Nielsen @jccamus - www.usando.info – Julio 2014 - 17 de 40
  18. 18. @jccamus - www.usando.info – Julio 2014 - 18 de 40
  19. 19. @jccamus - www.usando.info – Julio 2014 - 19 de 40
  20. 20. @jccamus - www.usando.info – Julio 2014 - 20 de 40
  21. 21. @jccamus - www.usando.info – Julio 2014 - 21 de 40
  22. 22. Audio Highway Listen Up – circa 1996Audio Highway Listen Up circa 1996 @jccamus - www.usando.info – Julio 2014 - 22 de 40
  23. 23. NOMAD Jukebox Zen – circa 2004NOMAD Jukebox Zen circa 2004 @jccamus - www.usando.info – Julio 2014 - 23 de 40
  24. 24. iPod Nano – circa 2006iPod Nano circa 2006 @jccamus - www.usando.info – Julio 2014 - 24 de 40
  25. 25. Ipod Nano 2nd Gen– circa 2006 @jccamus - www.usando.info – Julio 2014 - 25 de 40
  26. 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. 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. 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. 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. 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. 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. 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. 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. 34. AI – Definiciones • Otra visión de RosenfeldOtra visión de Rosenfeld @jccamus - www.usando.info – Julio 2014 - 34 de 40
  35. 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. 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. 37. Herramientas: diseñar con wireframesHerramientas: diseñar con wireframes @jccamus - www.usando.info – Julio 2014 - 37 de 40
  38. 38. Herramientas: diseñar la experienciaHerramientas: diseñar la experiencia @jccamus - www.usando.info – Julio 2014 - 38 de 40
  39. 39. Herramientas: probar con usuariosHerramientas: probar con usuarios @jccamus - www.usando.info – Julio 2014 - 39 de 40
  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

×