SlideShare une entreprise Scribd logo
1  sur  14
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
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.
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.
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.
➲ 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.
➲ 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.
➲ 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.
➲ 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.
➲ 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
➲ 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
➲ 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
➲ 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.
➲ 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
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

Contenu connexe

Tendances

Trabajo de-prezi
Trabajo de-preziTrabajo de-prezi
Trabajo de-prezinancy2994
 
Interfaces en dispositivos móviles
Interfaces en dispositivos móvilesInterfaces en dispositivos móviles
Interfaces en dispositivos móvilesChayincitha MAciaz
 
Diseño de interfaces gráficas de usuario
Diseño de interfaces gráficas de usuarioDiseño de interfaces gráficas de usuario
Diseño de interfaces gráficas de usuariopelucaboy
 
Evaluación a interfaces - Test de usuarios,evaluación heurística y eye-tracking
Evaluación a interfaces - Test de usuarios,evaluación heurística y eye-trackingEvaluación a interfaces - Test de usuarios,evaluación heurística y eye-tracking
Evaluación a interfaces - Test de usuarios,evaluación heurística y eye-trackingPercy Negrete
 
5. Prototipado
5.  Prototipado5.  Prototipado
5. PrototipadoDCU_MPIUA
 
Diseño de experiencia de usuario
Diseño de experiencia de usuarioDiseño de experiencia de usuario
Diseño de experiencia de usuarioGabyAman
 
Interfaz De Usuario
Interfaz De UsuarioInterfaz De Usuario
Interfaz De Usuariodjyami
 
Recursos pilar
Recursos pilarRecursos pilar
Recursos pilarPilargg26
 
Unidad 01: Aplicaciones Web De Escritorio
Unidad 01: Aplicaciones Web De EscritorioUnidad 01: Aplicaciones Web De Escritorio
Unidad 01: Aplicaciones Web De EscritorioDarbyPC
 
No todo lo que ves es lo que es.
No todo lo que ves es lo que es.No todo lo que ves es lo que es.
No todo lo que ves es lo que es.Manusara
 
1. Fundamentos. Usabilidad, accessibilitat, UX
1.  Fundamentos. Usabilidad, accessibilitat, UX1.  Fundamentos. Usabilidad, accessibilitat, UX
1. Fundamentos. Usabilidad, accessibilitat, UXDCU_MPIUA
 
Usabilidad, ux … cómo lo medimos?
Usabilidad, ux … cómo lo medimos?Usabilidad, ux … cómo lo medimos?
Usabilidad, ux … cómo lo medimos?DCU_MPIUA
 

Tendances (19)

11.interfaz de usuario en java
11.interfaz de usuario en java11.interfaz de usuario en java
11.interfaz de usuario en java
 
Trabajo de-prezi
Trabajo de-preziTrabajo de-prezi
Trabajo de-prezi
 
Interfaces en dispositivos móviles
Interfaces en dispositivos móvilesInterfaces en dispositivos móviles
Interfaces en dispositivos móviles
 
Diseño de interfaces gráficas de usuario
Diseño de interfaces gráficas de usuarioDiseño de interfaces gráficas de usuario
Diseño de interfaces gráficas de usuario
 
Evaluación a interfaces - Test de usuarios,evaluación heurística y eye-tracking
Evaluación a interfaces - Test de usuarios,evaluación heurística y eye-trackingEvaluación a interfaces - Test de usuarios,evaluación heurística y eye-tracking
Evaluación a interfaces - Test de usuarios,evaluación heurística y eye-tracking
 
Interfaces de usuario
Interfaces de usuarioInterfaces de usuario
Interfaces de usuario
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 
Uxprototipo
UxprototipoUxprototipo
Uxprototipo
 
Taller usabilidad
Taller usabilidadTaller usabilidad
Taller usabilidad
 
Diarios de herramientas
Diarios de herramientasDiarios de herramientas
Diarios de herramientas
 
5. Prototipado
5.  Prototipado5.  Prototipado
5. Prototipado
 
Diseño de experiencia de usuario
Diseño de experiencia de usuarioDiseño de experiencia de usuario
Diseño de experiencia de usuario
 
Interfaz De Usuario
Interfaz De UsuarioInterfaz De Usuario
Interfaz De Usuario
 
