Successfully reported this slideshow.

Diseño de la información

2,177 views

Published on

La metodología del diseño de la información permite interpretar los fenómenos cotidianos y entregar una nueva lectura de estos.

Published in: Design

Diseño de la información

  1. 1. taller PRODUCCIÓN DIGITAL Patricio Rodríguez M. @taller_media
  2. 2. “[  ]porque  todo  diseño   comienza  cuando  se   comprende  y  se  interpreta” Alan Fletcher
  3. 3. The world is complex, dynamic, multidimensional; the paper is static, flat. How are we to represent the rich visual world of experience and measurement on mere flatland? ! Edward Tufte, Envisioning Information, 1990. El mundo es complejo, dinámico, multidimensional; el papel es estático, plano. ¿Como vamos a representar el rico mundo visual de las experiencias y las medidas en un pobre espacio plano?
  4. 4. programa instruccional REALIZAR MAQUETAS DE CORRECCIÓN Y PRESENTACIÓN DE PROYECTOS DE DISEÑO, PARA DIFERENTES MEDIOS Y SOPORTES DE ACUERDO A LOS REQUERIMIENTOS DEL PROYECTO.
  5. 5. programa instruccional Identifica información de test de usuario para correcciones y/o ajustes a realizar en producto web, en función de sus requerimientos. ! Realiza prototipos en documentos codificados bajo estándares de construcción web.
 Realiza validaciones de estándares web aplicado a los documentos de la maqueta, en función de los requerimientos del proyecto. ! Identifica estándares de construcción web aplicables a un proyecto, de acuerdo a los requerimientos definidos. ! Identifica características de maquetas y prototipos web, en función de los requerimientos de la pieza a producir. Realiza maquetas gráficas para el prototipado web según requerimientos del proyecto. 
 Realiza correcciones en maqueta de acuerdo a información de test de usuarios.
  6. 6. taller + producción TIEMPOS DE TRABAJO
  7. 7. experiencia de usuario UX Usabilidad Factores sociales Factores culturales Contexto de uso
  8. 8. experiencia de usuario UX Usabilidad Factores sociales Factores culturales Contexto de uso arquitectura de la información Contenido (card sorting) Estudio (blue prints) Representación (wireframes) Evaluación (test de usuario)
  9. 9. diseño de interfaz UI Elementos gráficos (el rol del diseñador) Elementos activos (el rol del programador) La semántica del la web (el rol del usuario) Frameworks (pensando en dispositivos)
  10. 10. diseño de interfaz UI Elementos gráficos (el rol del diseñador) Elementos activos (el rol del programador) La semántica del la web (el rol del usuario) Frameworks (pensando en dispositivos) desarrollo web HTML5, HTML CSS3, CSS Javascript (lenguajes de interactividad) Publicación Administración de contenidos
  11. 11. evaluaciones 13 Notas 5 Individuales 8 Grupales ! No existen entregas atrasadas Correcciones grupales Comunicación
  12. 12. etapas de un PROYECTO WEB
  13. 13. armar documentos para la web desde su diseño, optimización y vinculación entre lenguajes de programación
  14. 14. diseño basado en estándares proceso productivo del diseño web
  15. 15. arquitectura de contenidos define las categorías, páginas y flujo de navegación de un sitio web
  16. 16. wireframe estructura de alambre, que define la diagramación de un documento web
  17. 17. mock up maqueta final que presenta la propuesta gráfica de un documento, línea visual de un sitio
  18. 18. … y la información también se diseña lo importante siempre en una pieza comunicacional es la información
  19. 19. diseño de la información
  20. 20. El DI puede definirse como el arte y la ciencia de preparar la información, de modo que pueda usarse por los humanos con eficacia y eficiencia Horn (1999) diseño de la información
  21. 21. definición de la información La información es un conjunto de mecanismos que permiten al individuo retomar los datos de su ambiente y estructurarlos de una manera determinada, de modo que le sirvan de guía para su acción.
  22. 22. definición de la información La información es un conjunto de mecanismos que permiten al individuo retomar los datos de su ambiente y estructurarlos de una manera determinada, de modo que le sirvan de guía para su acción.
  23. 23. 38 años50 millones de usuarios
  24. 24. 13 años50 millones de usuarios
  25. 25. 4 años50 millones de usuarios
  26. 26. 3 años50 millones de usuarios
  27. 27. 2 años50 millones de usuarios
  28. 28. es progresiva y por ende altamente complejizada en razón de las nuevas tecnologías la información
  29. 29. 1. El diseñar información es trabajar con datos que puedan llegar a convertirse en información valiosa para un lector meta ! 2. En el diseño se persigue no solo la comunicación de la información, sino también su asimilación o aprendizaje a fin de convertirse en conocimiento ! 3. La información que se diseña, se hace con base en la intención, experiencia y pertinencia del usuario final 3 puntos fundamentales
  30. 30. La comprensibilidad del documento se puede conseguir mediante la visualización de los componentes que lo forman
  31. 31. documentos comprensibles El primer requisito del DI es que los documentos que transmiten información deben ser comprensibles.
  32. 32. documentos comprensibles sistemas interactivos implican la visualización de todos los elementos de la interacción, lo que incluye el entorno social, el estado cognitivo del usuario, el sistema de diseño
  33. 33. espacios de información navegables documentos comprensibles sistemas interactivos Cuando los espacios informativos se diseñan, deben ser navegables para los usuarios. ! Por analogía con la navegación real, se debe diseñar la información conectando las tareas con el modo de encontrar el camino y de poner señales.
  34. 34. usabilidad
  35. 35. la usabilidad es la facilidad con que las personas pueden utilizar una herramienta con el fin de alcanzar un objetivo concreto
  36. 36. DON’T MAKE ME THINK Steve Krug diseñar es organizar elementos de modo que cumplan una necesidad particular de la mejor manera/forma posible. (Charles Eames) usabilidad
  37. 37. orga ni zar estructura clara y convincente
  38. 38. orga ni zar estructura clara y convincente eco nomi zar lo máximo con la menor cantidad de elementos
  39. 39. orga ni zar estructura clara y convincente eco nomi zar lo máximo con la menor cantidad de elementos co muni car presentación a la capacidad del usuario
  40. 40. encargo 01
  41. 41. Análisis de sitios web como herramienta digital ! Establecer la utilidad (para qué, rol o tarea a ejecutar), usabilidad (el como) y experiencia de uso ! Analisar el contexto gráfico para presentar la información y deducir el posible perfil de usuario
  42. 42. SITIOS WEB DE MARCAS DE AUTOMÓVILES ! 3 sitios buenos 3 sitios malos ! FORMATO DE ENTREGA: PDF paginado con presentación. ! OBS: la presentación también se diseña

×