SlideShare una empresa de Scribd logo
1 de 29
Diseño de Interfaces
Centradas en el usuario
M.C.V. Liz Palacios Penna.
Maestría en Diseño Multimedia
¿Qué es una UI?
Es la interfaz de usuario, (user interface)
Hace referencia a la interfaz con la que las personas
interaccionan con las máquinas.
También permite que el ordenador envíe un feedback al
usuario, de modo que este pueda dar cuenta de si su acción
se ha llevado a cabo con éxito.
Se trata del puente o
vehículo que permite usar
un ordenador, o cualquier
dispositivo móvil.
Cuenta con los elementos de control visibles (o
sensibles) al usuario, a través de los que puede efectuar
alguna acción.
Estos pueden ser líneas de texto, comandos, gráficos,
etc.
Tipos UI
Existen diversos tipos de métodos interacción
persona-ordenador (IPO), es decir muchos tipos
de interfaces.
Funcionan con comandos. Ejemplo MS dos.
El control mediante una CLI se lleva a cabo a través
del teclado y sin necesidad de usar el ratón.
Command Line Interfaces(CLI)
Text User Interface (TUI).
La interacción con el ordenador se realiza también por
medio del teclado.
Los programadores
pueden recurrir normalmente a
256 caracteres.
Ejemplo: gestores de arranque o
en programas BIOS Setup.
Graphical User Interfaces
(GUI)
Este software se aplica con elementos gráficos de
control e imágenes simbólicas que toman como
referencia de forma creativa a objetos del “mundo real”.
Todos los elementos pueden identificarse de forma sencilla
y su manejo resulta más intuitivo.
Voice User Interface (VUI)
Permite la interacción con los ordenadores por medio del control
por voz.
Ejemplo: Apple ha creado Siri, Amazon introdujo a Alexa,
Microsoft incluye a Cortana.
El usuario puede acceder a las aplicaciones por medio de
llamadas o lo que se transmite a viva voz, los usuarios pueden
trabajar de un modo más efectivo y tener mayor accesibilidad.
Natural User Interface (NUI)
La comunicación con el ordenador se establece a partir del
reconocimiento de gestos. Estas interfaces también
reconocen rostros y objetos. Ejemplo de ello son los diferentes
sensores de cámaras y micrófonos que permiten
una comunicación versátil con el dispositivo.
Tangible User Interfaces (TUI)
Son interfaces de usuario figurativas y
personalizables, es decir, la interacción con el
ordenador se lleva a cabo a través de objetos físicos.
Ejemplo, realidad aumentada.
Perceptual User Interfaces (PUI)
Son las interfaces de usuario controladas por
percepción, lo que se traduce en una
conexión entre las VUI, las GUI y el
reconocimiento electrónico de gestos.
Ejemplo: los drones de la marca DJ.
Brain Computer Interfaces (BCI)
Funcionan con ayuda de electrodos se pueden medir
las ondas cerebrales y hacer que los algoritmos las
traduzcan en comandos de control.
Ejemplo Stephen Hawkin.
La interfaz permite:
1. Que la persona pueda controlar efectivamente las
acciones de la máquina.
1. Que la persona reciba respuestas de la máquina
que le permitan saber si la interacción es correcta y
cómo seguir actuando.
El diseñador de la interfaz debe favorecer que el
proceso de interacción se efectúe de manera fácil e
intuitiva y que el usuario puede acceder a la
información o ejecutar las acciones que desea, de la
manera más simple posible.
El diseño de interfaces implica
conocimientos de
disciplinas muy variadas, como
la psicología, o el diseño
visual.
Uno de los elementos más importantes es
que la interfaz, “genere una buena
experiencia de usuario”.
¿Qué distingue a las buenas
interfaces de usuario?
 Son sencillas
 Intuitivas
 Amigables
 Comprensibles
 Funcionan
 Tienen fácil manejo
 Son usables
 Tienen apariencia reconocible, tienen