Recursos pilar
Recursos pilarRecursos pilar
Recursos pilar
 
Unidad 01: Aplicaciones Web De Escritorio
Unidad 01: Aplicaciones Web De EscritorioUnidad 01: Aplicaciones Web De Escritorio
Unidad 01: Aplicaciones Web De Escritorio
 
No todo lo que ves es lo que es.
No todo lo que ves es lo que es.No todo lo que ves es lo que es.
No todo lo que ves es lo que es.
 
1. Fundamentos. Usabilidad, accessibilitat, UX
1.  Fundamentos. Usabilidad, accessibilitat, UX1.  Fundamentos. Usabilidad, accessibilitat, UX
1. Fundamentos. Usabilidad, accessibilitat, UX
 
Dog healt terminado
Dog healt terminadoDog healt terminado
Dog healt terminado
 
Usabilidad, ux … cómo lo medimos?
Usabilidad, ux … cómo lo medimos?Usabilidad, ux … cómo lo medimos?
Usabilidad, ux … cómo lo medimos?
 

En vedette

Présentation d'Actimath à l'infini 3
Présentation d'Actimath à l'infini 3Présentation d'Actimath à l'infini 3
Présentation d'Actimath à l'infini 3Editions VAN IN
 
Acquisition d'ouvrages de sciences humaines et sociales de langue française s...
Acquisition d'ouvrages de sciences humaines et sociales de langue française s...Acquisition d'ouvrages de sciences humaines et sociales de langue française s...
Acquisition d'ouvrages de sciences humaines et sociales de langue française s...Cairn.info
 
Synthese rapport thematique_politique_developpement_energies_renouvelables_2
Synthese rapport thematique_politique_developpement_energies_renouvelables_2Synthese rapport thematique_politique_developpement_energies_renouvelables_2
Synthese rapport thematique_politique_developpement_energies_renouvelables_2OPLPV
 
Un management durable dans le domaine hôtelier-groupe 79
Un management durable dans le domaine hôtelier-groupe 79Un management durable dans le domaine hôtelier-groupe 79
Un management durable dans le domaine hôtelier-groupe 79Anaelj
 
Petite magie à rehausser votre ligne de taille
Petite magie à rehausser votre ligne de taillePetite magie à rehausser votre ligne de taille
Petite magie à rehausser votre ligne de tailleavezvousunerobe
 
Chiffres clés de l'agriculture en Belgique - 2011
Chiffres clés de l'agriculture en Belgique - 2011Chiffres clés de l'agriculture en Belgique - 2011
Chiffres clés de l'agriculture en Belgique - 2011EnergiesB
 
09. cadeau des sens août 2011
09. cadeau des sens août 201109. cadeau des sens août 2011
09. cadeau des sens août 2011menbDME
 
Espace de coworking 3e lieu de vie
Espace de coworking 3e lieu de vieEspace de coworking 3e lieu de vie
Espace de coworking 3e lieu de vieSceaux smart
 
Glossaire cubik-partners
Glossaire cubik-partnersGlossaire cubik-partners
Glossaire cubik-partnersCoralie Voisin
 

En vedette (20)

Companies act notes
Companies act notesCompanies act notes
Companies act notes
 
Nevera Smeg FQ60BPE
Nevera Smeg FQ60BPE Nevera Smeg FQ60BPE
Nevera Smeg FQ60BPE
 
Présentation d'Actimath à l'infini 3
Présentation d'Actimath à l'infini 3Présentation d'Actimath à l'infini 3
Présentation d'Actimath à l'infini 3
 
Manual siemens campana lc91bd552
Manual siemens   campana lc91bd552Manual siemens   campana lc91bd552
Manual siemens campana lc91bd552
 
Acquisition d'ouvrages de sciences humaines et sociales de langue française s...
Acquisition d'ouvrages de sciences humaines et sociales de langue française s...Acquisition d'ouvrages de sciences humaines et sociales de langue française s...
Acquisition d'ouvrages de sciences humaines et sociales de langue française s...
 
Synthese rapport thematique_politique_developpement_energies_renouvelables_2
Synthese rapport thematique_politique_developpement_energies_renouvelables_2Synthese rapport thematique_politique_developpement_energies_renouvelables_2
Synthese rapport thematique_politique_developpement_energies_renouvelables_2
 
