Tercera clase del taller de Arquitectura de la Información y Usabilidad del Diplomado en Técnicas de Diseño para Sitios Web de la Universidad del Pacífico.

1. EN LA CLASE PASADA...
Usabilidad y Experiencia de usuario.

2. 1.- MENOS ES MÁS

3. 2.- EL SECRETO ESTA EN OBSERVAR
A NUESTROS USUARIOS

4. 3.- LAS EXPERIENCIAS ESTÁN
CAMBIANDO

5. GOOGLE GLASS

6. CLASE3: WIREFRAMES
Como diseñamos la información.

7. ¿QUÉ ES DISEÑO DE INFORMACIÓN?

8. DISEÑO DE INFORMACIÓN
Priorización y presentación de los contenidos que
poseerá un sitio web.
Esta orientada a cumplir los objetivos y tareas que
podrá realizar un usuario.
El centro esta en LOS CONTENIDOS.

9. ¿CÓMO SE PRESENTA EL DISEÑO DE
INFORMACIÓN?

10. WIREFRAMES

11. ¿QUÉ SON LOS WIREFRAMES?

12. WIKIPEDIA NOS DICE:
"Esquema del diseño de
página u ordenamiento del
contenido del sitio web,
incluyendo elementos de
la interfaz y sistemas de
navegación, y cómo
funcionan en conjunto."

13. • Plasmarlos resultados de nuestra investigación
posterior en donde identificamos
usuarios, definimos un árbol de
contenidos y buscamos buenas
prácticas.
• Ordenamiento y jerarquización de los
contenidos según la importancia de nuestros
arquetipos.
• Planteamiento visual y funcional de como se
vera nuestro sitio en pantalla

14. Diseño de Interfaz
• Son el paso intermedio entre la
arquitectura de información y el
diseño de interfaz.
Wireframes
• Esun diseño más racional, a
diferencia del de interfaces que es
más emocional.
Arquitectura de la
información

15. ¿PARA QUÉ SON LOS WIREFRAMES?

16. ¿PARA QUÉ SON LOS WIREFRAMES?
• Visualizar
una conceptualización de la disposición de los
contenidos.
• Visualizar como serian los flujos de interacción de un sitio
web.
• Para
comenzar a definir las primeras interacción que
poseerá la plataforma. .

17. ¿PARA QUÉ SON LOS WIREFRAMES?
• Son el punto para discutir entre los distintos actores que
están en el proyecto. Estos pueden ser arquitectos de
información, diseñadores, desarrolladores y clientes
cuando sea el caso.

18. ¿CÓMO PUEDEN SER LOS
WIREFRAMES?

24. • Sencillos de entender y evitamos distracciones en temas que en esta
etapa no son de importancia como colores o uso de fotografías.