Arquitectura de Comunicacion

4.493 visualizaciones

Publicado el

Taller teorico-practico presentado en el Seminario Internacional de Accesibilidad y Usabilidad en Monterrey, Mexico.

Publicado en: Tecnología, Diseño
0 comentarios
5 recomendaciones
Estadísticas
Notas
  • Sé el primero en comentar

Sin descargas
Visualizaciones
Visualizaciones totales
4.493
En SlideShare
0
De insertados
0
Número de insertados
146
Acciones
Compartido
0
Descargas
5
Comentarios
0
Recomendaciones
5
Insertados 0
No insertados

No hay notas en la diapositiva.
  • Arquitectura de Comunicacion

    1. 1. Arquitectura de la Comunicación: Sistemas de Información para la Comunicación Humana Javier Velasco M. [email_address]
    2. 2. Temario <ul><li>Conceptos Generales </li></ul><ul><li>Teoría de la Comunicación </li></ul><ul><li>Proceso de Diseño </li></ul><ul><ul><li>Estrategia </li></ul></ul><ul><ul><li>Arquitectura de Información </li></ul></ul><ul><ul><li>Diseño de Interacción </li></ul></ul><ul><ul><li>Diseño de Información </li></ul></ul>
    3. 3. Conceptos Generales
    4. 4. Experiencia de Usuario
    5. 5. Problema Tecnología “ Los productos tecnológicos que no funcionan de la manera que las personas esperan las hace sentir estúpidas – aun cuando efectivamente hayan logrado lo que se propusieron.” Jesse James Garett (2002)
    6. 6. Diseño de la Experiencia de Usuario 1 <ul><li>Ejemplo industria automotriz </li></ul>© Porsche A.G. 2002
    7. 8. Elementos de la Experiencia de Usuario <ul><li>Jesse James Garrett 2000, 2002 </li></ul>Web como Interfaz de Software Web como Sistema de Hipertexto
    8. 9. Diseño de Experiencia de Usuario Peter Morville 2004
    9. 10. Estudio de Compra Entusiasta Jared Spool – UIE 2005 <ul><li>Cuando la gente está confiada, actúa con mayor entusiasmo. </li></ul><ul><li>La Arquitectura de Información afecta el nivel de confianza, en ambas direcciones. </li></ul>
    10. 11. <ul><li>Louis Rosenfeld y </li></ul><ul><li>Peter Morville (2002) </li></ul>Investigación Investigación antecedentes Reuniones y presentaciones Reuniones directorio Evaluación tecnología Evaluación heuristica Analsis contenido y metadata Mapeo de contenido Análisis competencia Análisis de Logs Casos de uso y personas Investigación contextual Entrevistas y pruebas a usuarios Contexto Contenido Usuarios
    11. 12. Accesibilidad <ul><li>Facilita lectura universal </li></ul><ul><li>P ermite lectura maquinas </li></ul>Foto: David Foster Nass
    12. 13. Cómo evaluar la Experiencia de Usuario <ul><li>Usabilidad (de una aplicación) se refiere a la efectividad, eficiencia y satisfacción con la cual usuarios específicos pueden alcanzar metas específicas en ambientes particulares . </li></ul><ul><ul><li>Efectividad : La medida en la cual los usuarios pueden alcanzar sus metas de tareas. </li></ul></ul><ul><ul><li>Eficiencia : Mide los recursos usados para realizar la tarea. </li></ul></ul><ul><ul><li>Satisfacción : Mide la reacción afectiva de los usuarios respecto a la aplicación. </li></ul></ul><ul><li>ISO </li></ul>  
    13. 14. Copyright 2004 Steve Krug God is My [VCR] Co-pilot
    14. 15. Arquitectura de Información y Usabilidad, un modelo c íclico Baeza-Yates & Velasco 2004
    15. 16. Jess McMullin + Lou Rosenfeld
    16. 17. Teor ía de la Comunicación
    17. 18. Internet, el nuevo medio
    18. 19. Internet: Herramienta de Comunicaci ón <ul><li>Internet nace como herramienta de comunicación </li></ul><ul><li>Le evolución del diseño Web se aleja de esta noción </li></ul><ul><li>La evolución del tráfico en Internet demuestra que la comunicación es la actividad primordial para su uso </li></ul>
    19. 20. La comunicaci ó n es la base de Internet <ul><li>Similarly, the two fundamental principles of our current work are: </li></ul><ul><ul><li>Human beings appropriate technology for human ends. </li></ul></ul><ul><ul><li>The Intenet is at its best when connecting people. </li></ul></ul><ul><li>Steward Buterfield, 2003 </li></ul>
    20. 21. <ul><li>Claude Shannon, 1948 </li></ul>Teoría de la Comunicación: Teoría de la Información Emisor – Mensaje – Canal – Receptor – Efecto – Retroalimentación Teoría de la Información
    21. 22. <ul><li>Paul Watzlawick & Palo Alto Group, 1960s </li></ul>Teoría de la Comunicación: Modelo Interaccional Axioma 1: No podemos no comunicar
    22. 23. <ul><li>… al clasificar </li></ul><ul><ul><li>“ Guerra de Irak” </li></ul></ul><ul><ul><li>Sociedad > Conflictos Internacionales > Terrorismo > Guerra al Terrror </li></ul></ul><ul><ul><li>Economía > Combustibles > Petróleo </li></ul></ul>Arquitectura de Información: No podemos no comunicar
    23. 24. Diseño de Interacción: No podemos no comunicar
    24. 25. Paul Watzlawick & Palo Alto Group, 1960s Teoria de la Comunicación: Modelo Interaccional Axioma 3: Communicación = Contenido + Relación
    25. 26. <ul><li>Humberto Maturana & Francisco Varela, 1970s </li></ul>Teoría de la Comunicación: Biología del Conocimiento Communicación = Coordinación de Conducta
    26. 27. Arquitectura de Información: Coordinación de Conducta Webs Corporativos e Institucionales Communidades Software Social
    27. 28. Redes Sociales <ul><li>Grafo de Red </li></ul><ul><li>Explicación general </li></ul><ul><li>Redes sociales como parte de la vida </li></ul><ul><li>Como herramienta de ciencias sociales </li></ul>
    28. 29. by: soldierant
    29. 30. Links en Blogs Noor Ali-Hasan and Lada Adamic, 2007
    30. 31. Interconexión en Blogs Noor Ali-Hasan and Lada Adamic, 2007
    31. 32. Blogs: H vs. M, Fechas Hugo Liu and Rada Mihalcea, 2007
    32. 33. Blogs: H vs. M, pronombres Hugo Liu and Rada Mihalcea, 2007
    33. 34. Proceso de Diseño Centrado en el Usuario Estrategia
    34. 35. Dise ño Centrado en el Usuario <ul><li>Adivinar lo que quieren las personas y construir un sitio para ellos es caro ; si adivinas mal, hay que volver a hacerlo todo . </li></ul>Christina Wodtke 2002
    35. 36. Dise ño Centrado en el Usuario <ul><li>Los pasos básicos son: </li></ul><ul><ul><li>Averigua para quién es el sitio. </li></ul></ul><ul><ul><li>Habla con esas personas. </li></ul></ul><ul><ul><li>Diseña el sitio para ellos. </li></ul></ul><ul><ul><li>Prueba un prototipo del sitio con ellos. </li></ul></ul><ul><ul><li>Cambia el diseño de acuerdo a lo aprendido. </li></ul></ul><ul><ul><li>Prueba el sitio final con ellos. </li></ul></ul>Christina Wodtke
    36. 37. Dos fuentes de necesidades <ul><li>Accionistas </li></ul><ul><ul><li>Deben satisfacer sus necesidades organizacionales </li></ul></ul><ul><ul><ul><li>Potenciar el negocio </li></ul></ul></ul><ul><ul><ul><li>Conocer a sus clientes </li></ul></ul></ul><ul><li>Usuarios </li></ul><ul><ul><li>Debe satisfacer sus necesidades </li></ul></ul><ul><ul><ul><li>Cumplir su meta </li></ul></ul></ul><ul><ul><ul><li>No sentirse tonto </li></ul></ul></ul><ul><ul><ul><li>Resguardar su privacidad </li></ul></ul></ul><ul><li>El diseñador debe lograr el balance </li></ul>
    37. 38. Estrategia <ul><li>Necesidades de Accionistas </li></ul><ul><ul><li>Buscamos </li></ul></ul><ul><ul><ul><li>Metas </li></ul></ul></ul><ul><ul><ul><li>Motivaciones </li></ul></ul></ul><ul><ul><ul><li>Mecanismos de evaluación </li></ul></ul></ul><ul><ul><li>Métodos de Investigación </li></ul></ul><ul><ul><ul><li>Entrevistas </li></ul></ul></ul><ul><ul><ul><li>Entrevista contextual </li></ul></ul></ul>
    38. 39. Entrevistando Accionistas <ul><li>Hay que llegar a quien toma las decisiones, y hacerlo participar. </li></ul><ul><li>Descubrir las razones para el nuevo proyecto. </li></ul><ul><ul><ul><ul><li>“ Quiero lucirme con el directorio” </li></ul></ul></ul></ul><ul><li>Cuál es el problema a resolver. </li></ul><ul><ul><ul><ul><li>¿Cuáles son tus 5 mayores problemas? </li></ul></ul></ul></ul><ul><li>Cómo será evaluado. </li></ul>
    39. 40. Análisis Comparativo x x x Radio 4 x x Radio 3 x x x Radio 2 x x x Radio 1 x x x x Mi Radio Directorio Blog Contacto Programacion
    40. 41. Análisis FODA <ul><li>Herramienta del Márketing </li></ul><ul><ul><li>Mi producto, organización, o marca </li></ul></ul><ul><ul><ul><li>Fortalezas </li></ul></ul></ul><ul><ul><ul><li>Debilidades </li></ul></ul></ul><ul><ul><li>Mi mercado </li></ul></ul><ul><ul><ul><li>Oportunidades </li></ul></ul></ul><ul><ul><ul><li>Amenazas </li></ul></ul></ul>
    41. 42. Mapa de Posicionamiento www.marketingteacher.com
    42. 43. Mapa de Posicionamiento Ejercicio: Hacer un mapa de posicionamiento de 5 estados mexicanos. Seleccionar ejes en base a las percepciones más populares.
    43. 44. Estrategia <ul><li>Necesidades de Usuarios </li></ul><ul><ul><li>Buscamos </li></ul></ul><ul><ul><ul><li>Metas </li></ul></ul></ul><ul><ul><ul><li>Lenguaje </li></ul></ul></ul><ul><ul><ul><li>Hábitos </li></ul></ul></ul><ul><ul><li>Métodos de Investigación </li></ul></ul><ul><ul><ul><li>Entrevistas </li></ul></ul></ul><ul><ul><ul><li>Focus Group </li></ul></ul></ul><ul><ul><ul><li>Entrevista contextual </li></ul></ul></ul><ul><ul><ul><li>Estudio etnográfico </li></ul></ul></ul>
    44. 45. Entrevistando <ul><li>Pregunta tus preguntas </li></ul><ul><ul><li>Se neutral. </li></ul></ul><ul><ul><li>Ten preguntas de seguimiento listas. </li></ul></ul><ul><ul><ul><li>Recuerda que no eres un científico. </li></ul></ul></ul><ul><ul><ul><li>Estás acá como diseñador, tratando de averiguar el modelo mental que tiene la gente para el mundo que vas a diseñar. </li></ul></ul></ul><ul><li>Escribe lo que aprendiste </li></ul><ul><ul><li>Busca patrones. </li></ul></ul><ul><ul><li>Piensa en forma crítica. </li></ul></ul>Christina Wodtke (2002)
    45. 46. Entrevistas Efectivas <ul><li>Si le preguntas a alguien “¿Es este sitio fácil de usar?” hay una gran probabilidad que te responda: </li></ul><ul><ul><li>“ Seguro”, y luego habrás diseñado un sitio que funciona de la misma forma que tu competidor. </li></ul></ul><ul><li>Si les preguntas “En una escala del uno al cinco, en la que uno es fácil de usar y cinco es difícil de usar, ¿Cómo describirías este sitio?” estás escondiendo tu opinión y además los haces pensar un poco antes de responder. </li></ul><ul><ul><li>“ Bueno… yo creo que un tres. Siempre puedo encontrar lo que busco, pero cada vez que compro tengo que llenar los formularios nuevamente, es una lata.” </li></ul></ul>Christina Wodtke (2002)
    46. 47. Entrevistas Efectivas <ul><li>Neutral </li></ul><ul><li>Sondeo </li></ul><ul><li>Precisión </li></ul>Christina Wodtke (2002)
    47. 48. Entrevista Neutral <ul><li>Pretende ser un siquiatra. </li></ul><ul><ul><li>Sé cortes e interesado, no social y hablador. </li></ul></ul><ul><li>Otros consejos: </li></ul><ul><ul><li>No reveles tu opinión. </li></ul></ul><ul><ul><li>No te pongas impaciente. </li></ul></ul><ul><ul><li>Pierde la importancia. </li></ul></ul>Christina Wodtke (2002)
    48. 49. Sondeo Efectivo <ul><li>La clave para una entrevista efectiva es mantener a la persona hablando del tema. </li></ul><ul><ul><li>Haz sonidos motivantes pero neutros. </li></ul></ul><ul><ul><ul><li>Usa sonidos tipo “aha”, “hmm” ó “oh” </li></ul></ul></ul><ul><ul><li>Usa tus preguntas de seguimiento. </li></ul></ul><ul><ul><ul><li>Por ejemplo, pregunta: “¿Me puedes contar más sobre eso?” </li></ul></ul></ul><ul><ul><li>Usa frases incompletas. </li></ul></ul><ul><ul><ul><li>“ Entonces, lo que querías lograr era…” </li></ul></ul></ul><ul><ul><li>Recupera a la gente cuando derivan del tema. </li></ul></ul><ul><ul><ul><li>“ Sí, eso puede ser muy frustrante, pero en realidad lo que quiero es que me hables sobre este producto”. </li></ul></ul></ul>Christina Wodtke (2002)
    49. 50. Entrevistas Precisas <ul><li>La meta de estas entrevistas es obtener la mayor cantidad posible de información sobre el entrevistado – no lo que piensan de ellos mismos , sino lo que realmente necesitan y hacen. </li></ul><ul><ul><li>No hagas preguntas de diseño. </li></ul></ul><ul><ul><li>Haz que la gente te muestre en vez de contarte lo más posible. </li></ul></ul><ul><ul><li>Graba lo que oyes y ves. </li></ul></ul>Christina Wodtke (2002)
    50. 51. Necesidades Usuarios: Entrevista Tipo <ul><li>¿Qué otros sitios visitas? </li></ul><ul><li>¿Cómo usas este tipo de producto? </li></ul><ul><li>¿Usas productos de la competencia? </li></ul><ul><li>¿Te interesa algún tipo de herramienta en particular? </li></ul><ul><li>¿Usas la versión no-web del producto? </li></ul>Christina Wodtke (2002) Christina Wodtke (2002)
    51. 52. Investigación Contextual <ul><li>Entrevista se desarrolla en ambiente natural del sujeto </li></ul><ul><li>Permite observar las sutilezas del ambiente y actividad cotidiana </li></ul><ul><ul><li>Ej.: Frecuencia de llamados por telefono </li></ul></ul><ul><li>Ver c ómo la persona ejecuta las tareas y cuáles son sus dificultades </li></ul><ul><li>Cómo alterna el software con elementos físicos </li></ul>
    52. 53. Personajes Javier Tu Mike Will Peter - - - - - - Lou - - - - - - Claudia - - - - - - http://www.iawiki.net/action=browse&id=PersonaDesign&oldid=PersonasDesign
    53. 54. Diseñando tus personajes <ul><li>Los personajes son arquetipos de usuario usados para guiar las decisiones de funcionalidades, navegación, interacción e incluso diseño visual </li></ul><ul><li>Se documentan en descripciones de 1-2 páginas que incluyen patrones de conducta, metas, habilidades, actitudes y ambiente con algunos detalles personales para darle vida </li></ul><ul><li>Los personajes representan patrones de conducta , no cargos de trabajo </li></ul>Kim Goodwin (2001)
    54. 55. <ul><li>Personaje: Claudia escribe comunicados de prensa y los organiza para su distribución en forma impresa. También adapta comunicados de prensa para publicación en el sitio de la compañía, pero alguien más los publica. </li></ul><ul><li>Parte del Escenario: Claudia pega un texto desde un documento Word, y escribe un párrafo adicional. Agrega algunos titulares y lo lee. Quiere estar segura de que sea preciso, así que revisa la ortografía. Cuando el documento está listo, lo envía a su jefe para aprobación. </li></ul>Adaptado de Dona Maurer (2002) “ Me gustaría poder publicar todo yo misma, pero no sé cómo hacerlo” Claudia Silva Relacionadora Pública 36 Años Vive en Ñuñoa con su hija de 5 años Trabaja hace 4 años en una oficina ministerial, encargada de eventos y difusión.
    55. 56. Diseña un sitio para la gente <ul><li>Ahora, analiza las entrevistas, buscando temas recurrentes . Busca especialmente problemas que surgen repetidamente, el lenguaje que la gente usa para describir el contenido y las acciones , y pistas acerca de cómo piensan sobre el tema en cuestión . </li></ul>Christina Wodtke (2002)
    56. 57. Y luego, pruébalo: <ul><li>Prueba un prototipo del sitio con los usuarios potenciales: </li></ul><ul><ul><li>Preparar la prueba del prototipo… </li></ul></ul><ul><ul><li>Evaluar el prototipo… </li></ul></ul><ul><ul><li>Realizar la prueba con el prototipo… </li></ul></ul><ul><ul><li>Analizar los resultados de la prueba… </li></ul></ul><ul><li>Probar el sitio final con los usuarios. </li></ul>Christina Wodtke (2002)
    57. 58. Elementos en una Estrategia de Proyecto Web <ul><li>Definición de Objetivos </li></ul><ul><ul><li>Generales </li></ul></ul><ul><ul><li>Específicos </li></ul></ul><ul><li>Análisis </li></ul><ul><ul><li>Benchmarking </li></ul></ul><ul><ul><li>Posicionamiento </li></ul></ul><ul><ul><li>Foda </li></ul></ul><ul><li>Audiencia </li></ul><ul><ul><li>Segmentación por tipos </li></ul></ul><ul><ul><li>Descripción de los tipos de audiencia en relación con el proyecto </li></ul></ul><ul><li>Estrategia </li></ul><ul><ul><li>Desarrollar y publciar estrategia explícita </li></ul></ul>
    58. 59. Proceso de Diseño Centrado en el Usuario Arquitectura de Información
    59. 60. Evolución de sistemas de organización Louis Rosenfeld Peter Morville (2000)
    60. 61. Esquemas de organización <ul><li>Exactos </li></ul><ul><ul><li>Alfabético </li></ul></ul><ul><ul><li>Cronológico </li></ul></ul><ul><ul><li>Geográfico </li></ul></ul><ul><li>Ambiguos </li></ul><ul><ul><li>Tema o materia </li></ul></ul><ul><ul><li>Tarea </li></ul></ul><ul><ul><li>Audiencia </li></ul></ul><ul><ul><li>Metáfora </li></ul></ul><ul><li>Híbridos </li></ul>Audiencia de hoy Estudiantes Informáticos Bibliotecólogos Diseñadores Periodistas Profesionales Informáticos Bibliotecólogos Diseñadores Periodistas Audiencia de hoy Informáticos Bibliotecólogos Diseñadores Periodistas Estudiantes Profesionales Estudiantes Profesionales Estudiantes Profesionales Estudiantes Profesionales
    61. 62. Ejercicio de Card Sorting La silla musical <ul><li>Agrupar las sillas en conjuntos </li></ul><ul><li>Dar un nombre a cada grupo </li></ul>
    62. 63. Esquemas de Clasificación <ul><li>Taxonomía </li></ul><ul><ul><li>Organización Jerárquica de conceptos </li></ul></ul><ul><ul><ul><li>Origen en la biología </li></ul></ul></ul><ul><ul><li>Construyendo una taxonomía </li></ul></ul><ul><ul><ul><li>Revisión del contenido o elementos a organizar </li></ul></ul></ul><ul><ul><ul><li>Explorar expectativas de crecimiento </li></ul></ul></ul><ul><ul><ul><li>Elaborar cada tema con su especialista </li></ul></ul></ul>
    63. 64. Esquemas de organización <ul><li>Polijerarquía </li></ul><ul><ul><ul><ul><li>Ciencias – Física – Física Teórica – Nicanor Parra </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Artes – Literatura – Poesía – Nicanor Parra </li></ul></ul></ul></ul><ul><li>Clasificación facetada </li></ul><ul><li>Ontologías </li></ul>Peter Morville 1,656,824 Combinaciones Totales 824 Términos Totales 6 Evaluacion (Ratings) 6 Precio 750 Vi ña 16 Region 46 Tipo # Términos en Vocab. Faceta
    64. 65. Clasificación Facetada <ul><li>Epicurious.com </li></ul>www.epicurious.com
    65. 66. Vocabularios controlados, taxonomía y tesauros Louis Rosenfeld y Peter Morville “ Al incorporar sinónimos, la recuperación de resultados pasó de 20% a 80%” “ La mayoría de las quejas que recibimos se debe a la manera en la que las personas buscan; usan las palabras equivocadas.” Furnas et al, 1987 Forrester Research
    66. 67. Tesauros Relaciones Semánticas <ul><li>Equivalencia </li></ul><ul><li>Jerárquica </li></ul><ul><li>Asociativa </li></ul>( Relacionado ) Pehuenche ( Específico ) Piñón ( Genérico) Arboles Nativos De Chile ( Variante ) Araucaria araucana ( Relacionado ) Parque Nacional Conguillío ( Variante ) Pehuén ( Preferido ) Araucaria
    67. 68. Metadata <ul><li>Descriptiva : Metadata acerca de la naturaleza del objeto. Es la más importante para nuestros propósitos y las más usada en la web. </li></ul><ul><ul><ul><ul><li>¿es ficción o un hecho? </li></ul></ul></ul></ul><ul><ul><ul><ul><li>¿es un artículo? </li></ul></ul></ul></ul><ul><ul><ul><ul><li>¿cuál es el tema? </li></ul></ul></ul></ul><ul><ul><ul><ul><li>¿cuáles son los temas relacionados? </li></ul></ul></ul></ul><ul><li>Intrínseca : Metadata acerca de la composición del objeto. </li></ul><ul><ul><ul><ul><li>¿es un documento de Word? </li></ul></ul></ul></ul><ul><ul><ul><ul><li>¿es de 20KB? </li></ul></ul></ul></ul><ul><ul><ul><ul><li>¿es un archivo zip? </li></ul></ul></ul></ul><ul><ul><ul><ul><li>¿nombre de archivo? </li></ul></ul></ul></ul><ul><li>Administrativa : Metadata acerca de la forma en la cual el objeto debe ser manipulado . </li></ul><ul><ul><ul><ul><li>¿es una cosa temporal? </li></ul></ul></ul></ul><ul><ul><ul><ul><li>¿debe ser archivado? </li></ul></ul></ul></ul><ul><ul><ul><ul><li>¿quién es el editor? </li></ul></ul></ul></ul><ul><ul><ul><ul><li>¿ha sido aprobado para su publicación? </li></ul></ul></ul></ul>Christina Wodtke (2002)
    68. 69. Metadata Aplicada
    69. 70. Metadatos Cómo obtenerlos <ul><li>Expertos </li></ul><ul><ul><li>Tradicionalmente los metadatos son generados por un equipo de catalogadores expertos usando un vocabulario controlado. </li></ul></ul><ul><ul><li>Alta calidad, alto costo: problemas de crecimiento. </li></ul></ul><ul><ul><li>No hay conocimiento de los usuarios. </li></ul></ul><ul><li>Autores </li></ul><ul><ul><li>Facilita el proceso de creación. </li></ul></ul><ul><ul><li>No es tan riguroso en el uso del lenguaje. </li></ul></ul><ul><ul><li>No hay conocimiento de los usuarios. </li></ul></ul><ul><li>Usuarios : Folksonomies </li></ul><ul><ul><li>Facilidad de creación. </li></ul></ul><ul><ul><li>Bajo costo, posibilidades de crecimiento. </li></ul></ul><ul><ul><li>Ambigüedad en el lenguaje. </li></ul></ul>
    70. 71. Comparación <ul><li>Taxonomía </li></ul><ul><ul><li>Control </li></ul></ul><ul><ul><li>Autoridad </li></ul></ul><ul><ul><li>Precisión </li></ul></ul><ul><ul><li>Jerarquía, clasificación </li></ul></ul><ul><ul><li>Búsqueda </li></ul></ul><ul><li>Folksonomía </li></ul><ul><ul><li>Flexibilidad </li></ul></ul><ul><ul><li>Simpleza, popularidad </li></ul></ul><ul><ul><li>Utilidad </li></ul></ul><ul><ul><li>Plano, categorización </li></ul></ul><ul><ul><li>Exploración, serendipity </li></ul></ul>
    71. 72. Sistemas de Tagging <ul><li>Incentivos a los usuarios </li></ul><ul><ul><li>Future retrieval </li></ul></ul><ul><ul><li>Contribution and sharing </li></ul></ul><ul><ul><li>Attract attention </li></ul></ul><ul><ul><li>Play and competition </li></ul></ul><ul><ul><li>Self presentation </li></ul></ul><ul><ul><li>Opinion expression </li></ul></ul>Marlow et al. (2006)
    72. 73. www.flickr.com (yahoo!) http://del.icio.us/ Suggested tagging Suggested tagging
    73. 74. www.flickr.com (yahoo!) http://www.flickr.com/ Autor Juego Tags (blind tagging)
    74. 75. www.flickr.com (yahoo!) http://www.flickr.com/photos/tags/fun/clusters/
    75. 76. Sistemas de Rotulado <ul><li>Un rótulo es un término que representa un trozo mayor de información </li></ul><ul><li>Textuales / Icónicos / Mixtos </li></ul><ul><li>Variedades de rótulos </li></ul><ul><ul><ul><li>Links contextuales </li></ul></ul></ul><ul><ul><ul><li>Titulares </li></ul></ul></ul><ul><ul><ul><li>Opciones del Sistema de Navegación </li></ul></ul></ul><ul><ul><ul><li>Botones de las Aplicaciones </li></ul></ul></ul><ul><ul><ul><li>Términos de Indexación </li></ul></ul></ul><ul><li>Sistemas de Rotulado consistentes </li></ul>
    76. 77. Documentación: Vocabulario Visual JJG http://www.jjg.net/ia/visvocab/spanish.html Jesse James Garrett
    77. 78. Navegación Búsqueda Foto: British Blind Sport
    78. 79. Sistemas de Búsqueda Louis Rosenfeld y Peter Morville (2002)
    79. 80. Mapa de Sitio © Dynamic Diagrams, Inc.
    80. 81. Proceso de Diseño Centrado en el Usuario Diseño de Interacción
    81. 82. Interacción: <ul><li>interacción. 1. f. Acción que se ejerce recíprocamente entre dos o más objetos, agentes, fuerzas, funciones, etc. Real Academia Española © </li></ul>
    82. 83. Interfaz: <ul><li>interfaz. (Del ingl. interface, superficie de contacto). 1. f. Inform. Conexión física y funcional entre dos aparatos o sistemas independientes. Real Academia Española © </li></ul>
    83. 84. Dise ño de Interacción <ul><li>En términos simples, diseño de interacción es la definición y diseño del comportamiento de artefactos, ambientes y sistemas , así como los elementos formales que comunican ese comportamiento. </li></ul>Alan Cooper, 2003
    84. 85. Diseño de Interacción
    85. 86. Interacción Humano-Computador Computadores Increíblemente rápidos Libres de error Determinísticos Apáticos Literales Secuenciales Predecibles Amorales Estúpidos Humanos Increíblemente lentos Tienden al error Irracionales Emocionales Inferenciales Aleatorios Inpredecibles Éticos Inteligentes Alan Cooper, 1999
    86. 87. Metodologías <ul><li>Contextual Design </li></ul><ul><ul><li>http://www.incent.com/ </li></ul></ul><ul><li>Rational Unified Process </li></ul><ul><ul><li>http://en.wikipedia.org/wiki/Rational_Unified_Process </li></ul></ul><ul><li>Interaction Design (Personas-Scenarios) </li></ul><ul><ul><li>http://www.evolt.org/article/Practical_Persona_Creation/ </li></ul></ul><ul><li>IconProcess </li></ul><ul><ul><li>http://www.iconprocess.com/iconProcess/iconProcess.php </li></ul></ul><ul><li>eXtreme Programming </li></ul><ul><ul><li>http://www.extremeprogramming.org/ </li></ul></ul><ul><li>Usability Engineering Lifecycle </li></ul><ul><ul><li>http://drdeb.vineyard.net//index.php?loc=11&nloc=1 </li></ul></ul>
    87. 88. Diseño de Interacción Des aplicado
    88. 89. Diseño de Interacción Des aplicado Grabar Imprimir Cerrar
    89. 90. Prototipos de Papel
    90. 91. Prototipos de Papel <ul><li>Computador </li></ul><ul><li>Facilitador </li></ul><ul><li>Usuario </li></ul><ul><li>Observador </li></ul>www.paperprototyping.com El “computador” resalta el item que el usuario ha seleccionado. Un miembro del equipo de desarrollo observa y toma notas. El facilitador (fuera de imagen) está sentado a la derecha del usuario.
    91. 92. Casos de Uso <ul><li>Un Título </li></ul><ul><li>Los Actores </li></ul><ul><li>El Propósito </li></ul><ul><li>La condición inicial </li></ul><ul><li>La condición terminal </li></ul><ul><li>Los pasos principales </li></ul><ul><li>Alternativas </li></ul><ul><li>Otros casos de uso </li></ul>
    92. 93. Análisis de Tareas <ul><li>Convertir metas en tareas </li></ul><ul><ul><li>Enviar mensaje a Pedro </li></ul></ul><ul><ul><ul><li>Componer mensaje </li></ul></ul></ul><ul><ul><ul><li>Enviar mensaje </li></ul></ul></ul><ul><li>Convertir tareas en pasos </li></ul><ul><ul><li>Componer mensaje </li></ul></ul><ul><ul><ul><li>Ingresar dirección de Pedro </li></ul></ul></ul><ul><ul><ul><li>Ingresar título del mensaje </li></ul></ul></ul><ul><ul><ul><li>Escribir texto del mensaje </li></ul></ul></ul><ul><li>Tareas primarias y secundarias </li></ul><ul><ul><li>Buscar dirección de Pedro en Libreta de Direcciones </li></ul></ul><ul><ul><li>Corregir ortografía del texto </li></ul></ul><ul><li>Diseñar flujos para la tarea </li></ul><ul><ul><li>Pantallas </li></ul></ul>Más en http://www.usabilitynet.org/tools/taskanalysis.htm
    93. 94. Análisis de Tareas <ul><li>Convertir metas en tareas </li></ul><ul><ul><li>Enviar mensaje a Pedro </li></ul></ul><ul><ul><ul><li>Componer mensaje </li></ul></ul></ul><ul><ul><ul><li>Enviar mensaje </li></ul></ul></ul><ul><li>Convertir tareas en pasos </li></ul><ul><ul><li>Componer mensaje </li></ul></ul><ul><ul><ul><li>Ingresar dirección de Pedro </li></ul></ul></ul><ul><ul><ul><li>Ingresar título del mensaje </li></ul></ul></ul><ul><ul><ul><li>Escribir texto del mensaje </li></ul></ul></ul><ul><li>Tareas primarias y secundarias </li></ul><ul><ul><li>Buscar dirección de Pedro en Libreta de Direcciones </li></ul></ul><ul><ul><li>Corregir ortografía del texto </li></ul></ul><ul><li>Diseñar flujos para la tarea </li></ul><ul><ul><li>Pantallas </li></ul></ul><ul><li>Ejercicio 1: </li></ul><ul><ul><li>Proceso de pago para librería online. </li></ul></ul><ul><ul><ul><li>Determinar datos del producto a usar. </li></ul></ul></ul><ul><ul><ul><li>Datos del cliente necesarios. </li></ul></ul></ul><ul><ul><ul><li>Flujo de la tarea y datos que serán usados en cada pantalla. </li></ul></ul></ul>
    94. 95. Sistemas de Navegación Navegación Global Navegación Local Navegación contextual ¿Dónde estoy? ¿Qué hay cerca? ¿Qué se relaciona con lo que hay aquí? ¿Dónde puedo ir? ¿Dónde puedo ir? ¿Dónde puedo ir? Louis Rosenfeld y Peter Morville (2002)
    95. 96. Tipos de Sistemas de Navegación <ul><li>Browser </li></ul><ul><li>Principales </li></ul><ul><ul><li>Global </li></ul></ul><ul><ul><li>Local </li></ul></ul><ul><ul><li>Contextual </li></ul></ul><ul><ul><li>Paginación </li></ul></ul><ul><li>Suplementarios </li></ul><ul><ul><li>Mapas de sitio </li></ul></ul><ul><ul><li>Indices </li></ul></ul><ul><ul><li>Guías </li></ul></ul>
    96. 97. Guías para el diseño de sistemas de navegación <ul><li>Navegación que funciona debiera: </li></ul><ul><ul><li>- Ser fácilmente aprendida - Permanecer consistente - Entregar feedback - Aparecer en contexto - Ofrecer alternativas - Requerir una economía de acción y tiempo - Usar rótulos claros y entendibles - Ser apropiada al propósito del sitio - Apoyar las metas y conductas de los usuarios </li></ul></ul>Jennifer Flemming, 1998
    97. 98. Guías para el diseño de sistemas de navegación - Apoyar las metas y conductas de los usuarios - Usa las líneas de visión para mostrar lo que hay adelante - Ser apropiada al propósito del sitio - Entrega capas de información en el mapa - Entrega signos en los puntos de decisión para ayudar a las decisiones de encontrar el camino (wayfinding) - Usar rótulos claros y entendibles - Usa el espacio como un repositorio de conocimiento en evolución - Usa vistas amplias (entrega a los visitantes mapas) - Requerir una economía de acción y tiempo - Personaliza el espacio - No entregues al usuario demasiadas opciones de navegación - Ofrecer alternativas - Cuando en inmersión, usa un mapa tipo “usted está aquí” - Crea regiones de distinto carácter visual - Aparecer en contexto - Usa data de ruta para visualización, dinamismo y corrección de errores - Crea caminos bien estructurados - Entregar feedback - Permite diferentes velocidades de movimiento a través del espacio - Usa hitos para entregar pistas de orientación y locaciones memorables - Permanecer consistente - Usa un modo apropiado de presentación - Crea una identidad para cada locación, diferente de todas las otras - Ser fácilmente aprendida Principios de diseño para un medio computacional Principios de diseño para Wayfinding Navegación que funciona debiera: Designing Navigable Information Spaces, Mark A. Flotz Web Navigation, Jennifer Flemming
    98. 101. Interacción + Navegacion <ul><li>Ejercicio: </li></ul><ul><li>Revisaremos un trámite online en méxico, para su rediseño. </li></ul><ul><li>Primero la Interacción </li></ul><ul><ul><li>Definir los elementos en cada paso </li></ul></ul><ul><li>Luego considerar los elementos de navegación </li></ul>
    99. 102. Proceso de Diseño Centrado en el Usuario Diseño de Información
    100. 103. Diseño de Información <ul><li>Es un campo y un enfoque que intenta diseñar comunicaciones claras y entendibles mediante el cuidado de la estructura , el contexto y la presentación de los datos y la información. </li></ul>Nathan Shedroff
    101. 104. Regla #1: La Web tiene resolución pobre
    102. 105. Diseño de Carteles Carreteros <ul><li>Crea una jerarquía visual en cada página </li></ul><ul><li>Aprovecha las convenciones </li></ul><ul><li>Descompone las páginas en áreas claramente definidas </li></ul><ul><li>Haz obvio lo clickeable </li></ul><ul><li>Minimiza el ruido </li></ul>Steve Krug
    103. 106. Diseño de Información <ul><li>¿Qué? </li></ul><ul><ul><li>El tema central o propósito de la página debe ser lo más claro </li></ul></ul><ul><li>¿Quién? </li></ul><ul><ul><li>Reclamar la propiedad de una página es básico </li></ul></ul><ul><li>¿Dónde? </li></ul><ul><ul><li>Nunca olvidar la naturaleza internacional del medio </li></ul></ul><ul><li>¿Cuándo? </li></ul><ul><ul><li>Indicar la fecha de publicación, las páginas envejecen luego. </li></ul></ul>
    104. 107. Diseño de Interfaces <ul><li>El Tao de la Pagina </li></ul><ul><ul><li>Principio #1: Simplicidad y Elegancia </li></ul></ul><ul><ul><li>Principio #2: Proximidad y Relevancia </li></ul></ul><ul><ul><li>Principio #3: Foco y retroalimentación </li></ul></ul><ul><ul><li>Principio #4: Una Jerarquía de Importancia, una Jerarquía de Tareas </li></ul></ul><ul><ul><li>Principio #5: La herramienta Correcta para el Trabajo Correcto </li></ul></ul>Christina Wodtke (2002)
    105. 108. Diseño de Información Aplicado http://evolt.org/article/Web_Site_Architecture_101/
    106. 109. El Proyecto <ul><li>Estrategia </li></ul><ul><ul><li>Objetivos </li></ul></ul><ul><ul><ul><li>Generales </li></ul></ul></ul><ul><ul><ul><li>Específicos </li></ul></ul></ul><ul><ul><li>Audiencia </li></ul></ul><ul><ul><ul><li>Tipificación de grupos </li></ul></ul></ul><ul><ul><li>Estretegia explicita </li></ul></ul><ul><li>Alcance </li></ul><ul><ul><li>Inventario de Contenidos </li></ul></ul><ul><ul><li>Descripción de Funcionalidades </li></ul></ul><ul><li>Estructura </li></ul><ul><ul><li>Mapa Jerárquico </li></ul></ul><ul><ul><li>Diagrama de Interacción </li></ul></ul><ul><li>Esqueleto </li></ul><ul><ul><li>Wireframes </li></ul></ul>
    107. 110. Revisión Sitios Mexicanos <ul><li>Si el tiempo lo permite! </li></ul>
    108. 111. Temario <ul><li>Conceptos Generales </li></ul><ul><li>Teoría de la Comunicación </li></ul><ul><li>Proceso de Diseño </li></ul><ul><ul><li>Estrategia </li></ul></ul><ul><ul><li>Arquitectura de Información </li></ul></ul><ul><ul><li>Diseño de Interacción </li></ul></ul><ul><ul><li>Diseño de Información </li></ul></ul>
    109. 112. ¡Muchas Gracias! Arquitectura de la Comunicación: Sistemas de Información para la Comunicación Humana Javier Velasco M. [email_address]

    ×