Extrait de portfolio
Extrait de portfolioExtrait de portfolio
Extrait de portfolio
 
pErio Resumen de enjuague
pErio Resumen de enjuaguepErio Resumen de enjuague
pErio Resumen de enjuague
 
Un management durable dans le domaine hôtelier-groupe 79
Un management durable dans le domaine hôtelier-groupe 79Un management durable dans le domaine hôtelier-groupe 79
Un management durable dans le domaine hôtelier-groupe 79
 
Manual siemens lavavajillas sn25m842eu
Manual siemens   lavavajillas sn25m842euManual siemens   lavavajillas sn25m842eu
Manual siemens lavavajillas sn25m842eu
 
Petite magie à rehausser votre ligne de taille
Petite magie à rehausser votre ligne de taillePetite magie à rehausser votre ligne de taille
Petite magie à rehausser votre ligne de taille
 
Bretagne un peu partout
Bretagne un peu partoutBretagne un peu partout
Bretagne un peu partout
 
Chiffres clés de l'agriculture en Belgique - 2011
Chiffres clés de l'agriculture en Belgique - 2011Chiffres clés de l'agriculture en Belgique - 2011
Chiffres clés de l'agriculture en Belgique - 2011
 
Manual balay microondas 3wm360bic
Manual balay   microondas 3wm360bicManual balay   microondas 3wm360bic
Manual balay microondas 3wm360bic
 
09. cadeau des sens août 2011
09. cadeau des sens août 201109. cadeau des sens août 2011
09. cadeau des sens août 2011
 
Espace de coworking 3e lieu de vie
Espace de coworking 3e lieu de vieEspace de coworking 3e lieu de vie
Espace de coworking 3e lieu de vie
 
Manual siemens campana lc67be532
Manual siemens   campana lc67be532Manual siemens   campana lc67be532
Manual siemens campana lc67be532
 
Glossaire cubik-partners
Glossaire cubik-partnersGlossaire cubik-partners
Glossaire cubik-partners
 
Manual siemens frigorífico ks36fpw30
Manual siemens   frigorífico ks36fpw30Manual siemens   frigorífico ks36fpw30
Manual siemens frigorífico ks36fpw30
 
Manual siemens combi kg39nai22
Manual siemens   combi kg39nai22Manual siemens   combi kg39nai22
Manual siemens combi kg39nai22
 

Similaire à Interfaz grafica

Similaire à Interfaz grafica (20)

11.interfaz de usuario
11.interfaz de usuario11.interfaz de usuario
11.interfaz de usuario
 
Interfaz de usuario
Interfaz de usuarioInterfaz de usuario
Interfaz de usuario
 
Gui
GuiGui
Gui
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 
Diseño de interfaces de usuario
Diseño de interfaces de usuarioDiseño de interfaces de usuario
Diseño de interfaces de usuario
 
Gui
GuiGui
Gui
 
Gui
GuiGui
Gui
 
Diseño de interfaz importancia y proceso
Diseño de interfaz importancia y procesoDiseño de interfaz importancia y proceso
Diseño de interfaz importancia y proceso
 
Trabajo Práctico - Metodología de Sistemas I - UTN
Trabajo Práctico - Metodología de Sistemas I - UTNTrabajo Práctico - Metodología de Sistemas I - UTN
Trabajo Práctico - Metodología de Sistemas I - UTN
 
17 evaluacion heuristica basica
17 evaluacion heuristica basica17 evaluacion heuristica basica
17 evaluacion heuristica basica
 
Técnica
Técnica Técnica
Técnica
 
Diseño de Interfaz
Diseño de InterfazDiseño de Interfaz
Diseño de Interfaz
 
Clase Diseño para la interacción
Clase Diseño para la interacciónClase Diseño para la interacción
Clase Diseño para la interacción
 
Interfaz Gráfica de Usuario
Interfaz Gráfica de UsuarioInterfaz Gráfica de Usuario
Interfaz Gráfica de Usuario
 
Usabilidad web
Usabilidad webUsabilidad web
Usabilidad web
 
Diseno de interfaces zyndi.pptx
Diseno de interfaces zyndi.pptxDiseno de interfaces zyndi.pptx
Diseno de interfaces zyndi.pptx
 
