Please enable JavaScript.
Coggle requires JavaScript to display documents.
Diseño de interacción, image, image, image, image, image, image, image,…
Diseño de interacción
Lección 4
video 1 retícula de construcción
conjunto de columnas que funcionan como una guía para organizar espacios
elementos
modulos
unidades de espacio distribuido de Manera uniforme
margenes
limitan el ancho y alto que ocupa el contenido
rejas
son los espacios en blanco entre columnas
video 2 uso de color
elemento indispensable para el diseño de la experiencia
afecta la percepción que el cliente tiene sobre un producto
respuesta emocional del ser humano al estar en contacto con ciertos colores
circulo cromático
representa la forma visual los colores y sus combinaciones
infografía 1 elementos del diseño virtual
implica el uso de
botones: facilita la interacción sobre el usuario y el producto digital
iconos: ofrece información concreta sobre acciones que se pueden ejecutar
imágenes: facilita la comprensión del usuario sobre la información que se aborda
tipografía: tipo de letra que se utiliza en el texto del producto
video 3 creación de mock ups
es la representación grafica de la interfaz de un producto digital
incluye colores tipografía e imágenes
prototipo de alto nivel
se basa en wireframes trabajados
permite probar la accesibilidad del producto
video 4 creación de guías de estilo para el producto digital
documento que contiene las directrices del diseño visual del proyecto
estandarizan las practicas para el diseño de interfaces
permiten que el proyecto tenga un diseño uniforme
fomentan productos útiles y accesibles
definen como diseñar para una plataforma especifica
infografía 2 psicología para el diseño
la navegación intuitiva: acción de guiar al usuario en la utilización de un portal o aplicación web
elementos de la interfaz los cuales deben de ser explicados
la arquitectura de la información debe de estructurase el contenido en el producto digital
posición de iconos menús y multimedia
la dimencion de los controles de la interfaz
infografia 3 ergonomía cognitiva
estudia la relación entre la percepción la memoria y el razonamiento
disciplina que se nutre de los conocimientos
se utiliza para mejorar la usabilidad de los productos digitales
lección 2
Video 1 Arquitectura de la información
consiste en estructurar el contenido de un sitio o aplicación web
facilita el acceso del usuario a la información
"card sorting" agrupación de tarjetas
consiste observar y documentar como un grupo de usuarios asocia y agrupa contenidos
agrupa contenidos sobre un tema para determinar las secciones mas decusadas para un producto digital
infografía 1 mapas de navegación
permite analizar que sección del producto digital faltan y cuales sobran
establece la relación entre contenidos de acuerdo con su afinidad y jerarquía
nivel 2 elementos que son de apoyo para su navegación del usuario
nivel1 contenido primario sección de mayor jerarquia
nivel 3 elementos que no afectan su navegación
Infografía 2 patrones para arquitectura de información
patrones para escritorio
jerarquía estricta
pagina índice que esta asociada a 1 o varias paginas
jerarquía multidimensionales
pagina indice asociada a varias paginas principales, permite el acceso a una o varias paginas
concentrador
sistema de navegación en el que se encuartan todos los enlaces para acceder
lineal
sistema de navegación secuencial
plano
todas las paginas tienen la misma jerarquía
patrones para movil
jerarquico
la pantalla principal tiene enlaces para dirigir al usuario al resto de los contenidos
centralizador
la pantalla principal contiene los enlaces de las interfaces secundarias
tabs
las pestañas tienen la misma jerarquía en la pantalla principal
matrioska
los elementos de la pantalla principal cambia su jerarquía
video 2 wireframes
es la representación grafica de la arquitectura de la información de un producto digital
carece de colores e imágenes
muestra la estructura y distribución de los elementos
Lección 3
video 1 partituras de interacción (Pix)
representa a través de iconos las acciones que desea realizar el usuario final
comunicación por medio de mensajes y acciones
video 2 patrones para el diseño de la información
son utilizados en el diseño de la interacción para reducir los tiempos de desarrollo
son soluciones de terceros
especifican cuando deben utilizarse y como deben ser implementados
