Diseño de Interfaces Gráficas de Usuario

1. Diseño GUI
Electivo Diseño de Interfaces Gráficas de Usuario
ESCUELA DE DISEÑO Y MULTIMEDIA

2. Interfaces DE USUARIO

3. INTERFAZ definiciones
(Del ing. interface)
Conexión física y funcional entre dos sistemas o
dispositivos de cualquier tipo dando una comunicación
entre distintos niveles; se puede definir como el espacio
donde sucede la interacción o el intercambio.

4. INTERFAZ conexión

5. INTERFAZ conexión

6. el problema del DISEÑO
USUARIO
TAREA HERRAMIENTAINTERFAZ
a DISEÑAR

7. INTERFAZ de USUARIO conexión

8. INTERFAZ de USUARIO conexión

9. INTERFAZ de USUARIO conexión

10. INTERFAZ de USUARIO conexión

11. INTERFAZ definiciones
“La interfaz es el sitio donde los bits y las personas se encuentran.”
Nicholas Negroponte
“La interfaz no es un objeto, sino un espacio en el que se articula la
información entre el cuerpo humano, la herramienta o artefacto
comunicativa y objeto de la acción.”
Gui Bonsiepe

12. UI interfaz de usuario (user interface)
INTERFAZ de
SOFTWARE
INTERFAZ de
HARDWARE

13. UI contextos
INTERFAZ como instrumento
Desde esta perspectiva la interfaz es una "prótesis" o "extensión"
de nuestro cuerpo.

15. UI contextos
INTERFAZ como superficie
Transmite instrucciones o intuiciones que nos informan sobre su
uso. Un objeto (real o virtual) nos habla por medio de sus formas,
texturas, colores, etc.

16. UI contextos
INTERFAZ como espacio
Es el lugar de la
interacción, el espacio
donde se desarrollan los
intercambios y sus
manualidades.

17. UI definiciones
La interfaz es la membrana
de comunicación entre los
usuarios y el sistema, por la
que los diseñadores y
desarrolladores pueden
hacer que la tecnología sea
inteligible y sensible a las
necesidades de los usuarios.

18. UI definiciones
Las características del diseño de interfaz pueden facilitar o
impedir la interacción entre usuario y dispositivo.
La interfaz orienta el interés del diseñador.
La interfaz vuelve accesible el carácter instrumental de los
objetos y el contenido comunicativo de la información.
La interfaz transforma los objetos en productos y la simple
existencia física en disponibilidad.

19. UI definiciones
Una interfaz relaciona las capacidades de presentación e interacción del
sistema con el modelo cognoscitivo y perceptual del usuario.
SISTEMAUSUARIO
capacidad de presentación
modelo perceptual
modelo cognoscitivo
capacidad de interacción

20. UI definiciones
Para una interacción hombre-máquina adecuada, la interfaz debe ofrecer a
cada uno de los dos agentes soluciones a sus necesidades, no sólo ser una
pantalla divisoria.
SISTEMAUSUARIO
INTERFAZ
SISTEMAUSUARIO
INTERFAZ

21. UI referentes
En vez de que el
usuario intente hablar
con la máquina en su
idioma, es la máquina
quien debe reflejar el
mundo humano y
comunicarse de forma
inteligible.

22. UI referentes
Todo usuario requiere un tiempo
de adaptación a una interfaz, pero
una buena interfaz se vuelve
invisible al momento de
interactuar con ella. La interfaz
debe hacer sentir al usuario,
seguro y tranquilo, guiarlo de tal
forma, que el sienta el control
total de la situación.

23. UI evolución
CLI GUI NUI OUI
Interfaz de Línea de Comando Interfaz Gráfica de Usuario Interfaz Natural de Usuario Interfaz Orgánica de Usuario

24. UI evolución
CLI
Interfaz de Línea de Comandos
· codificada
· estricta
· abstracta
· estática

25. UI evolución
GUI
Interfaz Gráfica de Usuario
· reconocimiento
· receptivo
· exploratoria
· indirecta

26. UI evolución
GUI
Interfaz Gráfica de Usuario
MultiTouchStylus TouchWIMP

27. UI evolución
NUI
Interfaz Natural de Usuario
· intuitiva
· evocativa
· contextual
· directa

28. UI evolución
OUI
Interfaz Orgánica de Usuario
· síntesis
· fluida
· anticipativa
· extensiva

29. UI evolución

30. EJERCICIO 1
- Identificar 5 ejemplos de Interfaces Gráficas de Usuario con problemas de
visualización, funcionalidad o interacción que estén presentes en distintos tipos de
dispositivo: aplicaciones de escritorio, aplicaciones móviles, videojuegos y otros 2
dispositivos.
Trabajo individual o duplas.
Generar un PPT con imágenes de cada ejemplo y descripción de las situaciones que
no logran ser bien resueltas.
Enviar a jorgecantu@arcos.cl con el asunto: diseñoGUI_nombre alumno_entrega1
ENTREGA 20.05.2016