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 la información y sistemas de navegación
DÍA 5
ESDIEscola Superior de Disseny
Por dónde vamos
Por dónde vamos
SKETCH
TEST
ITERA
sketch
WIREFRAME PROTOTYPE
DESIGN
DEVELOP
ITERA
wireframe
ITERA
prototipo
TEST TEST
COPY...
hablando de…
SUPERCIFIE
ESQUELETO
ESTRUCTURA
ALCANCE
ESTRATEGIA
Conceptualización
Culminación
Hablando de…
el contenido…
Tus usuarios al igual una persona en su primera cita, al
principio se fijan en lo que les aportas
Contenido…
pero antes…
Infoxicación
en 2020 tendremos 35 ZettaBytes
Pero antes…
“La Arquitectura de la Información es un campo de
estudio que surge a partir de la necesidad de dar
solución a problemas d...
“La Arquitectura de la Información es un campo de
estudio que surge a partir de la necesidad de dar
solución a problemas d...
¿Arquitectura de la información?
UX
Usabilidad
AI
¡ No podría vivir sin mi iPad!
¡ Es muy fácil de usar!
¡Todo lo encuentr...
¿AI, IA, RI, IR, ?
AI vs …
“IA is the information backbone of the site; navigation refers to those
elements in the UI that allow users to reach speci...
“IA is the information backbone of the site; navigation refers to those
elements in the UI that allow users to reach speci...
Navegación
Estructuras para organizar la navegación
Alfabético
Navigation
Navegación
Estructuras para organizar la navegación
Cronológico
NavegaciónNavigation
Navegación
Estructuras para organizar la navegación
Geográfico
NavegaciónNavigation
Navegación
Temático Audiencia
Social Tarea
NavegaciónNavigation
NavegaciónNavegaciónNavigation
Todos los caminos 

llevan al contenido
NavegaciónNavegaciónNavigation
Todos los caminos 

llevan al contenido
el contenido
NavegaciónContent
el contenido…
Títulos

formularios

etiquetas

botones

gráficos

menús

desplegables

enlaces

ayuda

descripción de las ...
el contenido…
¿Quién genera el contenido?
En el mundo imaginario o “algunas empresas”
Content
el contenido…
¿Cómo conseguimos
tener un buen contenido?
Content
Un buen contenido
Conoce a los usuarios
BRIEF INICIAL
¿Quién utilizará tu producto?
¿Cual es su problema?¿Por qué?
¿Cuándo...
Un buen contenido
Conoce a la competencia
Benchmark
¿Quién utilizará tu producto?
¿Cual es su problema?¿Por qué?
¿Cuándo?¿...
Un buen contenidoUn buen contenido
Identifica tus usuarios
PERSONAS & ESCENARIOS3
Content
Un buen contenidoUn buen contenido
Revisa el contenido actual
y su tono
4
Content
Un buen contenidoUn buen contenido
¿TIENES 5 SEGUNDOS?
Christine Perfetti (2005)
Content
Un buen contenidoUn buen contenido
¿TIENES 5 SEGUNDOS?
Content
Un buen contenidoUn buen contenido
Otros test…
Content
Un buen contenidoUn buen contenido
Conoce el modelo mental de
tus usuarios
5
Modelos mentales
Modelo mental
CardSorting
(ordenación de tarjetas)
Técnica que facilita la organización de
contenidos y nos ayuda con la
“...
Modelo mentalModelos mentales
Let’s do it
CardSorting
¿Qué tipo de CardSorting necesitamos?
El usuario puede agrupar las categorías
libremente en el número de conju...
CardSorting
Los grupos o conjuntos están
predefinidos y etiquetados y el usuario
únicamente deberá colocar cada
categoría ...
CardSorting
De forma individual los usuarios organizan el contenido
dependiendo del cardsorting cerrado o abierto

Individ...
CardSorting
Preparación del CardSorting
1.- Piensa tipo de cardsorting
Puede variar si es manual/automático individual/gru...
CardSorting
durante
5.- Comunica que van hacer a los usuarios
6.- Deja claro que no les estas evaluando, ellos
te evaluar ...
CardSorting
9.- Deja que se expliquen
11.- Identifica los puntos débiles
10.- Busca los patrones de los diferentes
1. Tarj...
CardSorting
Tabla de co-ocurrencias o
matriz de similaridad
Dendograma
Escalamiento multidimensional
Cardsorting
Preparaci...
CardSorting
1. Simple
2. Barata
3. Rápida
4. Estándar
5. Los usuarios se sienten
involucrados
6. Base para organizar tu co...
CardSorting
Herramientas online
Cardsorting
Un buen contenidoUn buen contenido
Una especie de evolución del Cart sorting pero para un
árbol de contenido. Antes de cre...
Un buen contenidoUn buen contenido
TreeTest
Resultados de las tareas Análisis de navegación
Tree testing
Realizar un cardsorting y TreeTest online con la herramienta OptimalSort
• Entregar informe de los resultados obtenidos en...
Upcoming SlideShare
Loading in …5
×