buen aspecto
Si es difícil de usar, el tener un diseño llamativo no
tendrá ninguna importancia para el usuario. Para diseñarlas,
se deben realizar tests; conocer al usuario.
Ejemplo: análisis de mapas de calor. Este
tipo de análisis puede hacer un
seguimiento del comportamiento del
usuario a través de los clics, del scroll,
del movimiento ocular o eye tracking y se
registra haciendo uso de gradaciones
cromáticas.
Con respecto al diseño…..“menos es más”.
Debe imperar la función sobre la forma.
Función, claridad y estructura rigen el diseño de la
interfaz.
Se trata de conocer las conductas de uso del
público objetivo y de no restringir la
funcionalidad a través del diseño.
¿Qué es una UI intuitiva?
Los usuarios esperan utilizar la interfaz de manera
intuitiva.
Usar los símbolos que la forman de manera instintiva
Por este motivo...utiliza iconos ya implantados.
La intención es encontrar el equilibrio
perfecto entre estética y funcionalidad para
poder alcanzar el éxito con un producto.
Puede haber integración de interfaces como GUI y VUI.
Ejemplo Iphone.
La interfaz gráfica de usuario
y el SEO
Una buena interfaz gráfica de usuario tiene un efecto
positivo en la optimización en buscadores (SEO).
Si los usuarios se sienten bien en una página web
permanecerán más tiempo en ella, lo que se convierte en
un factor muy importante, puesto que los buscadores
tienen la capacidad de reconocer mediante el tiempo
de permanencia cuál es la relevancia que tiene una
página web para la búsqueda correspondiente.
Al diseñar la UI, debes ponerte en el lugar de los usuarios
que llegan a ella por primera vez.
Si un usuario no tiene una agradable experiencia,
la abandonará y buscará otra UI sencilla y funcional.
Entonces…., !la navegación intuitiva se convierte en un
factor decisivo!
Se recomienda tener enlaces internos significativos
(crawlers de los buscadores).
 Rutas claras
 Rutas cortas
A lo que se llama (navegación con migas de pan o
breadcrumb navigation).
Para ello, se muestra la ruta recorrida en la página en las
barras de menú colocadas en la parte superior de la
propia página.
Ejemplo:
Página de inicio/Ropa de mujer/Pantalones/Vaqueros.
También puedes leer:
http://albertolacalle.com/hci/interfaz.htm
Todos los días interactuamos con interfaces;
analógicas, físicas, digitales, etc, con las que nos
relacionamos sin ser conscientes.
En la medida en que la interacción está más
relacionada con el cuerpo humano la sensación llamada
“transparencia de la interfaz” (kinect,
pantallas táctiles, reconocimiento de gestos, etc) ….todo
parece que funciona de un modo totalmente
intuitivo, casi naturalizado.
….. la evolución en el diseño de las interfaces
va en dirección de intentar acercarse a la máxima
transparencia….

Más contenido relacionado

La actualidad más candente

Analisis de Usabilidad GOMS: Goals, Objectives, Method, Selection of rules.
Analisis de Usabilidad GOMS: Goals, Objectives, Method, Selection of rules.Analisis de Usabilidad GOMS: Goals, Objectives, Method, Selection of rules.
Analisis de Usabilidad GOMS: Goals, Objectives, Method, Selection of rules.Sole Moris
 
Obj 6 capa 2 - mac - llc
Obj 6   capa 2 - mac - llcObj 6   capa 2 - mac - llc
Obj 6 capa 2 - mac - llcPedro Sánchez
 
Prototipado ventajas-y-desventajas
Prototipado ventajas-y-desventajasPrototipado ventajas-y-desventajas
Prototipado ventajas-y-desventajasMisael Cruz
 
Atributos de calidad en el desarrollo de software
Atributos de calidad en el desarrollo de softwareAtributos de calidad en el desarrollo de software
Atributos de calidad en el desarrollo de softwareGustavo Cuen
 
Sistemas expertos
Sistemas expertosSistemas expertos
Sistemas expertosAngel Reyes
 
Taller algoritmos ciclo repetir
Taller algoritmos ciclo repetirTaller algoritmos ciclo repetir
Taller algoritmos ciclo repetirjmachuca
 
Etapas del diseño de Experiencia de usuario
Etapas del diseño de Experiencia de usuarioEtapas del diseño de Experiencia de usuario
Etapas del diseño de Experiencia de usuariomarthagtzmiranda
 
8.1.- IPO. Estilos y paradigmas de interacción
8.1.- IPO. Estilos y paradigmas de interacción8.1.- IPO. Estilos y paradigmas de interacción
8.1.- IPO. Estilos y paradigmas de interacciónDCU_MPIUA
 
