Una introducción a nivel bien básico de la Arquitectura de Información y su rol en el diseño web. Esta presentación va de la mano de actividades prácticas.

1. Arquitectura de Información
Harold Maduro
http://www.flickr.com/photos/wscullin/3770015203/

2. todos los días somos bombardeados
con información.
http://www.flickr.com/photos/mynameispaul/384235177/

5. incluso, en los espacios digitales

6. ¿Cómo vamos a organizarla?

7. Arquitectura de Información
La Arquitectura de la Información (AI) es la
disciplina y arte encargada del estudio, análisis,
organización, disposición y estructuración de la
información en espacios de información, y de la
selección y presentación de los datos en los
sistemas de información interactivos y no
interactivos.
wikipedia.org

8. Arquitectura de Información
La Arquitectura de la Información (AI) es el arte y
la ciencia de organizar y rotular sitios web,
intranets, comunidades en línea y software para
promover la usabilidad y encontrabilidad.
wikipedia.org

9. Arquitectura de Información
en español
La Arquitectura de la Información (AI) busca
organizar los sitios web para que sean más fáciles
de usar y la información más fácil de encontrar.
yo

10. Debemos estructurar los sitios de tal
forma que sean intuitivos de usar.
Que la gente encuentre lo que busca.
http://jjg.net

11. Organicemos la estructura del
contenido a nivel del sitio entero

12. Sitemap

13. Sitemap

14. Te toca: card sorting.

15. Ahora, estructuremos la
información que va a ir en
la página

16. Wireframes

17. El wireframe es un prototipo, de
cómo se va a ver el sitio una vez
diseñado y armado

18. Hay muchas formas de
hacer prototipos

19. Prototipos
Alta fidelidad: diseño visual

20. Prototipos
Baja fidelidad: wireframe

21. Prototipos
Muy baja fidelidad: bosquejo a mano

22. Lo bueno de los Wireframes es
que te permite esforzarte en el
detalle de una sóla solución.
http://www.flickr.com/photos/24801682@N08/4120093158/

23. ¿Pero si quieres proponer
o explorar varias
soluciones?
¿Y si quieres trabajar
esto entre varias
personas?
¡Probemos otra
técnica!

24. Inspirada en las críticas de diseño
http://www.flickr.com/photos/mystandardbreakfromlife/3952642980/

25. Dibuja tus ideas.
http://www.flickr.com/photos/rohdesign/3307873748/

26. Mezcla muchas ideas.

27. Comparte con el equipo.
http://www.flickr.com/photos/worldeconomicforum/2894023545/

28. Te toca: ¡a dibujar se ha dicho!

29. Pre-Kinder de dibujo
Re aprendamos a
dibujar un rectángulo

30. El reto no es cómo dibujar; sino, qué dibujar

31. No es la Monalisa

32. Evolución de las ideas
Dibuja bocetos detallados,
en menos cantidades
Dibuja bocetos chicos,
muchos de ellos
http://ugleah.tumblr.com/

33. Dibuja bocetos chicos,
muchos de ellos
http://ugleah.tumblr.com/

34. Muchas ideas, crudas pero variadas
http://ugleah.tumblr.com/

35. dibuja.

36. Dibuja bocetos detallados,
en menos cantidades
http://ugleah.tumblr.com/

37. Mayor detalle de pantallas
Énfasis: grosor de línea, sombreado, notas
http://ugleah.tumblr.com/

38. dibuja.

39. Sketchboard
Colaboración: sustenta tu diseño y recibe feedback
http://ugleah.tumblr.com/

40. comparte.

41. El proceso de creación web es evolutivo.

49. La evolución empieza
desde la fase de
planeación.
http://www.flickr.com/photos/wscullin/3770015203/

50. gracias.
harold maduro
harold@epiphycorp.com
tel. (507) 6674.1605