Interfaz Gráfica de UsuarioInterfaz Gráfica de Usuario

Concepto de interfaz:Concepto de interfaz:

Conjunto de componentes empleados Conjunto de componentes empleados por los usuarios para comunicarse con las por los usuarios para comunicarse con las computadoras, esto incluye cosas como computadoras, esto incluye cosas como menús, ventanas, ratón, los “beeps” y menús, ventanas, ratón, los “beeps” y algunos otros sonidos que la computadora algunos otros sonidos que la computadora hace, en general, todos aquellos canales hace, en general, todos aquellos canales por los cuales se permite la comunicación por los cuales se permite la comunicación entre el hombre y la máquina.entre el hombre y la máquina.

ClasificaciónClasificaciónDentro de las interfaces de usuario se Dentro de las interfaces de usuario se distinguir básicamente dos tipos:distinguir básicamente dos tipos:Una Una interfaz de hardwareinterfaz de hardware, , nivel de los nivel de los dispositivos utilizados para ingresar, dispositivos utilizados para ingresar, procesar y entregar los datos: teclado, ratón procesar y entregar los datos: teclado, ratón y pantalla visualizadora.y pantalla visualizadora.Una Una interfaz de softwareinterfaz de software, destinada a , destinada a entregar información acerca de los procesos entregar información acerca de los procesos y herramientas de control, a través de lo que y herramientas de control, a través de lo que el usuario observa habitualmente en la el usuario observa habitualmente en la pantalla.pantalla.

Tipos de interfacesTipos de interfaces::

Interfaz de líneas de comandos (CUIs):Interfaz de líneas de comandos (CUIs):

Es lo característico del DOS, sistema Es lo característico del DOS, sistema operativo de las primeras PCs, y el estilo operativo de las primeras PCs, y el estilo más antiguo de interacción hombre -más antiguo de interacción hombre -maquina. El usuario escribe órdenes maquina. El usuario escribe órdenes utilizando un lenguaje formal con un utilizando un lenguaje formal con un vocabulario y una sintaxis propia (los vocabulario y una sintaxis propia (los mandatos en caso del DOS).mandatos en caso del DOS).

El usuario no suele recibir mucha información por parte del sistema (ejemplo: indicador del DOS), y debe conocer como funciona el ordenador y donde están los programas (nada esta oculto al usuario). El modelo de la interfaz es el programador, no el usuario. Ejemplo del DIR-DEL-DIR, por falta de información del DOS.

Inconveniente: Inconveniente: carga de memoria del usuario (debe carga de memoria del usuario (debe memorizar los mandatos; incluso la ayuda es memorizar los mandatos; incluso la ayuda es difícil de leer).difícil de leer). Nombres no siempre adecuados a las Nombres no siempre adecuados a las funciones.funciones. Significados de mandatos mal comprendidos.Significados de mandatos mal comprendidos.

Ventajas:Ventajas:Potente, flexible y controlado por el usuarioPotente, flexible y controlado por el usuarioEsto es una ventaja para usuarios Esto es una ventaja para usuarios experimentados. La sintaxis es estricta y los experimentados. La sintaxis es estricta y los errores pueden ser graveserrores pueden ser graves

Interfaces de menús:Interfaces de menús: Un menú es una lista de Un menú es una lista de opciones que se muestran en pantallas o en una opciones que se muestran en pantallas o en una ventana de la pantalla para que los usuarios ventana de la pantalla para que los usuarios elijan la opción que deseen. Los menús elijan la opción que deseen. Los menús permiten dos cosas: navegar dentro de un permiten dos cosas: navegar dentro de un sistema, representa rutas que llevan de un sitio sistema, representa rutas que llevan de un sitio a otro y seleccionar elementos de una lista, que a otro y seleccionar elementos de una lista, que representan propiedades o acciones que los representan propiedades o acciones que los usuarios desean realizar sobre algún objeto. usuarios desean realizar sobre algún objeto. Aparecen cuando el ordenador se vuelve una Aparecen cuando el ordenador se vuelve una herramienta de usuario y no solo de herramienta de usuario y no solo de programadores, como lo son las interfaces programadores, como lo son las interfaces gráficas u orientadas a objetos sigue utilizando gráficas u orientadas a objetos sigue utilizando este tipo de interfazeste tipo de interfaz

Existen distintos tipos de menús. Los Existen distintos tipos de menús. Los primeros fueron los menús de pantalla primeros fueron los menús de pantalla completa, estructurados jerárquicamente.completa, estructurados jerárquicamente.

Menús de pantalla completa (norton utilities):Menús de pantalla completa (norton utilities):

Los menús de barra, situados en la parte superior de Los menús de barra, situados en la parte superior de la pantalla, contienen una lista de acciones genéricas la pantalla, contienen una lista de acciones genéricas que dan paso a menús desplegables.que dan paso a menús desplegables.Menú de barra y menú desplegableMenú de barra y menú desplegable:: pueden llevar pueden llevar a su vez a otros, son en cascada, cambian a su vez a otros, son en cascada, cambian dinámicamente, deshabilitan opciones que no están dinámicamente, deshabilitan opciones que no están disponibles en un momento dado (las maca en gris).disponibles en un momento dado (las maca en gris).