Diseño centrado en el usuario
Diseño centrado en el usuarioDiseño centrado en el usuario
Diseño centrado en el usuarioPercy Negrete
 
NESTLE - Analisis y estrategia digital 16022016
NESTLE - Analisis y estrategia digital 16022016NESTLE - Analisis y estrategia digital 16022016
NESTLE - Analisis y estrategia digital 16022016EMPIRE
 

La actualidad más candente (20)

Analisis de Usabilidad GOMS: Goals, Objectives, Method, Selection of rules.
Analisis de Usabilidad GOMS: Goals, Objectives, Method, Selection of rules.Analisis de Usabilidad GOMS: Goals, Objectives, Method, Selection of rules.
Analisis de Usabilidad GOMS: Goals, Objectives, Method, Selection of rules.
 
Los Dominios de Internet
Los Dominios de InternetLos Dominios de Internet
Los Dominios de Internet
 
Obj 6 capa 2 - mac - llc
Obj 6   capa 2 - mac - llcObj 6   capa 2 - mac - llc
Obj 6 capa 2 - mac - llc
 
Prototipado ventajas-y-desventajas
Prototipado ventajas-y-desventajasPrototipado ventajas-y-desventajas
Prototipado ventajas-y-desventajas
 
Multimedia en el hogar
Multimedia en el hogarMultimedia en el hogar
Multimedia en el hogar
 
E commerce (1) examen
E commerce (1) examenE commerce (1) examen
E commerce (1) examen
 
Atributos de calidad en el desarrollo de software
Atributos de calidad en el desarrollo de softwareAtributos de calidad en el desarrollo de software
Atributos de calidad en el desarrollo de software
 
Dhcp
DhcpDhcp
Dhcp
 
Sistemas expertos
Sistemas expertosSistemas expertos
Sistemas expertos
 
Taller de Base de Datos - Unidad 5 transacciones
Taller de Base de Datos - Unidad 5  transaccionesTaller de Base de Datos - Unidad 5  transacciones
Taller de Base de Datos - Unidad 5 transacciones
 
Taller algoritmos ciclo repetir
Taller algoritmos ciclo repetirTaller algoritmos ciclo repetir
Taller algoritmos ciclo repetir
 
Componentes IHC : Factor Humano
Componentes IHC : Factor HumanoComponentes IHC : Factor Humano
Componentes IHC : Factor Humano
 
Etapas del diseño de Experiencia de usuario
Etapas del diseño de Experiencia de usuarioEtapas del diseño de Experiencia de usuario
Etapas del diseño de Experiencia de usuario
 
8.1.- IPO. Estilos y paradigmas de interacción
8.1.- IPO. Estilos y paradigmas de interacción8.1.- IPO. Estilos y paradigmas de interacción
8.1.- IPO. Estilos y paradigmas de interacción
 
Diseño centrado en el usuario
Diseño centrado en el usuarioDiseño centrado en el usuario
Diseño centrado en el usuario
 
Ejercicios if en c#
Ejercicios if en c#Ejercicios if en c#
Ejercicios if en c#
 
Valores y prácticas XP
Valores y prácticas XPValores y prácticas XP
Valores y prácticas XP
 
NESTLE - Analisis y estrategia digital 16022016
NESTLE - Analisis y estrategia digital 16022016NESTLE - Analisis y estrategia digital 16022016
NESTLE - Analisis y estrategia digital 16022016
 
Ingeniería de usabilidad
Ingeniería de usabilidadIngeniería de usabilidad
Ingeniería de usabilidad
 
Internet y redes sociales
Internet y redes socialesInternet y redes sociales
Internet y redes sociales
 

Similar a Diseño de interfaces centradas en el usuario

2.4 Creación de Interfaces.pptx
2.4 Creación de Interfaces.pptx2.4 Creación de Interfaces.pptx
2.4 Creación de Interfaces.pptxRam Vazquez
 
Interfaz de usuario
Interfaz de usuarioInterfaz de usuario
Interfaz de usuarioJose Tabor
 
El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioJhoseannyOsuna
 
El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioCristianJose15
 
Diseño de interfaz importancia y proceso
Diseño de interfaz importancia y procesoDiseño de interfaz importancia y proceso
Diseño de interfaz importancia y procesoadrianazamora
 