Arquitectura información y sistemas de navegación

Repaso sobre la arquitectura de información así como diferentes sistemas de navegación. Se demuestran diferentes técnicas como el cardsorting, treetesting, 5 minutes test...

  • Be the first to comment

  • Be the first to like this

Arquitectura información y sistemas de navegación

  1. 1. Arquitectura de la información y sistemas de navegación DÍA 5 ESDIEscola Superior de Disseny
  2. 2. Por dónde vamos
  3. 3. Por dónde vamos SKETCH TEST ITERA sketch WIREFRAME PROTOTYPE DESIGN DEVELOP ITERA wireframe ITERA prototipo TEST TEST COPY QA Producto AI
  4. 4. hablando de… SUPERCIFIE ESQUELETO ESTRUCTURA ALCANCE ESTRATEGIA Conceptualización Culminación Hablando de…
  5. 5. el contenido… Tus usuarios al igual una persona en su primera cita, al principio se fijan en lo que les aportas Contenido…
  6. 6. pero antes… Infoxicación en 2020 tendremos 35 ZettaBytes Pero antes…
  7. 7. “La Arquitectura de la Información es un campo de estudio que surge a partir de la necesidad de dar solución a problemas derivados de la organización y estructuración de grandes volúmenes de información .” The Information Architecture Institute ¿Arquitectura de la información? AI
  8. 8. “La Arquitectura de la Información es un campo de estudio que surge a partir de la necesidad de dar solución a problemas derivados de la organización y estructuración de grandes volúmenes de información .” The Information Architecture Institute ¿Arquitectura de la información? AI
  9. 9. ¿Arquitectura de la información? UX Usabilidad AI ¡ No podría vivir sin mi iPad! ¡ Es muy fácil de usar! ¡Todo lo encuentro donde esperaba encontrarlo! AI
  10. 10. ¿AI, IA, RI, IR, ? AI vs …
  11. 11. “IA is the information backbone of the site; navigation refers to those elements in the UI that allow users to reach specific information on the site.” Cardello, 2014 ¿AI vs Navigation? AI vs Navigation
  12. 12. “IA is the information backbone of the site; navigation refers to those elements in the UI that allow users to reach specific information on the site.” Cardello, 2014 ¿AI vs Navigation? Navegación Contenido AI vs Navigation
  13. 13. Navegación Estructuras para organizar la navegación Alfabético Navigation
  14. 14. Navegación Estructuras para organizar la navegación Cronológico NavegaciónNavigation
  15. 15. Navegación Estructuras para organizar la navegación Geográfico NavegaciónNavigation
  16. 16. Navegación Temático Audiencia Social Tarea NavegaciónNavigation
  17. 17. NavegaciónNavegaciónNavigation Todos los caminos llevan al contenido
  18. 18. NavegaciónNavegaciónNavigation Todos los caminos llevan al contenido
  19. 19. el contenido NavegaciónContent
  20. 20. el contenido… Títulos formularios etiquetas botones gráficos menús desplegables enlaces ayuda descripción de las imágenes mensajes de error … Content
  21. 21. el contenido… ¿Quién genera el contenido? En el mundo imaginario o “algunas empresas” Content
  22. 22. el contenido… ¿Cómo conseguimos tener un buen contenido? Content
  23. 23. Un buen contenido Conoce a los usuarios BRIEF INICIAL ¿Quién utilizará tu producto? ¿Cual es su problema?¿Por qué? ¿Cuándo?¿Dónde? … 1 Content
  24. 24. Un buen contenido Conoce a la competencia Benchmark ¿Quién utilizará tu producto? ¿Cual es su problema?¿Por qué? ¿Cuándo?¿Dónde? … 2 Un buen contenido Conoce a los usuarios Benchmark Cualitativo: Buenas y malas prácticas Cuantitativo: 2 Busca parámetros específicos de tu producto y compáralo Content
  25. 25. Un buen contenidoUn buen contenido Identifica tus usuarios PERSONAS & ESCENARIOS3 Content
  26. 26. Un buen contenidoUn buen contenido Revisa el contenido actual y su tono 4 Content
  27. 27. Un buen contenidoUn buen contenido ¿TIENES 5 SEGUNDOS? Christine Perfetti (2005) Content
  28. 28. Un buen contenidoUn buen contenido ¿TIENES 5 SEGUNDOS? Content
  29. 29. Un buen contenidoUn buen contenido Otros test… Content
  30. 30. Un buen contenidoUn buen contenido Conoce el modelo mental de tus usuarios 5 Modelos mentales
  31. 31. Modelo mental CardSorting (ordenación de tarjetas) Técnica que facilita la organización de contenidos y nos ayuda con la “encontrabilidad” Su principal finalidad consiste en agrupar etiquetas que tienen una etiqueta del contenido y una funcionalidad ¿Qué es? ¿Cómo? Modelos mentales
  32. 32. Modelo mentalModelos mentales Let’s do it
  33. 33. CardSorting ¿Qué tipo de CardSorting necesitamos? El usuario puede agrupar las categorías libremente en el número de conjuntos que crea necesario y les pone un nombre. Abierto - Nuevos proyectos con muchas etiquetas a organizar, de esta forma aprendemos a categorizar el contenido Cardsorting
  34. 34. CardSorting Los grupos o conjuntos están predefinidos y etiquetados y el usuario únicamente deberá colocar cada categoría en el grupo que crea corresponda. Cerrado Verificar si una clasificación de información es familiar y comprensible para el usuario Cardsorting ¿Qué tipo de CardSorting necesitamos?
  35. 35. CardSorting De forma individual los usuarios organizan el contenido dependiendo del cardsorting cerrado o abierto Individual Un grupo de usuarios ordena las tarjetas consensuando cada agrupación Colectivo Cardsorting ¿Qué tipo de CardSorting necesitamos?
  36. 36. CardSorting Preparación del CardSorting 1.- Piensa tipo de cardsorting Puede variar si es manual/automático individual/grupo antes 2.- Recluta y cita a tus participantes (mínimo 15 usuarios) 3.- Identifica y rotula las diferentes etiquetas (entre 30 a 50) Cardsorting
  37. 37. CardSorting durante 5.- Comunica que van hacer a los usuarios 6.- Deja claro que no les estas evaluando, ellos te evaluar a ti y hay diferentes resultados posibles 7.- Reparte las tarjetas para que empiecen a clasificarlas 8.- No des pistas y dedícate a observar que hacen y por que lo hacen Cardsorting Preparación del CardSorting
  38. 38. CardSorting 9.- Deja que se expliquen 11.- Identifica los puntos débiles 10.- Busca los patrones de los diferentes 1. Tarjetas que no se entienden 2. Tarjetas que pueden permanecer a diferentes grupos 3. Rutas alternativas para llegar a un mismo sitio ThinkingAloud Cardsorting Preparación del CardSorting
  39. 39. CardSorting Tabla de co-ocurrencias o matriz de similaridad Dendograma Escalamiento multidimensional Cardsorting Preparación del CardSorting
  40. 40. CardSorting 1. Simple 2. Barata 3. Rápida 4. Estándar 5. Los usuarios se sienten involucrados 6. Base para organizar tu contenido 1. No se tiene en cuenta las casos de uso 2. Resultados muy amplios 3. Análisis puede durar tiempo 4. Tarjetas “superficie” Cardsorting Ventajas y desventajas
  41. 41. CardSorting Herramientas online Cardsorting
  42. 42. Un buen contenidoUn buen contenido Una especie de evolución del Cart sorting pero para un árbol de contenido. Antes de crear un sitio entero pruebo con usuarios si se entiende y la gente es capaz de desarrollar con eficacia. Más allá del cardsorting Treetesting (posicionar contenido en la arquitectura)
  43. 43. Un buen contenidoUn buen contenido TreeTest Resultados de las tareas Análisis de navegación Tree testing
  44. 44. Realizar un cardsorting y TreeTest online con la herramienta OptimalSort • Entregar informe de los resultados obtenidos en el Cardsorting y el treetesting (no os quedéis solo con los resultados, explicad las decisiones que tomaríais). • Si hace falta hacer un cambio a una categoría comentar el por que… • Podéis acompañar el informe con imágenes, gráficos… • Tened en cuenta que si entregarais el informe a cliente no tendría ni idea de lo que le dais… explicadlo todo de manera muy clara 1. Escoger el tipo de Cardsorting que creáis que sea mejor (Explicar el por que) 2. Realizar el Cardsorting con un total de 10 usuarios - Personas - (Explicar el perfil que debe cumplir el usuario que realiza el cardsorting) 3. Analizar y comentar los resultados del Cardsorting en un informe indicando cómo sería el árbol de contenidos de vuestro site/app 4. Una vez finalizado el CardSorting, pensar 3 tareas y testearlo con un Treetest. (enviándolo a los mismos usuarios) Entrega el día 6 de Febrero NOMBRE_ALUMNO_APELLIDOS+NÚMEROCLASE+NOMBREEJERCICIO JohnDoe_2_CardSortingTreetest.pptx

×