Diseño de Interfaz Gráfica Materia: Metodología de Sistemas I Aumnos: Perez Aller - Rimoli Fecha: 15/11/2014

1. Interfaces Gráficas
Alumnos:
Pérez Aller Julian
Rimoli Alejandro
Materia:
Metodología de Sistemas I
Curso:
4° “B”
Fecha : 18 de Noviembre de 2014

2. Introducción:
Recientemente, los ordenadores se han introducido en todos los
dominios de la vida cotidiana.Tradicionalmente se enfatizó la
tecnología en vez del usuario cuando se desarrolla una aplicación. Sin
embargo, el diseño de software ha evolucionado para asegurar que las
necesidades del usuario sean alcanzadas y que los sistemas sean más
intuitivos y amigables.
El problema radica en que en el desarrollo del producto todavía se
hace énfasis en la tecnología, en vez del usuario, la persona para la
cual esta hecho el dispositivo. Sin embargo, el enfoque del diseño de
software ha evolucionado para asegurar que las necesidades del
usuario sean alcanzadas y que los sistemas sean más intuitivos y
amigables. Los desarrolladores de software necesitan integrar a
especialistas en diseño y ergonomía, evolucionando hacia un enfoque
antropotécnico, hacia un diseño centrado en el usuario.

3. Diseño de Interfaces Gráficas:
Cuando los seres humanos y los ordenadores interactúan lo hacen
a través de un medio o interfaz, que es el punto en el que seres
humanos y ordenadores se ponen en contacto transmitiéndose
entre ambos componentes del sistema información: ordenes,
señales, y respuestas. Para que un sistema interactivo cumpla sus
objetivos su interfaz tiene que ser usable y, además, debido a la
generalización del uso de los ordenadores, accesible a la mayor
parte de la población humana.
El diseño iterativo de interfaces es un proceso independiente de la/s
técnica/s utilizada/s para llevarlo a cabo. Se puede concebir como
un ciclo de 3 etapas: Diseño,Prototipado, Evaluación.
El resultado (o output) de cada etapa es la alimentación (o input) de
la que sigue, incluso el de la última. Los resultados de la etapa de
evaluación se toman para re-diseñar la interfaz, implementarla
nuevamente, medir, y así sucesivamente.Nótese el permanente
protagonismo del usuario en este modelo de desarrollo.

4. Tips para el diseño de Interfaces
Gráficas:
➲ El usuario no esta utilizando tu aplicación
La cuestión más básica a considerar en el diseño de interfaces de
usuario es que el usuario no quiere utilizar tu aplicación. Quieren
hacer su trabajo de la forma más sencilla y rápida posible, y la
aplicación no es más que otra herramienta para ayudarles a
lograrlo. Cuanto menos estorbe tu aplicación al usuario, mejor. El
esfuerzo utilizado en usar tu aplicación es esfuerzo que no pueden
utilizar en la tarea que están intentando realizar.

5. ➲ La aplicación debe ser Consistente
Los principios que ayudan a lograr una interfaz consistente
son:
➲ Preservar el contexto de trabajo de los usuarios: Es
fundamental aprovechar los conocimientos previos de los
usuarios, lo que les permitirá transferir su conocimiento y
aprendizaje a un nuevo programa siempre que éste sea
consistente con otros programas que ya haya usado, y con su
propia experiencia en el mundo físico.
➲ Mantener la consistencia dentro de la aplicación y con el
Sistema Operativo: Es posible analizar la consistencia a
diferentes niveles: en una aplicación individual, en una familia
de productos, para todos los productos distribuidos por el
mismo comerciante, para todos los productos que trabajan en
un mismo sistema operativo.

6. ➲ Conservar los resultados para las mismas interacciones:
La dimensión más importante de la consistencia es la relación entre
lo que el usuario espera de la interfaz y lo que la interfaz finalmente
hace. Una vez que se define un comportamiento, este se debe
mantener en toda la interfaz. Esta posibilidad de predicción
disminuye el tiempo de formación y permite al usuario hacer
asociaciones logrando una autoaprendizaje. Esto significa que si un
elemento de la interfaz parece un botón debe comportarse como un
botón.
Inconsistencia:
Un ejemplo de inconsistencia es el botón / menú de inicio del Sistema
Operativo Windows. Parece un botón, está ubicado junto a otros
botones pero se comporta como un menú. Para empeorar las
cosas,la primer selección posible dentro de este menú es Apagar.
Apagar el
sistema no es lo primero que desea hacer un usuario al comenzar
una sesión de trabajo.Este ejemplo de inconsistencia en el Sistema
Operativo más difundido muestra lo complejo que puede ser tomar
decisiones de usabilidad ysatisfacer todas lasrecomendaciones de
diseño.

