Introduciendo el concepto de interacción y diseño de interfaz de usuario

1. Introducción
David Díez Cebollero
Departamento de Informática
Universidad Carlos III de Madrid
DISEÑO DE
SISTEMAS INTERACTIVOS
Grado en
Ingeniería Informática

2. Diseño de Sistemas Interactivos
Introducción > Contenido sesión 1
 Entender el concepto de interacción
 Conocer los tres paradigmas de la interacción
 Recordar el concepto de interfaz de usuario
 Recordar aspectos esenciales del diseño de interfaz de usuario
 Tareas de usuario
 Modelo mental del usuario
 Recordar los principios básicos del diseño de interfaz de usuario
 Simplicidad
 Visibilidad
 Seguridad
28/01/2016David Díez Cebollero

3. Diseño de Sistemas Interactivos
Introducción > Experiencia de Usuario (UX)
28/01/2016David Díez Cebollero
En un futuro próximo…

4. Diseño de Sistemas Interactivos
Introducción > Experiencia de Usuario (UX)
28/01/2016David Díez Cebollero
…quizá, más próximo de lo que pensamos

5. Diseño de Sistemas Interactivos
Introducción > Interacción
28/01/2016David Díez Cebollero
Interacción
Conjunto de acciones dirigidas al
intercambio de información entre dos
sistemas.
De manera general, nos referiremos
al intercambio de información entre un
usuario (persona) y un sistema
informático (ordenador).

6. Diseño de Sistemas Interactivos
Introducción > Interacción > Definición
28/01/2016David Díez Cebollero
Interacción
Conjunto de acciones dirigidas al
intercambio de información entre un
ser humano y un sistema informático
en un contexto, actividad o situación
determinada.


7. Diseño de Sistemas Interactivos
Introducción > Interfaz de usuario
28/01/2016David Díez Cebollero

8. Diseño de Sistemas Interactivos
Introducción > Interfaz de usuario
28/01/2016David Díez Cebollero
Elemento de intermediación entre
el usuario y el sistema informático.

9. Diseño de Sistemas Interactivos
Introducción > Interfaz de usuario
28/01/2016David Díez Cebollero

10. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero

11. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero

12. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero
“Understanding the psychology behind
people’s expectations, needs and behaviors is
the foundation of great design. People have
mental models of the way they expect things
to work. Exceeding these expectations creates
a sense of delight or an emotional connection.
Violating these connections can create
frustration or confusion”.
Don Norman

13. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero
“Understanding the psychology behind
people’s expectations, needs and behaviors is
the foundation of great design. People have
mental models of the way they expect things
to work. Exceeding these expectations creates
a sense of delight or an emotional connection.
Violating these connections can create
frustration or confusion”.
Don Norman

14. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero
Objetivos
y tareas
del
usuario

15. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero
“Understanding the psychology behind
people’s expectations, needs and behaviors is
the foundation of great design. People have
mental models of the way they expect things
to work. Exceeding these expectations creates
a sense of delight or an emotional connection.
Violating these connections can create
frustration or confusion”.
Don Norman

16. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero

17. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero
1. establishes the goal
2. formulates plan
3. specifies actions at interface
4. performs action
5. perceives world state
6. interprets world state
7. compares world state with respect to goal

18. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero
MAYA principle (Raymond Loewy)
“Designers and innovators must pave
the way toward the future…
…in gradual steps”.

19. Diseño de Sistemas Interactivos
Introducción > Diseño de interfaz de usuario
28/01/2016David Díez Cebollero
Modelo
mental del
usuario

20. Diseño de Sistemas Interactivos
Introducción >Diseño de interfaz de usuario > Principios
28/01/2016David Díez Cebollero
Simplicidad

21. Diseño de Sistemas Interactivos
Introducción >Diseño de interfaz de usuario > Principios > Simplicidad
28/01/2016David Díez Cebollero

22. Diseño de Sistemas Interactivos
Introducción >Diseño de interfaz de usuario > Principios > Simplicidad
28/01/2016David Díez Cebollero

23. Diseño de Sistemas Interactivos
Introducción >Diseño de interfaz de usuario > Principios > Simplicidad
28/01/2016David Díez Cebollero
80/20 (Ley de Pareto)
Navaja de
Ockham/Occam

24. Diseño de Sistemas Interactivos
Introducción >Diseño de interfaz de usuario > Principios
28/01/2016David Díez Cebollero
Visibilidad

25. Diseño de Sistemas Interactivos
Introducción >Diseño de interfaz de usuario > Principios > Visibilidad
28/01/2016David Díez Cebollero
Affordance
Feedback

26. Diseño de Sistemas Interactivos
Introducción >Diseño de interfaz de usuario > Principios
28/01/2016David Díez Cebollero
Seguridad

27. Diseño de Sistemas Interactivos
Introducción >Diseño de interfaz de usuario > Principios > Seguridad
28/01/2016David Díez Cebollero

28. Diseño de Sistemas Interactivos
Introducción > Contenido sesión 1
28/01/2016David Díez Cebollero
 Entender el concepto de interacción
 Conocer los tres paradigmas de la interacción
 Recordar el concepto de interfaz de usuario
 Recordar aspectos esenciales del diseño de interfaz de usuario
 Tareas de usuario
 Modelo mental del usuario
 Recordar los principios básicos del diseño de interfaz de usuario
 Simplicidad
 Visibilidad
 Seguridad