Guia para realizar una correcta interfaz gráfica de usuario

13
GUÍA PARA REALIZAR UNA CORRECTA INTERFAZ GRÁFICA DE USUARIO REALIZADO POR: LUCIANO SERVETTINI MATERIA: SISTEMAS II CURSO: 3°2° FECHA DE PRESENTACIÓN: 13/06/2016

Transcript of Guia para realizar una correcta interfaz gráfica de usuario

Page 1: Guia para realizar una correcta interfaz gráfica de usuario

GUÍA PARA REALIZAR UNA CORRECTA INTERFAZ GRÁFICA DE USUARIOREALIZADO POR: LUCIANO SERVETTINI

MATERIA: SISTEMAS II

CURSO: 3°2°

FECHA DE PRESENTACIÓN: 13/06/2016

Page 2: Guia para realizar una correcta interfaz gráfica de usuario

INTRODUCCIÓN

Ante el crecimiento de las tecnologías de información y el uso de las aplicaciones

elaboradas a medida para un usuario específico. Podría decirse que para casi toda

actividad que alguien quiera realizar hay una aplicación con ese propósito en

internet.

Sin embargo hay un problema con muchas de estas aplicaciones, que son difíciles de

usar. Mucho más de lo que deberían ser. Este problema, si bien se ve más comúnmente

en aplicaciones gratuitas, hay algunas comerciales que también lo sufren.

Por lo tanto, esto hace notar que tener expertos en interfaces tampoco garantiza el

éxito de las mismas.

A continuación se explican diferentes aspectos para poder realizar una correcta

Interfaz Gráfica de Usuario.

Page 3: Guia para realizar una correcta interfaz gráfica de usuario

ASPECTOS A TENER EN CUENTA

Una de las cuestiones más importantes radica en la Presentación de

la Información, para esto es necesario:

• Organización de elementos en pantalla

• Tipografía

• Color

• Uso de gráficos e ilustraciones

• Animaciones

• Sistema de navegación

Page 4: Guia para realizar una correcta interfaz gráfica de usuario

Organización y Distribución:

La composición es la forma de ordenar y organizar los elementos de la imagen en el

espacio estructural que nos ofrece el formato.

Los objetivos principales son: Lograr equilibrio en componentes que participan. Y