UXN CDMX 03-32 - De la ficción a la realidad, el ayer, hoy y mañana de UX y l...
UXN CDMX 03-32 - De la ficción a la realidad, el ayer, hoy y mañana de UX y l...UXN CDMX 03-32 - De la ficción a la realidad, el ayer, hoy y mañana de UX y l...
UXN CDMX 03-32 - De la ficción a la realidad, el ayer, hoy y mañana de UX y l...UX Nights
 
El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioCristianJose15
 
Unidad 5 interfaces-trabajo c.i.27.902.634
Unidad 5 interfaces-trabajo c.i.27.902.634Unidad 5 interfaces-trabajo c.i.27.902.634
Unidad 5 interfaces-trabajo c.i.27.902.634ManuelBarrios56
 
Interfaz de usuario
Interfaz de usuarioInterfaz de usuario
Interfaz de usuarioaaaj1908
 
QUE ES IPO Y EL DISEÑO CENTRADO EN EL USUARIO
QUE ES IPO Y EL DISEÑO CENTRADO EN EL USUARIOQUE ES IPO Y EL DISEÑO CENTRADO EN EL USUARIO
QUE ES IPO Y EL DISEÑO CENTRADO EN EL USUARIOGDYatusae
 
UX no es diseño gráfico
UX no es diseño gráficoUX no es diseño gráfico
UX no es diseño gráficoIsabel Yepes
 
Usabilidad - Cadius en el Día de la Usabilidad - Pamplona
Usabilidad - Cadius en el Día de la Usabilidad - PamplonaUsabilidad - Cadius en el Día de la Usabilidad - Pamplona
Usabilidad - Cadius en el Día de la Usabilidad - PamplonaSusana Heredia
 
Interfaz grafica
Interfaz graficaInterfaz grafica
Interfaz graficajhordy2000
 
Interfaz Usuario
Interfaz UsuarioInterfaz Usuario
Interfaz Usuariotaninof
 
Reconocimiento de Gestos Kinect + C#
Reconocimiento de Gestos Kinect + C#Reconocimiento de Gestos Kinect + C#
Reconocimiento de Gestos Kinect + C#Jhonnatan Flores
 
03 7n2is trabajo-interfaz usuario
03 7n2is trabajo-interfaz usuario03 7n2is trabajo-interfaz usuario
03 7n2is trabajo-interfaz usuarioManuel Mujica
 
03 7n2is trabajo-interfaz usuario
03 7n2is trabajo-interfaz usuario03 7n2is trabajo-interfaz usuario
03 7n2is trabajo-interfaz usuarioManuel Mujica
 
Usabilidad y Workflow de diseño Web
Usabilidad y Workflow de diseño WebUsabilidad y Workflow de diseño Web
Usabilidad y Workflow de diseño WebDNRstudios
 
Interfaz Gráfica de Usuario
Interfaz Gráfica de UsuarioInterfaz Gráfica de Usuario
Interfaz Gráfica de UsuarioLucasDanielB
 

Similar a Diseño de interfaces centradas en el usuario (20)

2.4 Creación de Interfaces.pptx
2.4 Creación de Interfaces.pptx2.4 Creación de Interfaces.pptx
2.4 Creación de Interfaces.pptx
 
Interfaz de usuario
Interfaz de usuarioInterfaz de usuario
Interfaz de usuario
 
El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuario
 
El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuario
 
Diseño de interfaz importancia y proceso
Diseño de interfaz importancia y procesoDiseño de interfaz importancia y proceso
Diseño de interfaz importancia y proceso
 
UXN CDMX 03-32 - De la ficción a la realidad, el ayer, hoy y mañana de UX y l...
UXN CDMX 03-32 - De la ficción a la realidad, el ayer, hoy y mañana de UX y l...UXN CDMX 03-32 - De la ficción a la realidad, el ayer, hoy y mañana de UX y l...
UXN CDMX 03-32 - De la ficción a la realidad, el ayer, hoy y mañana de UX y l...
 
El computador desde el punto de vista del usuario
El computador desde el punto de vista del usuarioEl computador desde el punto de vista del usuario
El computador desde el punto de vista del usuario
 
Unidad 5 interfaces-trabajo c.i.27.902.634
Unidad 5 interfaces-trabajo c.i.27.902.634Unidad 5 interfaces-trabajo c.i.27.902.634
Unidad 5 interfaces-trabajo c.i.27.902.634
 
