diseÑo de interfaz de usuario por: gloria cecilia ríos muñoz
TRANSCRIPT
![Page 1: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/1.jpg)
DISEÑO DE INTERFAZ DE
USUARIO
Por: Gloria Cecilia Ríos Muñoz
![Page 2: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/2.jpg)
Desde el punto de vista de la IS, la interfaz de usuario juega un papel extremo importante en el desarrollo y puesta en marcha de todo sistema.
Es la Carta de presentación del sistema y en ocasiones resulta determinante para la aceptación o rechazo de todo un proyecto.
![Page 3: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/3.jpg)
INTERFAZ DE USUARIO
En promedio, se estima que el 35% al 45% de los gastos son destinados a un proyecto
son direccionados al diseño e implementación de la interfaz
![Page 4: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/4.jpg)
![Page 5: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/5.jpg)
Interfaz de Usuario…
![Page 6: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/6.jpg)
Interfaz de Usuario…
En algunos casos, la interfaz de usuario puede ser un instrumento muy poderoso para ayudar en la captura y especificación de requerimientos.
Es muy sencillo diseñar algunas pantallas, enseñárselas al usuario para que las evalúe y de esta manera aclarar dudas o confusiones en los requerimientos.
Desde este punto de vista, es posible apoyarse en el desarrollo de «Prototipos» de IU para resolver problemas de requerimientos e inclusive especificar parte del sistema
![Page 7: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/7.jpg)
Interfaz de Usuario…
Interfaz Hombre – MáquinaLa interfaz es lo que «Media», lo que facilita la comunicación, la comunicación, la interacción entre dos sistemas de diferente naturaleza.
![Page 8: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/8.jpg)
A CONTINUACIÓN SE MUESTRAN ALGUNOS ERRORES COMUNES DE
INTERFAZ DE USUARIO
![Page 9: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/9.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
![Page 10: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/10.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
![Page 11: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/11.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
![Page 12: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/12.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
![Page 13: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/13.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
¿CÓMO DICE???
![Page 14: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/14.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
![Page 15: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/15.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
![Page 16: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/16.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
![Page 17: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/17.jpg)
PAUTAS DE DISEÑO IU (Color, Matiz, Contraste, Resplandor)
Lea todo el mensaje de error…
![Page 18: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/18.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
¿Dónde tengo que hacer click para descargar el archivo?
![Page 19: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/19.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
¿Dónde tengo que hacer click para descargar el archivo?
![Page 20: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/20.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
El programa no tiene la posibilidad de desactivarlos
El uso de iconos excesivos puede impactar considerablemente la legibilidad
![Page 21: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/21.jpg)
¡Use los colores adecuados, dependiendo del caso!Este ejemplo en particular no usa colores adecuados para la lectura
![Page 22: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/22.jpg)
![Page 23: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/23.jpg)
¿Son éstas diapositivas lo suficientemente
legibles?
¿Se puede leer el texto, se pueden ver las
imágenes?
![Page 24: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/24.jpg)
¿POR QUÉ ES NECESARIO HACER UNA BUENA IU?
Algunos afirman que el éxito comercial del iPod se hadebido en buena medida a un excelente diseño (yevolución) de su Interfaz de usuario...
![Page 25: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/25.jpg)
Memoria a corto plazo limitada: Las personasrecuerdan usualmente a corto plazo 7 elementos deinformación. Si es necesario que memoricen más,entonces se vuelven mas propensas a cometererrores
¿FACTORES HUMANOS
Las personas se equivocan: Esto es un hecho.Una respuesta adecuada (alarmas, confirmaciones,colores, etcétera) puede hacer la diferencia entre una buena o una mala interfaz de usuario
![Page 26: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/26.jpg)
¿FACTORES HUMANOS Recordar que un error mal manejado
puede llevar a otro error...
y este puede llevar a otro y a otro, y así hasta llegar a un error
catastrófico
![Page 27: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/27.jpg)
FACTORES HUMANOS
Las personas son diferentes: No todas las personas tienen las mismas capacidades o usaran el sistema de la misma forma (Recordar imagen anterior)
Las personas tienen preferencias diferentes:Algunas personas preferirán utilizar interfaces gráficas, otras usarán interfaces de línea de comandos, etcétera
![Page 28: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/28.jpg)
Familiaridad: La interfaz debe usar términos yconceptos familiares al usuario y al dominio de la aplicación
Uniformidad: La interfaz debe ser uniforme, operaciones comparables deben funcionar de la misma manera
Mínima Sorpresa: El comportamiento del sistema no debe provocar sorpresa al usuario. El sistema debería comportarse de la forma más predecible posible
PRINCIPIOS DE DISEÑO IU
![Page 29: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/29.jpg)
Recuperabilidad: La interfaz debe permitir alusuario recuperarse de errores, o al menos, ayudarle a evitarlos
PRINCIPIOS DE DISEÑO IU
Guía de Usuario: Retroalimentación significativa y coherente al ocurrir errores y características de ayuda sensibles al contextoDiversidad de Usuarios: La interfaz debe estarorientada a todos los tipos de usuarios del sistema (Novatos, expertos, daltónicos, discapacitados, etcétera)
![Page 30: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/30.jpg)
PASOS ELEMENTALES PARA DISEÑAR IU
Es posible diseñarinterfaz de usuariosimplementeusando lápiz ypapel y haciendoun bosquejo.
O se puedenutilizarherramientas massofisticadas:Editores de IU,HTML…
![Page 31: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/31.jpg)
Ejemplo…
Se puede usar una herramienta de dibujo para diseñar IU (Ej: sdraw de OpenOffice, MS Visio u otra similar)¿Qué errores puede usted encontrar en esta pantalla?
![Page 32: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/32.jpg)
Material de Apoyo
http://wiki.monagas.udo.edu.ve/index.php/UNIDAD_III:_INTERFAZ_DE_USUARIO
http://www.hipertexto.info/documentos/interfaz.htm
http://sig.utpl.edu.ec/sigutpl/biblioteca/manuales/MANUAL%20DEL%20USUARIO.pdf
http://sig.utpl.edu.ec/sigutpl/biblioteca/manuales/MANUAL%20DEL%20USUARIO.pdf
![Page 33: DISEÑO DE INTERFAZ DE USUARIO Por: Gloria Cecilia Ríos Muñoz](https://reader031.vdocuments.net/reader031/viewer/2022012321/55367dd7550346e3648b4813/html5/thumbnails/33.jpg)
Responder:• Qué es una interfaz gráfica de usuario?• Cuales son las características más
importantes de tiempo de respuesta de una interfaz gráfica de usuario?
• Que herramientas de ayuda podemos tener en cuenta para el diseño de una interfaz gráfica de usuario?
• Cuáles son los errores comunes que se pueden presentar en una interfaz gráfica de usuario?
• Cómo deben de ser las Leyendas del menú y de los comandos?
• Cómo debe ser la Accesibilidad de la aplicación?
• Qué significa Internacionalización en el diseño de interfaz gráfica?
Actividad