0
Tema del día: <ul><ul><li>Interfaz  Hombre-Máquina </li></ul></ul>
Objetivos <ul><li>En esta clase trataremos de: </li></ul><ul><ul><li>Comprender las problemáticas asociadas a la interacci...
Modelos Mentales
Modelos Mentales <ul><li>Un modelo de qué? </li></ul><ul><ul><li>Cómo trabaja el sistema. </li></ul></ul><ul><ul><li>Cuále...
Modelos Mentales <ul><li>Tipos de Modelos </li></ul><ul><ul><li>Substituto: imita la salida del sistema, pero no su operat...
Interfaz de Usuario <ul><li>Qué es una interfaz de usuario? </li></ul><ul><ul><li>Es el conjunto de elementos a través de ...
Interfaz de Usuario <ul><li>A la hora de diseñar un objeto... </li></ul><ul><li>Quiénes son los destinatarios? </li></ul><...
Interfaz de Usuario <ul><li>Interfaz de usuario de un programa </li></ul><ul><ul><li>Conjunto de elementos hardware y soft...
Interfaz de Usuario <ul><li>Componentes Software </li></ul><ul><ul><li>Elementos que el usuario ve, oye, a los que apunta ...
Interfaz de Usuario <ul><li>Hasta hoy las interfaces son en general cuestión de marketing... </li></ul><ul><ul><li>Pobre I...
Interfaz de Usuario <ul><ul><li>Todos los usuarios son iguales? </li></ul></ul>
Interfaz de Usuario <ul><li>No existe una interfaz válida para todos los usuarios y todas las tareas. </li></ul><ul><li>La...
Interfaz de Usuario <ul><li>Modelos de interfaz de usuario </li></ul><ul><ul><li>Usuario. </li></ul></ul><ul><ul><li>Progr...
Interfaz de Usuario <ul><li>Modelo del usuario </li></ul><ul><ul><li>El usuario tiene su propia forma de ver las cosas, y ...
Interfaz de Usuario <ul><li>Metáforas </li></ul><ul><li>Una metáfora asocia un dominio nuevo a uno ya conocido por el usua...
Interfaz de Usuario
Interfaz de Usuario
Interfaz de Usuario <ul><li>Videos sobre Metáforas de Usuario. </li></ul>
Interfaz de Usuario <ul><li>Modelo del Programador </li></ul><ul><ul><li>Es el más fácil de visualizar, al poderse especif...
Interfaz de Usuario <ul><li>Modelo del Diseñador </li></ul>
Interfaz de Usuario <ul><li>Dar control al usuario. </li></ul><ul><ul><li>Permitir a los usuarios utilizar teclado o ratón...
Interfaz de Usuario <ul><li>Dar control al usuario. </li></ul><ul><ul><li>Hacer transparente la interfaz del usuario (este...
Interfaz de Usuario <ul><li>Reducir la carga de memoria del usuario. </li></ul><ul><ul><li>Aliviar carga memoria corto pla...
Interfaz de Usuario
Interfaz de Usuario <ul><li>Consistencia. </li></ul><ul><ul><li>Permite al usuario utilizar conocimiento adquirido en otro...
Interfaz de Usuario <ul><li>Consistencia. </li></ul><ul><ul><li>Consistencia en los resultados de las acciones: misma resp...
Interfaz de Usuario <ul><li>Evolución de las interfaces de usuario. </li></ul><ul><ul><li>Paralela a la evolución de los s...
Interfaz de Usuario <ul><li>Interfaz de línea de comandos. </li></ul><ul><ul><li>Característico de Unix. </li></ul></ul><u...
Interfaz de Usuario <ul><li>Interfaz de línea de comandos. </li></ul><ul><ul><li>El usuario no recibe mucha información po...
Interfaz de Usuario <ul><li>Inconvenientes de la CLI: </li></ul><ul><ul><li>Carga de memoria del usuario </li></ul></ul><u...
Interfaz de Usuario <ul><li>Ventajas de la CLI. </li></ul><ul><ul><li>Potente, flexible y controlado por el usuario. </li>...
Interfaz de Usuario <ul><li>Interfaz de menúes. </li></ul><ul><li>Menú : lista de opciones que se muestran en pantalla o e...
Interfaz de Usuario <ul><li>Tipos de menúes: </li></ul><ul><ul><li>Menúes de pantalla completa. </li></ul></ul><ul><ul><li...
Interfaz de Usuario
Interfaz de Usuario
Interfaz de Usuario
Interfaz de Usuario
Interfaz de Usuario
Interfaz de Usuario
Interfaz de Usuario <ul><li>Interfaz de menúes. </li></ul><ul><ul><li>Bien estructurados, son buenos para usuarios noveles...
Interfaz de Usuario <ul><li>Interfaz de menúes. </li></ul><ul><li>Normas de uso: </li></ul><ul><ul><li>No ocupar demasiado...
Interfaz de Usuario <ul><li>Interfaces gráficas (GUIs). </li></ul><ul><li>GUI : representación gráfica en pantalla de los ...
Interfaz de Usuario <ul><li>Características de un GUI: </li></ul><ul><ul><li>El usuario puede ver en pantalla los gráficos...
Interfaz de Usuario <ul><li>Características de un GUI: </li></ul><ul><ul><li>Existe información visual de las acciones y m...
Interfaz de Usuario <ul><li>Características de un GUI: </li></ul><ul><ul><li>El usuario debe conocer o aprender conceptos ...
Bibliografía <ul><li>Este tema puede ser profundizado leyendo: </li></ul><ul><ul><li>Carretero, Capítulo 2 – Sección 12. <...
Gracias !   Ing. Gabriel E. Arellano [email_address] http://www.gabriel-arellano.com.ar/so/ (2008) Gabriel E. Arellano Per...
Upcoming SlideShare
Loading in...5
×

Interfaz Hombre-Máquina

28,021

Published on

Presentación sobre Interfaz Hombre-Máquina de la cátedra Sistemas Operativos - UTN, FRCU.

Published in: Education
2 Comments
3 Likes
Statistics
Notes
No Downloads
Views
Total Views
28,021
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
807
Comments
2
Likes
3
Embeds 0
No embeds

No notes for slide

Transcript of "Interfaz Hombre-Máquina"

  1. 1. Tema del día: <ul><ul><li>Interfaz Hombre-Máquina </li></ul></ul>
  2. 2. Objetivos <ul><li>En esta clase trataremos de: </li></ul><ul><ul><li>Comprender las problemáticas asociadas a la interacción humano-computador. </li></ul></ul><ul><ul><li>Analizar algunas de las buenas prácticas de diseño de interfaces humano-computador. </li></ul></ul><ul><ul><li>Poder caracterizar los distintos tipos de interfaces de usuario y evaluar sus fortalezas y debilidades. </li></ul></ul>
  3. 3. Modelos Mentales
  4. 4. Modelos Mentales <ul><li>Un modelo de qué? </li></ul><ul><ul><li>Cómo trabaja el sistema. </li></ul></ul><ul><ul><li>Cuáles son sus componentes y cómo se interrelacionan. </li></ul></ul><ul><ul><li>Cuáles son sus procesos internos y cómo afectan a los componentes. </li></ul></ul><ul><li>Qué permite al usuario? </li></ul><ul><ul><li>Construir acciones para tareas nuevas. </li></ul></ul><ul><ul><li>Explicar porqué una acción determinada produce un resultado determinado. </li></ul></ul>
  5. 5. Modelos Mentales <ul><li>Tipos de Modelos </li></ul><ul><ul><li>Substituto: imita la salida del sistema, pero no su operatoria interna. </li></ul></ul><ul><ul><li>Metafórico: se entiende el sistema comparándolo con otro ya conocido. </li></ul></ul><ul><ul><li>Caja de cristal: está compuesto de diferentes metáforas que, en conjunto, describen el sistema. </li></ul></ul><ul><ul><li>Red: se entiende el sistema como una serie de estados transitorios. </li></ul></ul>
  6. 6. Interfaz de Usuario <ul><li>Qué es una interfaz de usuario? </li></ul><ul><ul><li>Es el conjunto de elementos a través de los cuales un usuario interactúa con un objeto que realiza una determinada tarea. </li></ul></ul><ul><ul><li>El ser humano interactúa con los objetos que le rodean, y tiene unas expectativas de cómo deben comportarse, basado en experiencias anteriores con ellos (mapas mentales). </li></ul></ul>
  7. 7. Interfaz de Usuario <ul><li>A la hora de diseñar un objeto... </li></ul><ul><li>Quiénes son los destinatarios? </li></ul><ul><li>Cuáles son sus expectativas? </li></ul><ul><li>El objeto... </li></ul><ul><ul><li>Es conocido. </li></ul></ul><ul><ul><li>Es nuevo. </li></ul></ul>
  8. 8. Interfaz de Usuario <ul><li>Interfaz de usuario de un programa </li></ul><ul><ul><li>Conjunto de elementos hardware y software de un ordenador que presentan información al usuario y le permiten interactuar con la información y con el ordenador. </li></ul></ul><ul><ul><li>También incluye el hardware del sistema: Teclado, Dispositivo apuntador, Monitor, CPU. </li></ul></ul>
  9. 9. Interfaz de Usuario <ul><li>Componentes Software </li></ul><ul><ul><li>Elementos que el usuario ve, oye, a los que apunta o toca en la pantalla para interactuar con el ordenador, así como la información con la que trabaja. </li></ul></ul><ul><ul><li>También es parte del interfaz la documentación: Manuales, Ayuda, Referencia, Tutoriales. </li></ul></ul>
  10. 10. Interfaz de Usuario <ul><li>Hasta hoy las interfaces son en general cuestión de marketing... </li></ul><ul><ul><li>Pobre Interfaz >> Mala Imagen </li></ul></ul><ul><ul><li>Buena Interfaz >> Realza un producto mediocre. </li></ul></ul><ul><ul><li>Lo único importante es VENDER! </li></ul></ul>
  11. 11. Interfaz de Usuario <ul><ul><li>Todos los usuarios son iguales? </li></ul></ul>
  12. 12. Interfaz de Usuario <ul><li>No existe una interfaz válida para todos los usuarios y todas las tareas. </li></ul><ul><li>La mayoría de los programas y S.O ofrecen varias formas de interacción al usuario </li></ul>
  13. 13. Interfaz de Usuario <ul><li>Modelos de interfaz de usuario </li></ul><ul><ul><li>Usuario. </li></ul></ul><ul><ul><li>Programador. </li></ul></ul><ul><ul><li>Diseñador. </li></ul></ul><ul><ul><li>Cada uno tiene su propio esquema mental de la interfaz, que obtiene a través de su experiencia. </li></ul></ul>
  14. 14. Interfaz de Usuario <ul><li>Modelo del usuario </li></ul><ul><ul><li>El usuario tiene su propia forma de ver las cosas, y espera de ellas un comportamiento predecible. </li></ul></ul><ul><ul><li>Estudiar al usuario nos permite saber que espera éste de la interfaz. </li></ul></ul><ul><ul><li>Son de gran importancia las metáforas. </li></ul></ul>
  15. 15. Interfaz de Usuario <ul><li>Metáforas </li></ul><ul><li>Una metáfora asocia un dominio nuevo a uno ya conocido por el usuario </li></ul>
  16. 16. Interfaz de Usuario
  17. 17. Interfaz de Usuario
  18. 18. Interfaz de Usuario <ul><li>Videos sobre Metáforas de Usuario. </li></ul>
  19. 19. Interfaz de Usuario <ul><li>Modelo del Programador </li></ul><ul><ul><li>Es el más fácil de visualizar, al poderse especificar formalmente. </li></ul></ul><ul><ul><li>Los objetos que maneja son distintos de los del usuario y deben de ser ocultados al mismo. </li></ul></ul><ul><ul><li>Normalmente no tienen en cuenta la forma de pensar del usuario y si su perspectiva del ordenador. </li></ul></ul>
  20. 20. Interfaz de Usuario <ul><li>Modelo del Diseñador </li></ul>
  21. 21. Interfaz de Usuario <ul><li>Dar control al usuario. </li></ul><ul><ul><li>Permitir a los usuarios utilizar teclado o ratón. </li></ul></ul><ul><ul><li>Permitir al usuario interrumpir su tarea y continuarla más tarde. </li></ul></ul><ul><ul><li>Utilizar mensajes y textos descriptivos. </li></ul></ul><ul><ul><li>Permitir deshacer. </li></ul></ul><ul><ul><li>Permitir una cómoda navegación dentro del producto y una fácil salida del mismo. </li></ul></ul><ul><ul><li>Permitir distintos niveles de uso del producto para usuarios con distintos niveles de experiencia. </li></ul></ul>
  22. 22. Interfaz de Usuario <ul><li>Dar control al usuario. </li></ul><ul><ul><li>Hacer transparente la interfaz del usuario (este debe creer que trabaja directamente con los objetos). </li></ul></ul><ul><ul><li>Permitir al usuario personalizar la interfaz. </li></ul></ul><ul><ul><li>Permitir al usuario manipular directamente los objetos de la interfaz. </li></ul></ul><ul><li>El usuario debe sentir que tiene el control del sistema </li></ul>
  23. 23. Interfaz de Usuario <ul><li>Reducir la carga de memoria del usuario. </li></ul><ul><ul><li>Aliviar carga memoria corto plazo (deshacer, copiar y pegar, mantener los últimos datos introducidos). </li></ul></ul><ul><ul><li>Reconocimiento antes que recuerdo (elegir de listas mejor que teclear). </li></ul></ul><ul><ul><li>Asociar acciones a los objetos (menú contextual). </li></ul></ul><ul><ul><li>Utilizar metáforas del mundo real (sistema telefónico, agenda). </li></ul></ul><ul><ul><li>Presentar al usuario solo la información que necesita. </li></ul></ul>
  24. 24. Interfaz de Usuario
  25. 25. Interfaz de Usuario <ul><li>Consistencia. </li></ul><ul><ul><li>Permite al usuario utilizar conocimiento adquirido en otros programas. </li></ul></ul><ul><ul><li>Consistencia en la realización de tareas: proporcionar al usuario indicaciones sobre el proceso que esta siguiendo. </li></ul></ul><ul><ul><li>Consistencia Consistencia dentro de un producto y de un producto a otro: Presentación, Comportamiento, Interacción. </li></ul></ul>
  26. 26. Interfaz de Usuario <ul><li>Consistencia. </li></ul><ul><ul><li>Consistencia en los resultados de las acciones: misma respuesta ante misma acción. </li></ul></ul><ul><ul><li>Consistencia en la apariencia estética (iconos, fuentes, colores, distribución de pantallas, ...) </li></ul></ul><ul><ul><li>Fomentar la libre exploración de la interfaz, sin miedo a consecuencias negativas. </li></ul></ul>
  27. 27. Interfaz de Usuario <ul><li>Evolución de las interfaces de usuario. </li></ul><ul><ul><li>Paralela a la evolución de los sistemas operativos. </li></ul></ul><ul><ul><li>Interfaces de línea de mandatos (Command_line user interface, CLIs) </li></ul></ul><ul><ul><li>Interfaces de menús </li></ul></ul><ul><ul><li>Interfaces gráficas (graphical user interfaces, GUIs) </li></ul></ul><ul><ul><li>Interfaces orientadas a objetos (object oriented user interfaces, OOUIs) </li></ul></ul>
  28. 28. Interfaz de Usuario <ul><li>Interfaz de línea de comandos. </li></ul><ul><ul><li>Característico de Unix. </li></ul></ul><ul><ul><li>Estilo más antiguo de interacción hombre-máquina </li></ul></ul><ul><ul><li>Lenguaje formal con vocabulario y sintaxis propia </li></ul></ul><ul><ul><li>Hardware de interacción = teclado </li></ul></ul><ul><ul><li>Orden > acción </li></ul></ul>
  29. 29. Interfaz de Usuario <ul><li>Interfaz de línea de comandos. </li></ul><ul><ul><li>El usuario no recibe mucha información por parte del sistema. </li></ul></ul><ul><ul><li>Debe conocer como funciona el ordenador. </li></ul></ul><ul><ul><li>El modelo de la interfaz es el del programador no del usuario </li></ul></ul><ul><ul><li>Adecuado para usuarios expertos, no noveles. </li></ul></ul>
  30. 30. Interfaz de Usuario <ul><li>Inconvenientes de la CLI: </li></ul><ul><ul><li>Carga de memoria del usuario </li></ul></ul><ul><ul><li>Nombres no siempre adecuados en los mandatos (del, rm, erase) </li></ul></ul><ul><ul><li>Inflexible en la sintaxis </li></ul></ul>
  31. 31. Interfaz de Usuario <ul><li>Ventajas de la CLI. </li></ul><ul><ul><li>Potente, flexible y controlado por el usuario. </li></ul></ul><ul><ul><li>Mejor para usuarios experimentados. </li></ul></ul><ul><ul><li>Para los usuarios expertos es más rápido. </li></ul></ul><ul><li>En muchos casos se incluye una CLI como parte de un interfaz, que se utiliza cuando el usuario tiene más experiencia. Ej. Línea de comandos de Windows. </li></ul>
  32. 32. Interfaz de Usuario <ul><li>Interfaz de menúes. </li></ul><ul><li>Menú : lista de opciones que se muestran en pantalla o en una ventana de la pantalla para que los usuarios elijan la opción que deseen. </li></ul><ul><li>Permiten: </li></ul><ul><ul><li>Navegar dentro de un sistema. </li></ul></ul><ul><ul><li>Seleccionar elementos de una lista, que representan propiedades o acciones que los usuarios desean realizar. </li></ul></ul>
  33. 33. Interfaz de Usuario <ul><li>Tipos de menúes: </li></ul><ul><ul><li>Menúes de pantalla completa. </li></ul></ul><ul><ul><li>Menúes de barras. </li></ul></ul><ul><ul><li>Menúes desplegables. </li></ul></ul><ul><ul><li>Menúes en cascada. </li></ul></ul><ul><ul><li>Paletas o barras de herramientas. </li></ul></ul><ul><ul><li>Menúes contextuales o pop-up. </li></ul></ul>
  34. 34. Interfaz de Usuario
  35. 35. Interfaz de Usuario
  36. 36. Interfaz de Usuario
  37. 37. Interfaz de Usuario
  38. 38. Interfaz de Usuario
  39. 39. Interfaz de Usuario
  40. 40. Interfaz de Usuario <ul><li>Interfaz de menúes. </li></ul><ul><ul><li>Bien estructurados, son buenos para usuarios noveles o esporádicos. </li></ul></ul><ul><ul><li>Son fáciles de aprender y recordar. </li></ul></ul><ul><ul><li>Pueden ser de dificultad distinta, para adaptarse al nivel del usuario. </li></ul></ul>
  41. 41. Interfaz de Usuario <ul><li>Interfaz de menúes. </li></ul><ul><li>Normas de uso: </li></ul><ul><ul><li>No ocupar demasiado espacio de la pantalla </li></ul></ul><ul><ul><li>No colocar demasiados elementos en el menú </li></ul></ul><ul><ul><li>Agrupar elementos de manera lógica </li></ul></ul><ul><ul><li>Permitir personalización por parte del usuario </li></ul></ul><ul><ul><li>Usar una terminología adecuada y consistente en el programa y con otros </li></ul></ul>
  42. 42. Interfaz de Usuario <ul><li>Interfaces gráficas (GUIs). </li></ul><ul><li>GUI : representación gráfica en pantalla de los programas, datos y objetos. </li></ul><ul><li>Características de un GUI: </li></ul><ul><ul><li>Emplea monitor gráfico </li></ul></ul><ul><ul><li>Emplea dispositivos apuntadores </li></ul></ul><ul><ul><li>Promueve la consistencia de la interfaz entre programas </li></ul></ul>
  43. 43. Interfaz de Usuario <ul><li>Características de un GUI: </li></ul><ul><ul><li>El usuario puede ver en pantalla los gráficos y textos tal y como se verán impresos </li></ul></ul><ul><ul><li>Sigue el paradigma de interacción objeto-acción </li></ul></ul><ul><ul><li>Permite transferencia de información entre programas </li></ul></ul><ul><ul><li>Permite manipular en pantalla directamente objetos e información </li></ul></ul><ul><ul><li>Posee muestra visual de información y objetos (iconos y ventanas) </li></ul></ul><ul><ul><li>Proporciona respuesta visual a las acciones del usuario </li></ul></ul>
  44. 44. Interfaz de Usuario <ul><li>Características de un GUI: </li></ul><ul><ul><li>Existe información visual de las acciones y modos del usuario/sistema (menús, paletas) </li></ul></ul><ul><ul><li>Existen controles gráficos (widgets) para la selección e introducción de la información </li></ul></ul><ul><ul><li>Permite a los usuarios personalizar la interfaz y las interacciones </li></ul></ul><ul><ul><li>Proporciona flexibilidad en el uso de dispositivos de entrada (teclado/ratón) </li></ul></ul><ul><ul><li>Permite manipular la información en pantalla, no solo presentarla </li></ul></ul>
  45. 45. Interfaz de Usuario <ul><li>Características de un GUI: </li></ul><ul><ul><li>El usuario debe conocer o aprender conceptos del sistema y del GUI para poder manejarlo </li></ul></ul><ul><ul><li>Utilizan estilo objeto-acción, en contraposición al acción/objeto de los CLI e interfaces de menú </li></ul></ul><ul><li>Inconveniente: Orientados a la aplicación. </li></ul><ul><li>Ventaja: Usa metáforas de la vida real que se adaptan al modelo mental del usuario. </li></ul>
  46. 46. Bibliografía <ul><li>Este tema puede ser profundizado leyendo: </li></ul><ul><ul><li>Carretero, Capítulo 2 – Sección 12. </li></ul></ul>
  47. 47. Gracias ! Ing. Gabriel E. Arellano [email_address] http://www.gabriel-arellano.com.ar/so/ (2008) Gabriel E. Arellano Permission is granted to copy, distribute and/or modify this document under the terms of the GNU Free Documentation License, Version 1.2 or any later version published by the Free Software Foundation; with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts. The GNU Free Documentation License as applicable to this document can be found at: http://www.gnu.org/copyleft/fdl.html
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×