Interfaz de usuario
Interfaz de usuarioInterfaz de usuario
Interfaz de usuario
 
QUE ES IPO Y EL DISEÑO CENTRADO EN EL USUARIO
QUE ES IPO Y EL DISEÑO CENTRADO EN EL USUARIOQUE ES IPO Y EL DISEÑO CENTRADO EN EL USUARIO
QUE ES IPO Y EL DISEÑO CENTRADO EN EL USUARIO
 
UX no es diseño gráfico
UX no es diseño gráficoUX no es diseño gráfico
UX no es diseño gráfico
 
Usabilidad - Cadius en el Día de la Usabilidad - Pamplona
Usabilidad - Cadius en el Día de la Usabilidad - PamplonaUsabilidad - Cadius en el Día de la Usabilidad - Pamplona
Usabilidad - Cadius en el Día de la Usabilidad - Pamplona
 
Interfaz grafica
Interfaz graficaInterfaz grafica
Interfaz grafica
 
Interfaz Usuario
Interfaz UsuarioInterfaz Usuario
Interfaz Usuario
 
Reconocimiento de Gestos Kinect + C#
Reconocimiento de Gestos Kinect + C#Reconocimiento de Gestos Kinect + C#
Reconocimiento de Gestos Kinect + C#
 
03 7n2is trabajo-interfaz usuario
03 7n2is trabajo-interfaz usuario03 7n2is trabajo-interfaz usuario
03 7n2is trabajo-interfaz usuario
 
03 7n2is trabajo-interfaz usuario
03 7n2is trabajo-interfaz usuario03 7n2is trabajo-interfaz usuario
03 7n2is trabajo-interfaz usuario
 
Taller n°3 patricio vimos
Taller n°3 patricio vimosTaller n°3 patricio vimos
Taller n°3 patricio vimos
 
Usabilidad y Workflow de diseño Web
Usabilidad y Workflow de diseño WebUsabilidad y Workflow de diseño Web
Usabilidad y Workflow de diseño Web
 
Interfaz Gráfica de Usuario
Interfaz Gráfica de UsuarioInterfaz Gráfica de Usuario
Interfaz Gráfica de Usuario
 

Último

Portafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B HuizingaPortafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B Huizingagbhuizinga2000
 
Arquitectura Moderna Le Corbusier- Mies Van Der Rohe
Arquitectura Moderna Le Corbusier- Mies Van Der RoheArquitectura Moderna Le Corbusier- Mies Van Der Rohe
Arquitectura Moderna Le Corbusier- Mies Van Der Roheimariagsg
 
Calendario 2024 Santoral con fase lunar.pdf
Calendario 2024 Santoral con fase lunar.pdfCalendario 2024 Santoral con fase lunar.pdf
Calendario 2024 Santoral con fase lunar.pdfAsol7
 
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdfLAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdfBrbara57940
 
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHEAPORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHEgonzalezdfidelibus
 
2024-EL CAMBIO CLIMATICO Y SUS EFECTOS EN EL PERÚ Y EL MUNDO.pdf
2024-EL CAMBIO CLIMATICO Y SUS EFECTOS EN EL PERÚ Y EL MUNDO.pdf2024-EL CAMBIO CLIMATICO Y SUS EFECTOS EN EL PERÚ Y EL MUNDO.pdf
2024-EL CAMBIO CLIMATICO Y SUS EFECTOS EN EL PERÚ Y EL MUNDO.pdfcnaomi195
 
Gabriela Marcano historia de la arquitectura 2 renacimiento
Gabriela Marcano historia de la arquitectura 2 renacimientoGabriela Marcano historia de la arquitectura 2 renacimiento
Gabriela Marcano historia de la arquitectura 2 renacimientoGabrielaMarcano12
 
TRABAJO DESDE CASA REGION INSULAR.docx.pdf
TRABAJO DESDE CASA REGION INSULAR.docx.pdfTRABAJO DESDE CASA REGION INSULAR.docx.pdf
TRABAJO DESDE CASA REGION INSULAR.docx.pdfDamarysNavarro1
 
Presentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxPresentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxbarbaracantuflr
 