determinar el centro de interés (Un elemento se constituirá como el dominante de la

escena.

o Herencia Visual:

Para componer el espacio en pantalla se debe distribuir la información de acuerdo

a estereotipos: El sentido de la lectura-escritura condiciona el modo de mirar los

objetos y los puntos innatos de atención. La tipografía occidental (de izquierda a

derecha y de arriaba abajo) debe respetarse a la hora de asignar el espacio de

la información. En el extremo superior izquierdo debe ir la información más

importante. En el extremo superior derecho la de menor jerarquía.

Page 5: Guia para realizar una correcta interfaz gráfica de usuario

o Agrupar la información relacionada:

Los recursos visuales para esto son variados. Los más útiles son por cercanía y por

similitud.

Por el contrario, agrupar la información con el uso del color no es un aspecto

positivo, ya que puede traer confusión, cansancio visual, entre otras cosas.

o Diseño Substractivo:

Eliminar todo lo que no ayude a la comunicación visual. Es recomendable

seleccionar sólo información importante y no desperdiciar espacio en otra

irrelevante. También es importante evitar la sobrecarga de información.

A la hora de incorporar botones, hay que tener en cuenta: No poner uno para

cada tarea posible del operador, debe haber botones sólo para las funciones con

resultado obvio, y no poner botones para acciones potencialmente destructivas, ya

que se pueda activar por error.

Page 6: Guia para realizar una correcta interfaz gráfica de usuario

Características del color:

Un error común es el de abusar de los colores. Esto provoca confusión en el operario

que debe adaptar su vista al continuo cambio.

A continuación se detallan recomendaciones para mejorar los criterios de selección de

color en una interfaz.

o Uso funcional del color:

Su principal utilidad es la de resaltar la información más importante, y así identificar

fácilmente los datos más relevantes. De esta manera se puede asociar elementos

aunque estén separados espacialmente. Y también, separar los que deben

diferenciarse.

Page 7: Guia para realizar una correcta interfaz gráfica de usuario

o Utilizar color de acuerdo a connotaciones culturales y estereotipos:

Evitar connotaciones culturales negativas, como así también considerar propiedades

psicológicas que actúan sobre el subconsciente. En el siguiente listado se ven algunos de los

significados asociados a colores:

o Su función se debe reforzar con otros elementos comunicativos, nunca solo.

Page 8: Guia para realizar una correcta interfaz gráfica de usuario

Texto en Interfaces Gráficas:

Existen diversos recursos para jerarquizar información escrita. Como formas exitosas

podemos mencionar: Uso de diferentes tamaños de letra y de colores.

En cambio si limitamos los cambios en las letras sólo a activar el formato de Negrita o

Cursiva los cambios no son buenos, sobre todo en letras chicas o textos largos.

Iconos en Interfaces Gráficas:

o Verificar la necesidad de un sistema de íconos:

Sólo es aconsejable utilizar iconos cuando la explicación con palabras es muy larga o no

pude entenderse con facilidad.

o Seleccionar una metáfora y representarla adecuadamente. (Se debe determinar

el uso de forma intuitiva).

Page 9: Guia para realizar una correcta interfaz gráfica de usuario

o Utilizar la redundancia verbal adecuadamente.

o Utilizar íconos ya difundidos anteriormente.

Principios Generales de la Usabilidad:

o El operador debe tener una sensación de control sobre la aplicación.

• Proporcionar acciones inmediatas, reversibles, y realimentación.

• Ser redundante

• Permitir al usuario personalizar la interfaz.

Page 10: Guia para realizar una correcta interfaz gráfica de usuario

o Se debe reducir la carga de memoria de los usuarios:

• Simplificar las tareas.

• Proporcionar opciones por defecto.

• Evitar que el desarrollo de la tarea dependa de la memoria del operador.

• Delegar la carga de trabajo.

• Proporcionar atajos.

• Soportar teclas de acceso.

Page 11: Guia para realizar una correcta interfaz gráfica de usuario

o La aplicación debe ser consistente:

A continuación se mencionan principios para lograrlo

• Preservar el texto de trabajo de los usuarios.

• Mantener la consistencia dentro de la aplicación y con el sistema operativo.

• Conservar los resultados para las mismas interacciones.

Page 12: Guia para realizar una correcta interfaz gráfica de usuario

o Ofrecer prevención de errores y una gestión de errores sencilla:

• Intentar prevenir los errores antes que ocurran.

• Utilizar redundancia de canales comunicativos.

o Facilitar el aprendizaje de la aplicación:

• Proporcionar al operador diferentes tipos de ayuda, automática o a petición del mismo.

o Método para verificar si la aplicación incorpora principios de accesibilidad en el diseño:

• Utilizar únicamente el teclado para manejar la interfaz.

• Comprobar el funcionamiento de las herramientas de ampliación

Page 13: Guia para realizar una correcta interfaz gráfica de usuario

BIBLIOGRAFÍA Y OTRAS FUENTES

Rodríguez Roberto (Página consultada 10/06/2016) “Interfaces gráficas de usuarios.

Estudio de una guía para su evaluación ergonómica.” [On-line]. Dirección URL:

http://bdigital.uncu.edu.ar/objetos_digitales/1505/rodriguezinterfaces.pdf

Parte II

Roe Benjamin (Página consultada 10/06/2016) “Diseño de Interfaces de Usuario Usables:

Una Guía Rápida para Desarrolladores de Software Libre y de Código Abierto”

[On-line]. Dirección URL: http://mundogeek.net/traducciones/interfaces-usuario-usables/gui.html