Herramientas tiflotecnicas
Herramientas tiflotecnicasHerramientas tiflotecnicas
Herramientas tiflotecnicas
 
Aplicación de escritorio
Aplicación de escritorioAplicación de escritorio
Aplicación de escritorio
 
Reglas de Oro
Reglas de OroReglas de Oro
Reglas de Oro
 
UX heuristics
UX heuristicsUX heuristics
UX heuristics
 

Dernier

Factores ecosistemas: interacciones, energia y dinamica
Factores ecosistemas: interacciones, energia y dinamicaFactores ecosistemas: interacciones, energia y dinamica
Factores ecosistemas: interacciones, energia y dinamicaFlor Idalia Espinoza Ortega
 
6° SEM30 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
6° SEM30 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx6° SEM30 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
6° SEM30 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docxCeciliaGuerreroGonza1
 
la unidad de s sesion edussssssssssssssscacio fisca
la unidad de s sesion edussssssssssssssscacio fiscala unidad de s sesion edussssssssssssssscacio fisca
la unidad de s sesion edussssssssssssssscacio fiscaeliseo91
 
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARONARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFAROJosé Luis Palma
 
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOSTEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOSjlorentemartos
 
2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdf2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdfBaker Publishing Company
 
La Función tecnológica del tutor.pptx
La  Función  tecnológica  del tutor.pptxLa  Función  tecnológica  del tutor.pptx
La Función tecnológica del tutor.pptxJunkotantik
 
DE LAS OLIMPIADAS GRIEGAS A LAS DEL MUNDO MODERNO.ppt
DE LAS OLIMPIADAS GRIEGAS A LAS DEL MUNDO MODERNO.pptDE LAS OLIMPIADAS GRIEGAS A LAS DEL MUNDO MODERNO.ppt
DE LAS OLIMPIADAS GRIEGAS A LAS DEL MUNDO MODERNO.pptELENA GALLARDO PAÚLS
 
programa dia de las madres 10 de mayo para evento
programa dia de las madres 10 de mayo  para eventoprograma dia de las madres 10 de mayo  para evento
programa dia de las madres 10 de mayo para eventoDiegoMtsS
 
EXPECTATIVAS vs PERSPECTIVA en la vida.
EXPECTATIVAS vs PERSPECTIVA  en la vida.EXPECTATIVAS vs PERSPECTIVA  en la vida.
EXPECTATIVAS vs PERSPECTIVA en la vida.DaluiMonasterio
 
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...JAVIER SOLIS NOYOLA
 
Movimientos Precursores de La Independencia en Venezuela
Movimientos Precursores de La Independencia en VenezuelaMovimientos Precursores de La Independencia en Venezuela
Movimientos Precursores de La Independencia en Venezuelacocuyelquemao
 
30-de-abril-plebiscito-1902_240420_104511.pdf
30-de-abril-plebiscito-1902_240420_104511.pdf30-de-abril-plebiscito-1902_240420_104511.pdf
30-de-abril-plebiscito-1902_240420_104511.pdfgimenanahuel
 
Heinsohn Privacidad y Ciberseguridad para el sector educativo
Heinsohn Privacidad y Ciberseguridad para el sector educativoHeinsohn Privacidad y Ciberseguridad para el sector educativo
Heinsohn Privacidad y Ciberseguridad para el sector educativoFundación YOD YOD
 
OLIMPIADA DEL CONOCIMIENTO INFANTIL 2024.pptx
OLIMPIADA DEL CONOCIMIENTO INFANTIL 2024.pptxOLIMPIADA DEL CONOCIMIENTO INFANTIL 2024.pptx
OLIMPIADA DEL CONOCIMIENTO INFANTIL 2024.pptxjosetrinidadchavez
 
Unidad II Doctrina de la Iglesia 1 parte
Unidad II Doctrina de la Iglesia 1 parteUnidad II Doctrina de la Iglesia 1 parte
Unidad II Doctrina de la Iglesia 1 parteJuan Hernandez
 
Lecciones 04 Esc. Sabática. Defendamos la verdad
Lecciones 04 Esc. Sabática. Defendamos la verdadLecciones 04 Esc. Sabática. Defendamos la verdad
Lecciones 04 Esc. Sabática. Defendamos la verdadAlejandrino Halire Ccahuana
 
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptxSINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptxlclcarmen
 