Arquitectura moderna / Nazareth Bermúdez
Arquitectura moderna / Nazareth BermúdezArquitectura moderna / Nazareth Bermúdez
Arquitectura moderna / Nazareth BermúdezNaza59
 
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoTIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoWilsonChambi4
 
SENSICO CURSO DE EXPEDIENTE TECNICO DE OBRAS
SENSICO CURSO DE EXPEDIENTE TECNICO DE OBRASSENSICO CURSO DE EXPEDIENTE TECNICO DE OBRAS
SENSICO CURSO DE EXPEDIENTE TECNICO DE OBRASpaotavo97
 
Quinto-Cuaderno-del-Alumno-optimizado.pdf
Quinto-Cuaderno-del-Alumno-optimizado.pdfQuinto-Cuaderno-del-Alumno-optimizado.pdf
Quinto-Cuaderno-del-Alumno-optimizado.pdfPapiElMejor1
 
Maquetas-modelos-prototipos-Mapa mental-.pdf
Maquetas-modelos-prototipos-Mapa mental-.pdfMaquetas-modelos-prototipos-Mapa mental-.pdf
Maquetas-modelos-prototipos-Mapa mental-.pdforianaandrade11
 
Curso Básico de Windows Word y PowerPoint.pdf
Curso Básico de Windows Word y PowerPoint.pdfCurso Básico de Windows Word y PowerPoint.pdf
Curso Básico de Windows Word y PowerPoint.pdfirisvanegas1990
 
Arquitectos del Movimiento Moderno (Historia de la Arquitectura)
Arquitectos del Movimiento Moderno (Historia de la Arquitectura)Arquitectos del Movimiento Moderno (Historia de la Arquitectura)
Arquitectos del Movimiento Moderno (Historia de la Arquitectura)LeonardoDantasRivas
 
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfCERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfasnsdt
 
PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .Rosa329296
 
EL CONCEPTO Y EL PARTIDO ARQUITECTONICO.pdf
EL CONCEPTO Y EL PARTIDO ARQUITECTONICO.pdfEL CONCEPTO Y EL PARTIDO ARQUITECTONICO.pdf
EL CONCEPTO Y EL PARTIDO ARQUITECTONICO.pdfCeciliaTernR1
 
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura ModernaLe Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Modernasofpaolpz
 

Último (20)

Portafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B HuizingaPortafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B Huizinga
 
Arquitectura Moderna Le Corbusier- Mies Van Der Rohe
Arquitectura Moderna Le Corbusier- Mies Van Der RoheArquitectura Moderna Le Corbusier- Mies Van Der Rohe
Arquitectura Moderna Le Corbusier- Mies Van Der Rohe
 
Calendario 2024 Santoral con fase lunar.pdf
Calendario 2024 Santoral con fase lunar.pdfCalendario 2024 Santoral con fase lunar.pdf
Calendario 2024 Santoral con fase lunar.pdf
 
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdfLAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
 
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHEAPORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
 
2024-EL CAMBIO CLIMATICO Y SUS EFECTOS EN EL PERÚ Y EL MUNDO.pdf
2024-EL CAMBIO CLIMATICO Y SUS EFECTOS EN EL PERÚ Y EL MUNDO.pdf2024-EL CAMBIO CLIMATICO Y SUS EFECTOS EN EL PERÚ Y EL MUNDO.pdf
2024-EL CAMBIO CLIMATICO Y SUS EFECTOS EN EL PERÚ Y EL MUNDO.pdf
 
Gabriela Marcano historia de la arquitectura 2 renacimiento
Gabriela Marcano historia de la arquitectura 2 renacimientoGabriela Marcano historia de la arquitectura 2 renacimiento
Gabriela Marcano historia de la arquitectura 2 renacimiento
 
TRABAJO DESDE CASA REGION INSULAR.docx.pdf
TRABAJO DESDE CASA REGION INSULAR.docx.pdfTRABAJO DESDE CASA REGION INSULAR.docx.pdf
TRABAJO DESDE CASA REGION INSULAR.docx.pdf
 
Presentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxPresentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptx
 
Arquitectura moderna / Nazareth Bermúdez
Arquitectura moderna / Nazareth BermúdezArquitectura moderna / Nazareth Bermúdez
Arquitectura moderna / Nazareth Bermúdez
 
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoTIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
 
