Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Interfaces Gráficas
Alumnos:
Pérez Aller Julian
Rimoli Alejandro
Materia:
Metodología de Sistemas I
Curso:
4° “B”
Fecha : ...
Introducción:
Recientemente, los ordenadores se han introducido en todos los
dominios de la vida cotidiana.Tradicionalment...
Diseño de Interfaces Gráficas:
Cuando los seres humanos y los ordenadores interactúan lo hacen
a través de un medio o inte...
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 conside...
➲ La aplicación debe ser Consistente
Los principios que ayudan a lograr una interfaz consistente
son:
➲ Preservar el conte...
➲ Conservar los resultados para las mismas interacciones:
La dimensión más importante de la consistencia es la relación en...
➲ Ofrecer prevención de errores y una gestión de
errores sencilla
Para alcanzar este objetivo es recomendable:
➲ Prevenir ...
➲ Accesibilidad
Procedimientos para verificar si la aplicación realizada incorpora
principios de accesibilidad en su diseñ...
➲ 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...
➲ Interfaces Innecesarias
Cuando un usuario está trabajando, su atención está centrada en
el trabajo que está realizando. ...
➲ Utiliza la potencia de la computadora
Los computadores actuales son bastante potentes, con billones de
ciclos de procesa...
➲ Haz que sea fácil distinguir los elementos y
buscarlos
Este punto es bastante simple: los elementos de la pantalla que
h...
➲ Cuando el usuario selecciona un texto, su atención se centra en
el texto seleccionado. Podemos suponer que lo ha selecci...
Bibliografía:
➲ - Roe , Benjamin. (Página consultada el 15 de Noviembre de 2014).
“Diseño de Interfaces de Usuario Usables...
Upcoming SlideShare
Loading in …5
×

Interfaz grafica

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

  • Login to see the comments

  • Be the first to like this

Interfaz grafica

  1. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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

×