18
Fase de Diseño Interfaces con el Usuario

Fase de diseño Interfaces de Usuario

Embed Size (px)

Citation preview

Fase de Diseño

Interfaces con el Usuario

GUI (Graphical User Interface )

Una GUI puede ser definida como una Interfaz de Usuario.

IU, es una colección de técnicas y mecanismos para interactuar con objetos.

La navegación por pantalla y los comandos son ejecutados a través de las barras de menú, de los “pop up” sobre las pantallas. También se encuentran selecciones de campos como los “radio buttons”, “check boxes”, “list boxes”, y los campos para escribir textos.

Y todos estos objetos y acciones pueden ser manipulados y seleccionados a través del “mouse”, “joystick”, o el tradicional teclado.

El concepto de Manipulación Directa Shneiderman (1982), fue el primero en utilizar

este concepto para describir este estilo de interacción para sistemas gráficos.

Esto lo realiza por tener las siguientes características: El sistema es como una extensión del mundo real. La visibilidad continua de los objetos y las acciones. Las acciones son rápidas e incrementales con

resultados visibles. Las acciones son fácilmente reversibles.

Ventajas y Desventajas de los Sistemas Gráficos Ventajas

Los símbolos se reorganizan más rápidamente que el texto. Un ejemplo se puede observar en los mensajes de retroalimentación con el icono de exclamación.

Son más rápido de aprender. Son más rápidos de usar y resolver problemas. Son más naturales. Proveen contexto: los objetos visibles, proveen dibujos del contexto común. Son menos errores. Incrementa el sentimiento de control. Mantiene feedback inmediatos. Más atractivo. Puede consumir menos espacio. Reemplaza el lenguaje nacional.

Ventajas y Desventajas de los Sistemas Gráficos Desventajas

Mientras más grande es el diseño, es más complejo. Aprendiendo significados necesarios. No siempre son familiares. Por ejemplo

hay figuras de algunos iconos que no son conocidas o no tienen relación con la acción a ejecutar.

Lineamientos de diseños derivados de experimentos. Inconsistencias en técnicas y terminología. Limitaciones en el ser humano. Por ejemplo: hay personas que se les dificulta

hacer doble clic en los iconos. Limitaciones de producción. Poca prueba en los iconos existentes. No existe un solo estilo de preferencia de interacción. Por ejemplo: no a todos

los usuarios les gustan los iconos. Puede consumir más espacio en la pantalla. Limitaciones de Hardware.

Característica de una GUI

Presentación Visual sofisticada: es el aspecto visual de la interfaz. Es lo que la persona ve sobre la pantalla. Los elementos con los cuales interactúa.

Interacción Pick-and-Click: Los elementos de una pantalla gráfica sobre la cual algunas acciones están siendo ejecutadas debe ser primero identificada. La acción de identificación se refiere al pick y la ejecución de la acción se refiere al clic.

Restringir al colocar objetos en la interfaz: en la pantalla deben estar presentes los objetos necesarios, ni más, ni menos.

Visualización: es un proceso cognitivo que permite a las personas entender la información que es difícil de percibir, porque puede ser abstracto.

Característica de una GUI

Orientación de Objeto: un sistema gráfico consiste de objetos y acciones. Los objetos son las cosas que las personas ven en las pantallas. Y son manipuladas como una unidad. Un buen diseño mantiene al usuario enfocado sobre el objeto, no como se ejecuta las acciones.

Propiedades o atributos de los objetos: las propiedades son las únicas características de un objeto. Estas pueden ayudar a describir un objeto y puede ser cambiado por un usuario. Por ejemplo los estilos de las letras.

Acciones: la gente toma acciones sobre los objetos. Ellas manipulan los objetos de maneras específicas o modifican las propiedades de los objetos.

Vistas: son las distintas maneras de buscar información de un objeto. Ejemplo: se puede ver que tarea ejecuta el objeto, proveen las ayudas acerca de las funciones de los objetos, etc.

¿Existe alguna diferencia entre el diseño de una interfaz tradicional y una interfaz

Web?

La interfaz del usuario en la Web

El diseño de una interfaz Web es esencialmente el diseño y de navegación y la presentación de la información.

Es acerca del contenido, no los datos. Al diseñar una interfaz propia se debe mantener el balance de la

estructura y las interrelaciones de los menús, contenido y otros enlaces de documentos o gráficos.

La meta del diseño es construir una jerarquía de menús y páginas que se enlazan fácilmente.

La Web es un ambiente donde la gente pasa de una página a otra.

Características de las Interfaces Web Variedad de Usuarios. Rápida evolución. Usuarios expertos y novatos comparten el

mismo espacio. Importancia de la impresión inicial del usuario. Tiempo de carga. Ausencia de estándares en general. Buena Navegación.

Acerca de la Navegación

Para navegar exitosamente el usuario debe ser capaz de responder las siguientes preguntas: ¿Dónde estoy? ¿De dónde vengo? ¿A dónde puedo ir? ¿Qué puedo hacer aquí? ¿Cómo llegue aquí? ¿Cómo puedo ir allá? ¿Dónde puedo encontrar tal información?

La estructura Permitirá al lector visualizar todos los contenidos de

una manera fácil y clara. Casi siempre tiene una intencionalidad en referencia a

cómo el usuario va a usar el sitio. Procurar que el usuario encuentre todo al alcance de

su “clic”. Requiere planificación para sitios web con muchas

páginas. Su selección depende de la forma en cómo se van a

ofrecer y entregar los contenidos al usuario.

Tipos de estructuras Jerárquica

Semejante a un árbol invertido. Hay una raíz y muchas ramas.

Permite al lector adentrarse más en la estructura para ir detrás de información más específica.

La información más general se encuentra en los niveles superiores.

Tipos de estructuras Jerárquica

Tipos de estructuras

Lineal Es como recorrer un libro Para caminos fijos y guiados Evita la distracción y la dispersión Sin embargo puede dar la sensación de que el

recorrido es lento. Valido para tours de visitas guiados o tutoriales.

Tipos de estructuras

Lineal con jerarquía Los temas están organizados de una forma

jerárquica. Al mismo tiempo se puede leer todo el contenido de

una forma lineal si se desea. Atiende los gustos de navegación de muchos

usuarios.

Tipos de estructuras

Red No hay ningún orden establecido. Las páginas pueden apuntarse una tras otras. Se corre de que el usuario se pierda y no vea todo el

contenido. Para usuarios avanzados en navegación (con

criterio formado).

Aspectos esenciales de diseño de IU Darle Control al Usuario. Reducir la carga de memoria del Usuario. Consistencia en la Interfaz.