SENSICO CURSO DE EXPEDIENTE TECNICO DE OBRAS
SENSICO CURSO DE EXPEDIENTE TECNICO DE OBRASSENSICO CURSO DE EXPEDIENTE TECNICO DE OBRAS
SENSICO CURSO DE EXPEDIENTE TECNICO DE OBRAS
 
Quinto-Cuaderno-del-Alumno-optimizado.pdf
Quinto-Cuaderno-del-Alumno-optimizado.pdfQuinto-Cuaderno-del-Alumno-optimizado.pdf
Quinto-Cuaderno-del-Alumno-optimizado.pdf
 
Maquetas-modelos-prototipos-Mapa mental-.pdf
Maquetas-modelos-prototipos-Mapa mental-.pdfMaquetas-modelos-prototipos-Mapa mental-.pdf
Maquetas-modelos-prototipos-Mapa mental-.pdf
 
Curso Básico de Windows Word y PowerPoint.pdf
Curso Básico de Windows Word y PowerPoint.pdfCurso Básico de Windows Word y PowerPoint.pdf
Curso Básico de Windows Word y PowerPoint.pdf
 
Arquitectos del Movimiento Moderno (Historia de la Arquitectura)
Arquitectos del Movimiento Moderno (Historia de la Arquitectura)Arquitectos del Movimiento Moderno (Historia de la Arquitectura)
Arquitectos del Movimiento Moderno (Historia de la Arquitectura)
 
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfCERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
 
PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .
 
EL CONCEPTO Y EL PARTIDO ARQUITECTONICO.pdf
EL CONCEPTO Y EL PARTIDO ARQUITECTONICO.pdfEL CONCEPTO Y EL PARTIDO ARQUITECTONICO.pdf
EL CONCEPTO Y EL PARTIDO ARQUITECTONICO.pdf
 
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura ModernaLe Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
 

