Please enable JavaScript.
Coggle requires JavaScript to display documents.
curso Diseñador de experiencia de usuario - Coggle Diagram
curso Diseñador de experiencia de usuario
leccion 2
Arquitectura de la información
la arquitectura de la informacion consiste en estructural el contenido de un sitio o aplicacion web para facilitar el acceso del usuario a la informacion
Mapas de navegación
identificar el tipo de contenido y su jerarquia en tu producto digital
plasma la jerarquia de los contenidos
Wireframes
representacion grafica de la arquitectura de la infromacion de un producto digital, carece de colores e imagenes ya que su objetivo es mostrar la estructura y distribucion de elementos, no su apariencia
se puede descargar en la web, cualquier herramienta para diseñar wireframes, ya que todas te permiten arrastrar los elementos de diseño y soltarlos dentro de un lienzo digital
Patrones para arquitectura de información
Plano
Todas las páginas tienen la misma jerarquía, por lo que el usuario puede acceder al contenido que sea de su interés de forma directa
Jerárquico
La pantalla principal tiene enlaces para dirigir al usuario al resto de los contenidos y regresar con el mismo recorrido; pero en sentido inverso
Lineal
Consiste en un sistema de navegación secuencial, por lo que el usuario accede a los contenidos del sitio web mediante el recorrido de cada una de las páginas del portal
Centralizador
La pantalla principal de la aplicación contiene los enlaces de las interfaces secundarias
Concentrador
Consiste en un sistema de navegación lateral en donde se encuentran todos los enlaces para que el usuario acceda los contenidos sin necesidad de retroceder para ir a la página principal
Tabs
Las pestañas tienen la misma jerarquía en la pantalla principal, por lo que es necesario que el usuario haga tap en cada una de ellas para acceder a los contenidos de la aplicación
Matrioska
Los elementos de la pantalla principal cambian su jerarquía conforme el dispositivo va escalando en tamaño y viceversa
Jerarquías Multidimensionales
Consiste en una página índice asociada a varias páginas principales que a su vez permiten el acceso a una o varias subpáginas e incluso a elementos que ya estaban relacionados con otras páginas principales
Jerarquía Estricta
Consiste en una página índice que está asociada a una o varias páginas principales que a su vez están ligadas a subpáginas. Para acceder a ellas es necesario hacerlo desde la página “padre”
leccion 4
Creación de mock ups
es la representacion grafica de la interfaz de un producto digital
incluye colores tipografia e imagenes que se utilizaran en el sitio o aplicacion web por loq ue se le considera un prototipo de lato nivel
creación de guías de estilo para el producto digital
es un documento que contiene las directrices del diseño visual del proyecto para que tanto diseñadores como programadores conozcan la tipografia, colores e imagenes que deben utilizar para el producto final
estas guias, estandarizan las practicas para el diseño de interfaces fomentan productos utilices y accesibles
permiten que el proyecto tenga un diseño uniforme auque haya sido realizado por múltiples equipos
Elementos del diseño visual
El diseño visual de un sitio o aplicación web implica el uso de botones, iconos, imágenes, multimedia y tipografíaen las interfaces con la finalidad de obtener un producto de fácil uso (intuitivo) y que sea accesible para todos los usuarios
Uso del color
el color es indispensable para el diseño de la experiencia ya que es capaz de afectar la perspectiva que el cliente tiene sobre un producto
a pesar de que la percepción de los colores es subjetiva y su interpretación depende de cada persona
Psicología para el diseño
La forma en la que una persona aprende a utilizar un producto digital se basa en la estimulación sensorial que recibe a través de la interfaz de éste, de ahí que el término “navegación intuitiva” se refiera a la acción de guiar al usuario final en la utilización de un portal o aplicación web mediante el uso de colores, sonidos y animaciones
Los elementos de la interfaz cuyo funcionamiento debe ser explicado al usuario final mientras utiliza elproducto digital
Los patrones de arquitectura de la información con los que debeestructurarse el contenido de un producto digital
La posición del menú, iconosmultimedia y texto en el layout del sitio web
Las dimensiones de los controles de la interfaz (botones, menús)
Retícula de construcción
es un conjunto de columnas que funcionan como una guia para organizar los espacios en donde se colocan los elementos de la interfaz de un sitio o una aplicacion web
modulos
unidades de espacio distribuido de manera uniforme
margenes
limitan el alto y ancho que ocupa un contenido
rejas
espacios en blanco entre columnas
Ergonomía cognitiva
La ergonomía cognitiva estudia la relación que existe entre la percepción, la memoria y el razonamiento en el aprendizaje de las personas y la forma en como éstas interactúan en ambientes en donde predomina el uso de las tecnologías.
Se utiliza para mejorar la usabilidad de los productos digitales mediante:
•El uso de patrones de arquitectura para diseñar interfaces amigables e intuitivas.
•La implementación de técnicas de diseño responsivo para que la interfaz del producto digital se adapte a dispositivos de cualquier tamaño
Es una disciplina que se nutre de los conocimientos que aportan diversas áreas como la ingeniería, psicología, economía, medicina, entre otras
leccion 3
Patrones para el diseño de la interacción
se utilizan en el diseño de la interaccion para reducir los tiempos de desarrollo, estos te seran para mejorar la usabilidad de tu producto
Partituras de interacción
(PIX) representa a través de iconos las acciones que desea realizar el usuario final y que responde a sus objetivos, intenciones y emotividad
puedes diseñar tu partitura de interaccion con una herramienta online que incluya iconos PIX o en un porcesador de textos