7. ➲ Ofrecer prevención de errores y una gestión de
errores sencilla
Para alcanzar este objetivo es recomendable:
➲ Prevenir los errores antes de que ocurran: Se recomienda que existan
mecanismos de validación de entradas, definiendo un rango
de posibles entradas para cada campo.
➲ Utilizar redundancia de canales comunicativos: Es aconsejable, frente
a una notificación de error, que se utilice tanto una señal sonora e
incorporar un parpadeo para llamar la atención del operario.
➲ Proporcionar al operador diferentes tipos de ayuda, automática o a
petición del mismo: Toda aplicación debe incorporar documentación
de ayuda, elaborada con la misma dedicación que el resto de la
interfaz. La misma debe invocarse según estándares (F1) y debe estar
disponible para el usuario en cualquier momento.

8. ➲ Accesibilidad
Procedimientos para verificar si la aplicación realizada incorpora
principios de accesibilidad en su diseño.
➲ Utilizar únicamente el teclado para manejar el interfaz: Comprobar que
esto es posible y que además las diferentes funciones de acceso están
bien documentadas e indicadas.También, hay que comprobar si
alguna de las operaciones resulta excesivamente complicada de
ejecutar con una sola mano o con un dedo.
➲ Comprobar el funcionamiento de las herramientas de ampliación:
Muchos sistemas operativos ofrecen herramientas básicas de
accesibilidad y que pueden de algunamanera compensar problemas
de agudeza visual. Comprobar si las herramientas básicas de
ampliación de la pantalla disponibles en Windows funcionan
correctamente con la aplicación.

9. ➲ La Ley de Fitt
Esta es la ley más básica y
más conocida de entre las
leyes del diseño de
interfaces de usuario. Esta
ley dice que cuanto más
grande y más cercano al
puntero del ratón es un
objeto, más sencillo es el
hacer click sobre él. Esto es
de sentido común, pero
muchas veces es ignorado
completamente en el diseño
de interfaces.
Para resumir este punto:
➲ Los controles más utilizados deben ser más grandes y ser
distinguibles fácilmente
➲ Utiliza los bordes y esquinas de la pantalla para hacer que tus
controles sean virtualmente infinitos
➲ Nunca, nunca coloques los controles a un pixel de distancia del
borde de la pantalla o de una esquina

10. ➲ Interfaces Innecesarias
Cuando un usuario está trabajando, su atención está centrada en
el trabajo que está realizando. Cada vez que tienen que
concentrarse en la aplicación, les lleva tiempo el volver a
centrarse en el trabajo. Por lo tanto, deberías minimizar la
cantidad de distracción y de interferencias por parte de tu
aplicación. Cada aplicación tiene un elemento clave en la que
centrarse — en un editor de texto, es el texto; en un navegador
web, es la página web — así que deberías hacer de este
elemento clave el centro de la interfaz.
Para resumir este punto:
➲ No coloques barreras en el camino del usuario
➲ Lanza una ventana de diálogo solo si esta contiene
información útil
➲ Si es posible, utiliza indicadores de estado no modales

11. ➲ Utiliza la potencia de la computadora
Los computadores actuales son bastante potentes, con billones de
ciclos de procesador por segundo y cientos de gigabytes de espacio
de almacenamiento disponible. Parece una buena idea, por lo tanto,
liberar de cuanto trabajo podamos a la persona y encargárselo a la
computadora.
Para resumir este punto:
➲ Las computadoras son muy potentes: utiliza su potencia para ayudar
al usuario
➲ Haz que se pueda distinguir fácilmente entre elementos similares
➲ Recuerda las opciones de la aplicación

12. ➲ Haz que sea fácil distinguir los elementos y
buscarlos
Este punto es bastante simple: los elementos de la pantalla que
hacen cosas distintas deberían ser fácilmente distinguibles unos de
otros.
➲ El elemento que se encuentra más a la izquierda es el que
posiblemente sea el comando menos utilizado en el navegador
web. Este elemento es el más sencillo de encontrar y de pulsar, asi
que la acción más utilizada debería ocupar esa posición.

13. ➲ Cuando el usuario selecciona un texto, su atención se centra en
el texto seleccionado. Podemos suponer que lo ha seleccionado
para poder hacer algo con él. Asi que, ¿por qué en este tema
se cambia el color de fondo de la selección a un color oscuro,
que hace que resulte más difícil de leer exactamente el texto en
el que el usuario está interesado? ¿No sería mejor hacer que
ese texto resalte del resto del texto haciéndolo sencillo de leer?
Para resumir este punto:
➲ Elementos que hacen cosas distintas deben ser fácilmente
distinguibles entre sí
➲ No abrumes a tu usuario con demasiadas opciones
➲ Haz que el elemento seleccionado sea sencillo de distinguir y
leer

14. Bibliografía:
➲ - Roe , Benjamin. (Página consultada el 15 de Noviembre de 2014).
“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:
www.mundogeek.net/traducciones/interfaces-usuario-usables/gui.htmlwww.mundogeek.net/traducciones/interfaces-usuario-usables/gui.html
➲ - Universidad Nacional de Cuyo,Facultad de Artes y Diseño
(Página consultada el 15 de Noviembre de 2014).
“INTERFACES GRÁFICAS DE USUARIOS” [On-Line] Dirección URL:
www.bdigital.uncu.edu.ar/objetos_digitales/1505/rodriguezinterfaces.pdfwww.bdigital.uncu.edu.ar/objetos_digitales/1505/rodriguezinterfaces.pdf