Diseño de interfaces centradas en el usuario

  • 1. Diseño de Interfaces Centradas en el usuario M.C.V. Liz Palacios Penna. Maestría en Diseño Multimedia
  • 2. ¿Qué es una UI? Es la interfaz de usuario, (user interface) Hace referencia a la interfaz con la que las personas interaccionan con las máquinas.
  • 3. También permite que el ordenador envíe un feedback al usuario, de modo que este pueda dar cuenta de si su acción se ha llevado a cabo con éxito. Se trata del puente o vehículo que permite usar un ordenador, o cualquier dispositivo móvil.
  • 4. Cuenta con los elementos de control visibles (o sensibles) al usuario, a través de los que puede efectuar alguna acción. Estos pueden ser líneas de texto, comandos, gráficos, etc.
  • 5. Tipos UI Existen diversos tipos de métodos interacción persona-ordenador (IPO), es decir muchos tipos de interfaces.
  • 6. Funcionan con comandos. Ejemplo MS dos. El control mediante una CLI se lleva a cabo a través del teclado y sin necesidad de usar el ratón. Command Line Interfaces(CLI)
  • 7. Text User Interface (TUI). La interacción con el ordenador se realiza también por medio del teclado. Los programadores pueden recurrir normalmente a 256 caracteres. Ejemplo: gestores de arranque o en programas BIOS Setup.
  • 8. Graphical User Interfaces (GUI) Este software se aplica con elementos gráficos de control e imágenes simbólicas que toman como referencia de forma creativa a objetos del “mundo real”. Todos los elementos pueden identificarse de forma sencilla y su manejo resulta más intuitivo.
  • 9. Voice User Interface (VUI) Permite la interacción con los ordenadores por medio del control por voz. Ejemplo: Apple ha creado Siri, Amazon introdujo a Alexa, Microsoft incluye a Cortana. El usuario puede acceder a las aplicaciones por medio de llamadas o lo que se transmite a viva voz, los usuarios pueden trabajar de un modo más efectivo y tener mayor accesibilidad.
  • 10. Natural User Interface (NUI) La comunicación con el ordenador se establece a partir del reconocimiento de gestos. Estas interfaces también reconocen rostros y objetos. Ejemplo de ello son los diferentes sensores de cámaras y micrófonos que permiten una comunicación versátil con el dispositivo.
  • 11. Tangible User Interfaces (TUI) Son interfaces de usuario figurativas y personalizables, es decir, la interacción con el ordenador se lleva a cabo a través de objetos físicos. Ejemplo, realidad aumentada.
  • 12. Perceptual User Interfaces (PUI) Son las interfaces de usuario controladas por percepción, lo que se traduce en una conexión entre las VUI, las GUI y el reconocimiento electrónico de gestos. Ejemplo: los drones de la marca DJ.
  • 13. Brain Computer Interfaces (BCI) Funcionan con ayuda de electrodos se pueden medir las ondas cerebrales y hacer que los algoritmos las traduzcan en comandos de control. Ejemplo Stephen Hawkin.
  • 14. La interfaz permite: 1. Que la persona pueda controlar efectivamente las acciones de la máquina. 1. Que la persona reciba respuestas de la máquina que le permitan saber si la interacción es correcta y cómo seguir actuando.
  • 15. El diseñador de la interfaz debe favorecer que el proceso de interacción se efectúe de manera fácil e intuitiva y que el usuario puede acceder a la información o ejecutar las acciones que desea, de la manera más simple posible.
  • 16. El diseño de interfaces implica conocimientos de disciplinas muy variadas, como la psicología, o el diseño visual.
  • 17. Uno de los elementos más importantes es que la interfaz, “genere una buena experiencia de usuario”.
  • 18. ¿Qué distingue a las buenas interfaces de usuario?  Son sencillas  Intuitivas  Amigables  Comprensibles  Funcionan  Tienen fácil manejo  Son usables  Tienen apariencia reconocible, tienen buen aspecto
  • 19. Si es difícil de usar, el tener un diseño llamativo no tendrá ninguna importancia para el usuario. Para diseñarlas, se deben realizar tests; conocer al usuario. Ejemplo: análisis de mapas de calor. Este tipo de análisis puede hacer un seguimiento del comportamiento del usuario a través de los clics, del scroll, del movimiento ocular o eye tracking y se registra haciendo uso de gradaciones cromáticas.
  • 20. Con respecto al diseño…..“menos es más”. Debe imperar la función sobre la forma. Función, claridad y estructura rigen el diseño de la interfaz. Se trata de conocer las conductas de uso del público objetivo y de no restringir la funcionalidad a través del diseño.
  • 21. ¿Qué es una UI intuitiva? Los usuarios esperan utilizar la interfaz de manera intuitiva. Usar los símbolos que la forman de manera instintiva Por este motivo...utiliza iconos ya implantados.
  • 22. La intención es encontrar el equilibrio perfecto entre estética y funcionalidad para poder alcanzar el éxito con un producto. Puede haber integración de interfaces como GUI y VUI. Ejemplo Iphone.
  • 23. La interfaz gráfica de usuario y el SEO Una buena interfaz gráfica de usuario tiene un efecto positivo en la optimización en buscadores (SEO). Si los usuarios se sienten bien en una página web permanecerán más tiempo en ella, lo que se convierte en un factor muy importante, puesto que los buscadores tienen la capacidad de reconocer mediante el tiempo de permanencia cuál es la relevancia que tiene una página web para la búsqueda correspondiente.
  • 24. Al diseñar la UI, debes ponerte en el lugar de los usuarios que llegan a ella por primera vez. Si un usuario no tiene una agradable experiencia, la abandonará y buscará otra UI sencilla y funcional. Entonces…., !la navegación intuitiva se convierte en un factor decisivo!
  • 25. Se recomienda tener enlaces internos significativos (crawlers de los buscadores).  Rutas claras  Rutas cortas A lo que se llama (navegación con migas de pan o breadcrumb navigation).
  • 26. Para ello, se muestra la ruta recorrida en la página en las barras de menú colocadas en la parte superior de la propia página. Ejemplo: Página de inicio/Ropa de mujer/Pantalones/Vaqueros. También puedes leer: http://albertolacalle.com/hci/interfaz.htm
  • 27. Todos los días interactuamos con interfaces; analógicas, físicas, digitales, etc, con las que nos relacionamos sin ser conscientes.
  • 28. En la medida en que la interacción está más relacionada con el cuerpo humano la sensación llamada “transparencia de la interfaz” (kinect, pantallas táctiles, reconocimiento de gestos, etc) ….todo parece que funciona de un modo totalmente intuitivo, casi naturalizado.
  • 29. ….. la evolución en el diseño de las interfaces va en dirección de intentar acercarse a la máxima transparencia….