Dernier (20)

Factores ecosistemas: interacciones, energia y dinamica
Factores ecosistemas: interacciones, energia y dinamicaFactores ecosistemas: interacciones, energia y dinamica
Factores ecosistemas: interacciones, energia y dinamica
 
6° SEM30 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
6° SEM30 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx6° SEM30 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
6° SEM30 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
 
la unidad de s sesion edussssssssssssssscacio fisca
la unidad de s sesion edussssssssssssssscacio fiscala unidad de s sesion edussssssssssssssscacio fisca
la unidad de s sesion edussssssssssssssscacio fisca
 
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARONARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
 
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOSTEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
TEMA 13 ESPAÑA EN DEMOCRACIA:DISTINTOS GOBIERNOS
 
2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdf2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdf
 
La Trampa De La Felicidad. Russ-Harris.pdf
La Trampa De La Felicidad. Russ-Harris.pdfLa Trampa De La Felicidad. Russ-Harris.pdf
La Trampa De La Felicidad. Russ-Harris.pdf
 
La Función tecnológica del tutor.pptx
La  Función  tecnológica  del tutor.pptxLa  Función  tecnológica  del tutor.pptx
La Función tecnológica del tutor.pptx
 
DE LAS OLIMPIADAS GRIEGAS A LAS DEL MUNDO MODERNO.ppt
DE LAS OLIMPIADAS GRIEGAS A LAS DEL MUNDO MODERNO.pptDE LAS OLIMPIADAS GRIEGAS A LAS DEL MUNDO MODERNO.ppt
DE LAS OLIMPIADAS GRIEGAS A LAS DEL MUNDO MODERNO.ppt
 
programa dia de las madres 10 de mayo para evento
programa dia de las madres 10 de mayo  para eventoprograma dia de las madres 10 de mayo  para evento
programa dia de las madres 10 de mayo para evento
 
EXPECTATIVAS vs PERSPECTIVA en la vida.
EXPECTATIVAS vs PERSPECTIVA  en la vida.EXPECTATIVAS vs PERSPECTIVA  en la vida.
EXPECTATIVAS vs PERSPECTIVA en la vida.
 
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
LA ECUACIÓN DEL NÚMERO PI EN LOS JUEGOS OLÍMPICOS DE PARÍS. Por JAVIER SOLIS ...
 
Movimientos Precursores de La Independencia en Venezuela
Movimientos Precursores de La Independencia en VenezuelaMovimientos Precursores de La Independencia en Venezuela
Movimientos Precursores de La Independencia en Venezuela
 
30-de-abril-plebiscito-1902_240420_104511.pdf
30-de-abril-plebiscito-1902_240420_104511.pdf30-de-abril-plebiscito-1902_240420_104511.pdf
30-de-abril-plebiscito-1902_240420_104511.pdf
 
Heinsohn Privacidad y Ciberseguridad para el sector educativo
Heinsohn Privacidad y Ciberseguridad para el sector educativoHeinsohn Privacidad y Ciberseguridad para el sector educativo
Heinsohn Privacidad y Ciberseguridad para el sector educativo
 
OLIMPIADA DEL CONOCIMIENTO INFANTIL 2024.pptx
OLIMPIADA DEL CONOCIMIENTO INFANTIL 2024.pptxOLIMPIADA DEL CONOCIMIENTO INFANTIL 2024.pptx
OLIMPIADA DEL CONOCIMIENTO INFANTIL 2024.pptx
 
Unidad II Doctrina de la Iglesia 1 parte
Unidad II Doctrina de la Iglesia 1 parteUnidad II Doctrina de la Iglesia 1 parte
Unidad II Doctrina de la Iglesia 1 parte
 
Defendamos la verdad. La defensa es importante.
Defendamos la verdad. La defensa es importante.Defendamos la verdad. La defensa es importante.
Defendamos la verdad. La defensa es importante.
 
Lecciones 04 Esc. Sabática. Defendamos la verdad
Lecciones 04 Esc. Sabática. Defendamos la verdadLecciones 04 Esc. Sabática. Defendamos la verdad
Lecciones 04 Esc. Sabática. Defendamos la verdad
 
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptxSINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
 

Interfaz grafica

  • 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