Menús en cascada de la barra de inicio de Menús en cascada de la barra de inicio de Windows 95:Windows 95: las paletas o barras de las paletas o barras de herramientas son menús gráficos con acciones, herramientas son menús gráficos con acciones, herramientas y opciones que se pueden colocar herramientas y opciones que se pueden colocar en la pantalla. Se utiliza mucho en programas en la pantalla. Se utiliza mucho en programas gráficos.gráficos.

Paletas de herramientas en Powerpoint:Paletas de herramientas en Powerpoint:

Son los más recientes, se llaman así porque el Son los más recientes, se llaman así porque el contenido del menu depende del contexto de contenido del menu depende del contexto de trabajo del usuario.trabajo del usuario.

Menu contextual de un icono en el esritorio de Menu contextual de un icono en el esritorio de Windows 95:Windows 95: Son bunas para usuarios noveles o Son bunas para usuarios noveles o esporádicos, son fáciles de aprender y recordar.esporádicos, son fáciles de aprender y recordar.

Interfaces graficas (GUIs):Interfaces graficas (GUIs): es una es una representación grafica en la pantalla del representación grafica en la pantalla del ordenador de los programas, datos y objetos, ordenador de los programas, datos y objetos, así como la interacción con ellos. Un GUI así como la interacción con ellos. Un GUI proporciona al usuario las herramientas para proporciona al usuario las herramientas para realizar sus operaciones, más que una lista de realizar sus operaciones, más que una lista de posibles operaciones que el ordenador es capaz posibles operaciones que el ordenador es capaz de hacer.de hacer.

Características de un GUICaracterísticas de un GUI::Monitor gráfico de alta resolución.Monitor gráfico de alta resolución.Dispositivos apuntador (mouse).Dispositivos apuntador (mouse).Los usuarios pueden ver en la pantalla los Los usuarios pueden ver en la pantalla los gráficos y textos tal como se verán impresos.gráficos y textos tal como se verán impresos.Sigue el paradigma de la interacción objeto-Sigue el paradigma de la interacción objeto-acción.acción.Permite al usuario personalizar la interfaz y las Permite al usuario personalizar la interfaz y las interacciones.interacciones.Proporciona flexibilidad en el uso de Proporciona flexibilidad en el uso de dispositivos de entrada (teclado/ratón), entre dispositivos de entrada (teclado/ratón), entre otros. otros.

Interfaces orientadas a objetos (OOUIs):Interfaces orientadas a objetos (OOUIs): su su aspecto es similar al de las GUIs. La diferencia aspecto es similar al de las GUIs. La diferencia es que las GUIs son interfaces orientadas a la es que las GUIs son interfaces orientadas a la aplicación, mientras que las OOUIs están aplicación, mientras que las OOUIs están orientadas al objeto. La tabla siguiente muestra orientadas al objeto. La tabla siguiente muestra las principales diferencias entre ambos estilos las principales diferencias entre ambos estilos de interfaces: de interfaces:

Interfaces orientadas a la Interfaces orientadas a la aplicaciónaplicación

Interfaces orientadas a Interfaces orientadas a objetosobjetos

La aplicación consiste en un icono, una ventana La aplicación consiste en un icono, una ventana principal y varias secundarias.principal y varias secundarias.

El producto consiste en una colección de objetos El producto consiste en una colección de objetos que cooperan y vistas de dichos objetos.que cooperan y vistas de dichos objetos.

Los iconos representan aplicaciones o ventanas Los iconos representan aplicaciones o ventanas abiertas.abiertas.

Los iconos representan objetos se pueden Los iconos representan objetos se pueden manipular directamente.manipular directamente.

Los usuarios deben abrir una aplicación antes de Los usuarios deben abrir una aplicación antes de trabajar con objetos.trabajar con objetos.

Los usuarios abren objetos como vistas en el Los usuarios abren objetos como vistas en el escritorio.escritorio.

Proporciona al usuario las funciones necesarias Proporciona al usuario las funciones necesarias para realizar las tareas.para realizar las tareas.

Proporciona al usuario los materiales necesarios Proporciona al usuario los materiales necesarios para realizar las tareas.para realizar las tareas.

Se centra en la tarea principal determinada por la Se centra en la tarea principal determinada por la aplicación.aplicación.

Se centra en las entradas y salidas de los objetos y Se centra en las entradas y salidas de los objetos y tareas.tareas.

Las tareas relacionadas son soportadas por otras Las tareas relacionadas son soportadas por otras aplicaciones.aplicaciones.

Las tareas relacionadas son soportadas por el uso Las tareas relacionadas son soportadas por el uso de otros objetos.de otros objetos.

Estructura rígida: función.Estructura rígida: función. Estructura flexible: objeto.Estructura flexible: objeto.

Los usuarios pueden quedarse atrapados en una Los usuarios pueden quedarse atrapados en una tarea.tarea.

Los usuarios no deben quedarse atrapados en una Los usuarios no deben quedarse atrapados en una tarea.tarea.

Los usuarios deben seguir la estructura de la Los usuarios deben seguir la estructura de la aplicación.aplicación.

Los usuarios pueden realizar tareas a su propio Los usuarios pueden realizar tareas a su propio gusto.gusto.

Se requieren muchas aplicaciones: una por tarea.Se requieren muchas aplicaciones: una por tarea. Se requieren pocos objetos, que se reutilizan en Se requieren pocos objetos, que se reutilizan en muchas tareas.muchas tareas.

Pasos para el diseño de una interfaz:Pasos para el diseño de una interfaz:

Reunir y analizar la información del usuario:Reunir y analizar la información del usuario:A través de técnicas de requerimiento, que tipo A través de técnicas de requerimiento, que tipo de usuarios van a utilizar el programa, que de usuarios van a utilizar el programa, que tareas van a realizar los usuarios y como las va tareas van a realizar los usuarios y como las va a realizar.a realizar.

Diseñar la interfaz del usuario:Diseñar la interfaz del usuario: Es importante Es importante dedicar tiempo y recursos a esta fase, antes de dedicar tiempo y recursos a esta fase, antes de entrar en codificación, para definir la usabilidad entrar en codificación, para definir la usabilidad del programa, las tareas del usuario, los objetos del programa, las tareas del usuario, los objetos y acciones de la interfaz, entre otras cosas.y acciones de la interfaz, entre otras cosas.

Construir la interfaz de usuario:Construir la interfaz de usuario: realizar un prototipo realizar un prototipo previo, una primera versión del programa que se realice previo, una primera versión del programa que se realice rápidamente y permita visualizar el producto, antes de rápidamente y permita visualizar el producto, antes de codificarlo respectivamente.codificarlo respectivamente.

Validar la interfaz de usuario:Validar la interfaz de usuario: Se debe realizar Se debe realizar pruebas de usabilidad del producto, realizar un diseño pruebas de usabilidad del producto, realizar un diseño que parta del usuario y no del sistema. Existen 11 que parta del usuario y no del sistema. Existen 11 pasos en el proceso de diseño:pasos en el proceso de diseño:

1.1. Entender quien usará el sistema.Entender quien usará el sistema.2.2. Elegir tareas respectivas para el diseño.Elegir tareas respectivas para el diseño.3.3. Plagiar o copiar.Plagiar o copiar.4.4. Bosquejar un diseño.Bosquejar un diseño.5.5. Pensar acerca del diseño.Pensar acerca del diseño.6.6. Crear un prototipo.Crear un prototipo.7.7. Evaluar con los usuarios.Evaluar con los usuarios.8.8. Repetir.Repetir.9.9. Construirla.Construirla.10.10. Rastrearla.Rastrearla.11.11. Cambiarla.Cambiarla.

Técnicas avanzadas para el diseño de una Técnicas avanzadas para el diseño de una interfaces de usuario:interfaces de usuario:

Presentación de información.Presentación de información. Elementos de diseño de pantalla y su Elementos de diseño de pantalla y su

percepción visual.percepción visual. Análisis y elección de controles (duda de Análisis y elección de controles (duda de

controles a utilizar).controles a utilizar). Diferentes controles para los mismos datos.Diferentes controles para los mismos datos.

Funciones de las interfaces:Funciones de las interfaces: Motivación.Motivación. Sistemas vitales. Son de vida o muerte, ya que Sistemas vitales. Son de vida o muerte, ya que

muchas personas depende de ellos. Ejemplo un muchas personas depende de ellos. Ejemplo un sistema para reactores nucleares.sistema para reactores nucleares.

Sistemas comerciales e Industriales: Sirven para Sistemas comerciales e Industriales: Sirven para aumentar la productividad y vender más.aumentar la productividad y vender más.

Sistema de oficina, hogar y juegos.Sistema de oficina, hogar y juegos. Sistemas de investigación: realizar tareas muy Sistemas de investigación: realizar tareas muy

específicas. específicas.

Recomendaciones:Recomendaciones:

El conocimiento de estos puntos clave, nos El conocimiento de estos puntos clave, nos permitirán enfocarnos mejor al estudio de la permitirán enfocarnos mejor al estudio de la materia.materia.

Las interfaces de usuarios, como vínculo de Las interfaces de usuarios, como vínculo de inmersión del hombre en torno de trabajo inmersión del hombre en torno de trabajo tecnológica actual, realzan su importancia en el tecnológica actual, realzan su importancia en el desarrollo de nuevos productos, más eficaces, desarrollo de nuevos productos, más eficaces, eficientes e interactivos, que es lo que el mercado eficientes e interactivos, que es lo que el mercado demandademanda..