SlideShare una empresa de Scribd logo
1 de 25
Descargar para leer sin conexión
11.Interfaz de Usuario
Ramiro Estigarribia Canese
Interacción y Usabilidad.
➔ Vivimos en un mundo de productos de alta
tecnología, y virtualmente todos ellos requieren
interacción humana.
➔ Si un producto ha de alcanzar el éxito, debe tener
buena usabilidad: medición cualitativa de la
facilidad y eficiencia con la que un humano emplea
las funciones y características que ofrece el
producto de alta tecnología.
➔ La usabilidad importa, ya sea en una interfaz para
un reproductor de MP3 o un sistema espacial.
¿Qué es el diseño de
interfaz de usuario?
➔ El diseño de la interfaz de usuario crea un medio
eficaz de comunicación entre los seres humanos y
la computadora.
➔ Siguiendo un conjunto de principios de diseño de la
interfaz, el diseño identifica los objetos y acciones
de ésta y luego crea una plantilla de pantalla que
constituye la base del prototipo de la interfaz de
usuario.
¿Por qué es importante la
Interfaz de Usuario?
➔ Porque si el software es difícil de usar, fuerza al
usuario a cometer errores, o si frustra sus
esfuerzos para alcanzar las metas, entonces no le
gustará, sin que importe el poder computacional
que tenga, el contenido que entregue o las
funciones que ofrezca.
➔ La interfaz tiene que estar bien hecha porque
moldea la percepción que el usuario tiene del
software.
Las Reglas del Diseño.
1. Dejar el control al usuario.
2. Reducir la carga de memoria del usuario.
3. Hacer que la interfaz sea consistente.
1.Dejar el control al usuario
“Es mejor diseñar la experiencia del usuario que
corregirla.”
Se preguntó a una usuaria, acerca de la interfaz gráfica:
“Lo que realmente me gustaría”, “es un sistema que lea
mi mente. Que sepa lo que quiero hacer antes de que
necesite hacerlo y que sea fácil.
No hay nada descabellado en la solicitud de la usuaria.
Un sistema que reacciona a sus necesidades y la ayuda
para que las cosas se hicieran.
2. Reducir la necesidad de
que el usuario memorice.
➔ Entre más cosas tenga que recordar el usuario,
más fácil será que cometa errores.
➔ Es por esto que una interfaz de usuario bien
diseñada no sobrecarga la memoria del usuario.
➔ Siempre que sea posible, el sistema debe
“recordar” la información pertinente y ayudar al
usuario con un escenario de interacción que lo
ayude a recordar.
3. Hacer consistente la
interfaz
➔ Toda la información debe organizarse de acuerdo
con reglas de diseño que se respeten en todas las
pantallas desplegadas.
➔ Los mecanismos de entrada se limitan a un
conjunto pequeño usado en forma consistente en
toda la aplicación.
➔ Los mecanismos para pasar de una tarea a otra se
definen e implementan de modo consistente.
¿Qué es la Usabilidad?
Es una medida de cuán bien un sistema:
➔ Facilita el aprendizaje.
➔ Ayuda a quienes lo emplean a recordar lo
aprendido.
➔ Reduce la probabilidad de cometer errores.
➔ Permite ser eficientes a los usuarios.
Usabilidad
Ventajas
1. Mayor competitividad.
2. Repercusión automática en los medios.
3. Recomendaciones de boca en boca.
4. Menores costos de apoyo.
5. Más productividad del usuario final.
6. Menos costos de capacitación y documentación.
7. Disminución de la probabilidad de litigios por parte
de clientes insatisfechos.
Análisis y Diseño de la
Interfaz de Usuario.
➔ Comienza con la creación de diferentes modelos
del funcionamiento del sistema (según se percibe
desde fuera).
➔ Se empieza delineando las tareas que se requieren
a fin de obtener el funcionamiento del sistema, para
luego considerar los aspectos que se aplican a
todos los diseños de interfaz.
➔ Se emplean herramientas para hacer prototipos e
implementar el modelo del diseño, y los usuarios
finales evalúan la calidad.
Entender a los Usuarios
➔ Todo diseño debe comenzar con la comprensión de
los usuarios que se busca, lo que incluye los
perfiles de edad, género, condiciones físicas,
educación, motivación, metas y personalidad”.
Además, los usuarios se clasifican como:
1. Principiantes: Poco conocimiento informático.
2. Intermedios: Conocimiento razonable.
3. Avanzados: Buscan atajos y modos abreviados.
Análisis del usuario
La imagen mental del usuario tal vez sea muy distinta de
la del modelo del diseño que hizo el ingeniero de
software.
Para ello, se utiliza información procedente de una
variedad amplia de fuentes:
1. Entrevistas. Éste es el enfoque más directo, los
miembros del equipo se reúnen con los usuarios.
2. Información de ventas. El personal de ventas habla
con los usuarios de manera regular.
3. Información de mercadotecnia. Análisis del mercado.
4. Información de apoyo. El equipo de apoyo habla a
diario con los usuarios.
Análisis y modelado de la
tarea.
La meta del análisis es responder las siguientes
preguntas:
1. ¿Qué trabajo realizará el usuario en circunstancias
específicas?
2. ¿Qué tareas y subtareas se efectuarán cuando el
usuario haga su trabajo?
3. ¿Qué dominio de problema específico manipulará
el usuario al realizar su labor?
4. ¿Cuál es la secuencia de las tareas (el flujo del
trabajo)?
5. ¿Cuál es la jerarquía de las tareas?
Patrones de diseño de la
interfaz de usuario
➔ Las interfaces de usuario gráficas se han vuelto tan
comunes que ha surgido una amplia variedad de
patrones de diseño de ellas.
➔ Como ejemplo, considere una situación en la que un
usuario debe introducir una o más fechas, a veces
varios meses antes.
➔ Hay muchas soluciones para este sencillo problema y
se han propuesto varios patrones distintos.
➔ Existe un patrón llamado CalendarStrip que produce un
calendario continuo, giratorio, en el que se resalta la
fecha actual y se eligen las futuras, tomándolas del
calendario.
Tiempo de respuesta.
➔ El tiempo de respuesta del sistema es la queja
principal en muchas aplicaciones interactivas.
➔ Se mide desde el momento en el que el usuario
ejecuta alguna acción, hasta que el software
responde con la acción deseada.
➔ El tiempo de respuesta tiene dos características
importantes: longitud y variabilidad.
➔ Si el tiempo de respuesta es demasiado largo, es
inevitable que el usuario sienta frustración y
tensión.
Tiempo de respuesta.
➔ Por ejemplo, un tiempo de respuesta de 1 segundo
para un comando resulta con frecuencia preferible
a una respuesta que varíe de 0.1 a 2.5 segundos.
➔ Cuando la variabilidad es significativa, el usuario
siempre se sale de balance, se pregunta si tras
bambalinas ha ocurrido algo “distinto”.
Manejo de errores.
Los mensajes de error son “malas noticias” que llegan
a los usuarios cuando algo sale mal.
En el peor de los casos, los mensajes de error dan
información inútil y sólo sirven para aumentar la
frustración del usuario.
“La aplicación XXX ha terminado porque encontró un
error del tipo 1023.”
Un mensaje de error presentado de esta manera, no
hace nada para ayudar a corregir el problema.
Manejo de errores.
En general, todo mensaje de error o advertencia
producida debería tener las siguientes características:
1. El mensaje debe describir el problema en un
lenguaje que entienda el usuario.
2. El mensaje debe dar consejos constructivos para
corregir el error.
3. El mensaje debe indicar las consecuencias
negativas del error (por ejemplo, archivos
corrompidos) para que el usuario pueda revisar.
4. El mensaje “no debe juzgar”. Es decir, sus palabras
nunca deben culpar al usuario.
Interfaz para WebApps
Toda interfaz de usuario debe tener las características
de usabilidad que se estudiaron en este capítulo.
Una interfaz de webapp debe responder tres
preguntas principales del usuario final:
1. ¿Dónde estoy? La interfaz debe dar una indicación
de la webapp a la que se ha accedido.
2. ¿Qué puedo hacer ahora? La interfaz siempre debe
ayudar al usuario a entender sus opciones.
3. ¿Dónde he estado, hacia dónde voy? La interfaz
debe facilitar la navegación.
WebApps - Principios
➔ La interfaz de usuario de una webapp es la
“primera impresión” que se recibe.
➔ Sin importar el valor de su contenido, ni el beneficio
general de la webapp en sí, una interfaz mal
diseñada decepcionará al usuario potencial y en
realidad hará que éste vaya a cualquier otro sitio.
➔ Debido al enorme volumen de webapps
competidoras en virtualmente toda área temática, la
interfaz debe “atrapar” de inmediato al usuario
potencial.
Flujo de trabajos de una
WebApp - Ejemplo.
Evaluación del Diseño.
➔ Una vez que se crea un prototipo operativo de la
interfaz de usuario, debe evaluarse con objeto de
determinar si satisfacen las necesidades de éste.
➔ La evaluación abarca un espectro de formalidad
que va desde una “prueba de manejo” informal, en
la que el usuario da retroalimentación instantánea a
un estudio diseñado formalmente que utilice
métodos estadísticos para evaluar cuestionarios
que respondería una población de usuarios finales.
Resumen y Conclusiones.
➔ La interfaz de usuario es presumiblemente el
elemento más importante de los sistemas
informáticos.
➔ Si la interfaz estuviera mal diseñada, afectaría
mucho la capacidad del usuario de aprovechar el
poder computacional y el contenido de información
de una aplicación.
➔ En realidad, una interfaz defectuosa haría que
fallara incluso una aplicación bien diseñada y con
buena implementación.

Más contenido relacionado

La actualidad más candente

Arquitecturas de Bases de Datos Distribuidas
Arquitecturas de Bases de Datos DistribuidasArquitecturas de Bases de Datos Distribuidas
Arquitecturas de Bases de Datos DistribuidasAntonio Soria
 
Requerimientos Funcionales y No Funcionales
Requerimientos Funcionales y No FuncionalesRequerimientos Funcionales y No Funcionales
Requerimientos Funcionales y No FuncionalesCarlos Macallums
 
MODELO DE PROCESOS DEL SOFTWARE
MODELO DE PROCESOS DEL SOFTWAREMODELO DE PROCESOS DEL SOFTWARE
MODELO DE PROCESOS DEL SOFTWAREMicky Jerzy
 
Analizar mediante-ejemplos-de-la-vida-real-el-concepto-de-procesos
Analizar mediante-ejemplos-de-la-vida-real-el-concepto-de-procesosAnalizar mediante-ejemplos-de-la-vida-real-el-concepto-de-procesos
Analizar mediante-ejemplos-de-la-vida-real-el-concepto-de-procesosJose Armando Velazquez Mijangos
 
Portafolio unidad 2 [Lenguajes y autómatas]- Expresiones y lenguajes regulares
Portafolio unidad 2 [Lenguajes y autómatas]- Expresiones y lenguajes regularesPortafolio unidad 2 [Lenguajes y autómatas]- Expresiones y lenguajes regulares
Portafolio unidad 2 [Lenguajes y autómatas]- Expresiones y lenguajes regularesHumano Terricola
 
Pruebas De Software
Pruebas De SoftwarePruebas De Software
Pruebas De Softwarearacelij
 
Plan de pruebas de software
Plan de pruebas de softwarePlan de pruebas de software
Plan de pruebas de softwareEdgardo Rojas
 
Interfaz con usuario
Interfaz con usuarioInterfaz con usuario
Interfaz con usuarioNorerod
 
Modelos de arquitecturas de computadoras
Modelos de arquitecturas de computadorasModelos de arquitecturas de computadoras
Modelos de arquitecturas de computadorasYESENIA CETINA
 
IEEE 730 1989: Plan de aseguramiento de la calidad del software
IEEE 730 1989: Plan de aseguramiento de la calidad del softwareIEEE 730 1989: Plan de aseguramiento de la calidad del software
IEEE 730 1989: Plan de aseguramiento de la calidad del softwareJesús Navarro
 
Introducción a Xamarin Forms con XAML
Introducción a Xamarin Forms con XAMLIntroducción a Xamarin Forms con XAML
Introducción a Xamarin Forms con XAMLSorey García
 

La actualidad más candente (20)

Instalacion de java y NetBeans
Instalacion de java y NetBeansInstalacion de java y NetBeans
Instalacion de java y NetBeans
 
Arquitecturas de Bases de Datos Distribuidas
Arquitecturas de Bases de Datos DistribuidasArquitecturas de Bases de Datos Distribuidas
Arquitecturas de Bases de Datos Distribuidas
 
Estimación Software por Puntos de Función
Estimación Software por Puntos de FunciónEstimación Software por Puntos de Función
Estimación Software por Puntos de Función
 
Posix
PosixPosix
Posix
 
Diseño de interfaz de usuario
Diseño de interfaz de usuarioDiseño de interfaz de usuario
Diseño de interfaz de usuario
 
PROYECTO FINAL ANÀLISIS Y DISEÑO ll
PROYECTO FINAL ANÀLISIS Y DISEÑO llPROYECTO FINAL ANÀLISIS Y DISEÑO ll
PROYECTO FINAL ANÀLISIS Y DISEÑO ll
 
Requerimientos Funcionales y No Funcionales
Requerimientos Funcionales y No FuncionalesRequerimientos Funcionales y No Funcionales
Requerimientos Funcionales y No Funcionales
 
MODELO DE PROCESOS DEL SOFTWARE
MODELO DE PROCESOS DEL SOFTWAREMODELO DE PROCESOS DEL SOFTWARE
MODELO DE PROCESOS DEL SOFTWARE
 
Analizar mediante-ejemplos-de-la-vida-real-el-concepto-de-procesos
Analizar mediante-ejemplos-de-la-vida-real-el-concepto-de-procesosAnalizar mediante-ejemplos-de-la-vida-real-el-concepto-de-procesos
Analizar mediante-ejemplos-de-la-vida-real-el-concepto-de-procesos
 
Portafolio unidad 2 [Lenguajes y autómatas]- Expresiones y lenguajes regulares
Portafolio unidad 2 [Lenguajes y autómatas]- Expresiones y lenguajes regularesPortafolio unidad 2 [Lenguajes y autómatas]- Expresiones y lenguajes regulares
Portafolio unidad 2 [Lenguajes y autómatas]- Expresiones y lenguajes regulares
 
Introducción a PHP
Introducción a PHPIntroducción a PHP
Introducción a PHP
 
Ingeniería Web
Ingeniería WebIngeniería Web
Ingeniería Web
 
Pruebas De Software
Pruebas De SoftwarePruebas De Software
Pruebas De Software
 
Control de-flujo
Control de-flujoControl de-flujo
Control de-flujo
 
Plan de pruebas de software
Plan de pruebas de softwarePlan de pruebas de software
Plan de pruebas de software
 
Interfaz con usuario
Interfaz con usuarioInterfaz con usuario
Interfaz con usuario
 
Modelos de arquitecturas de computadoras
Modelos de arquitecturas de computadorasModelos de arquitecturas de computadoras
Modelos de arquitecturas de computadoras
 
Lectores y escritores
Lectores y escritoresLectores y escritores
Lectores y escritores
 
IEEE 730 1989: Plan de aseguramiento de la calidad del software
IEEE 730 1989: Plan de aseguramiento de la calidad del softwareIEEE 730 1989: Plan de aseguramiento de la calidad del software
IEEE 730 1989: Plan de aseguramiento de la calidad del software
 
Introducción a Xamarin Forms con XAML
Introducción a Xamarin Forms con XAMLIntroducción a Xamarin Forms con XAML
Introducción a Xamarin Forms con XAML
 

Similar a 11.interfaz de usuario (20)

Interfaz de usuario
Interfaz de usuarioInterfaz de usuario
Interfaz de usuario
 
11.interfaz de usuario en java
11.interfaz de usuario en java11.interfaz de usuario en java
11.interfaz de usuario en java
 
Interfaces de usuario
Interfaces de usuarioInterfaces de usuario
Interfaces de usuario
 
Interfaz grafica
Interfaz graficaInterfaz grafica
Interfaz grafica
 
Interfaz grafica
Interfaz graficaInterfaz grafica
Interfaz grafica
 
Hci
HciHci
Hci
 
9.interfaz de usuario en c++
9.interfaz de usuario en c++9.interfaz de usuario en c++
9.interfaz de usuario en c++
 
Usabilidad1
Usabilidad1Usabilidad1
Usabilidad1
 
Usabilidad1
Usabilidad1Usabilidad1
Usabilidad1
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 
Diseño de interfaces
Diseño de interfacesDiseño de interfaces
Diseño de interfaces
 
Diseno de interfaces zyndi.pptx
Diseno de interfaces zyndi.pptxDiseno de interfaces zyndi.pptx
Diseno de interfaces zyndi.pptx
 
DISEÑO DE INTERFAZ DE USUARIO.ppt.pptx
DISEÑO DE INTERFAZ DE USUARIO.ppt.pptxDISEÑO DE INTERFAZ DE USUARIO.ppt.pptx
DISEÑO DE INTERFAZ DE USUARIO.ppt.pptx
 
Diseño de interfaces de usuario
Diseño de interfaces de usuarioDiseño de interfaces de usuario
Diseño de interfaces de usuario
 
Clase 1 Introducción a la Usabilidad
Clase 1 Introducción a la UsabilidadClase 1 Introducción a la Usabilidad
Clase 1 Introducción a la Usabilidad
 
Usabilidad y el desarrollo de software
Usabilidad y el desarrollo de software Usabilidad y el desarrollo de software
Usabilidad y el desarrollo de software
 
Usabilidad web
Usabilidad webUsabilidad web
Usabilidad web
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 
El Proceso de Diseño de interfaces de usuario. Roger Pressman
El Proceso de Diseño de interfaces de usuario. Roger PressmanEl Proceso de Diseño de interfaces de usuario. Roger Pressman
El Proceso de Diseño de interfaces de usuario. Roger Pressman
 
Ingeniería de usabilidad
Ingeniería de usabilidadIngeniería de usabilidad
Ingeniería de usabilidad
 

Más de Ramiro Estigarribia Canese

8.Flujo, Comportamiento, Patrones y WebApps.pdf
8.Flujo, Comportamiento, Patrones y WebApps.pdf8.Flujo, Comportamiento, Patrones y WebApps.pdf
8.Flujo, Comportamiento, Patrones y WebApps.pdfRamiro Estigarribia Canese
 

Más de Ramiro Estigarribia Canese (20)

8.Flujo, Comportamiento, Patrones y WebApps.pdf
8.Flujo, Comportamiento, Patrones y WebApps.pdf8.Flujo, Comportamiento, Patrones y WebApps.pdf
8.Flujo, Comportamiento, Patrones y WebApps.pdf
 
Principios que Guían la Práctica
Principios que Guían la PrácticaPrincipios que Guían la Práctica
Principios que Guían la Práctica
 
CSS - Hojas de Estilo en Cascada.pdf
CSS -  Hojas de Estilo en Cascada.pdfCSS -  Hojas de Estilo en Cascada.pdf
CSS - Hojas de Estilo en Cascada.pdf
 
Python conceptos básicos
Python   conceptos básicosPython   conceptos básicos
Python conceptos básicos
 
Diseño de WebApps
Diseño de WebAppsDiseño de WebApps
Diseño de WebApps
 
Diseño basado en patrones
Diseño basado en patronesDiseño basado en patrones
Diseño basado en patrones
 
Servicios web
Servicios webServicios web
Servicios web
 
Especificaciones de los procesadores
Especificaciones de los procesadoresEspecificaciones de los procesadores
Especificaciones de los procesadores
 
Lenguaje de programación awk
Lenguaje de programación awkLenguaje de programación awk
Lenguaje de programación awk
 
Bases de datos con PHP y PDO
Bases de datos con PHP y PDOBases de datos con PHP y PDO
Bases de datos con PHP y PDO
 
Bases de datos con PHP y Mysqli
Bases de datos con PHP y MysqliBases de datos con PHP y Mysqli
Bases de datos con PHP y Mysqli
 
Variables del sistema en php
Variables del sistema en phpVariables del sistema en php
Variables del sistema en php
 
Funciones en php
Funciones en phpFunciones en php
Funciones en php
 
Bootstrap menues, contenedores y formularios
Bootstrap   menues, contenedores y formulariosBootstrap   menues, contenedores y formularios
Bootstrap menues, contenedores y formularios
 
Estructuras de control en bash
Estructuras de control en bashEstructuras de control en bash
Estructuras de control en bash
 
Visual studio code
Visual studio codeVisual studio code
Visual studio code
 
Diseño de software
Diseño de softwareDiseño de software
Diseño de software
 
Herramienta cacti
Herramienta cactiHerramienta cacti
Herramienta cacti
 
Monitoreo de datacenter
Monitoreo de datacenterMonitoreo de datacenter
Monitoreo de datacenter
 
Comprensión de los requerimientos
Comprensión de los requerimientosComprensión de los requerimientos
Comprensión de los requerimientos
 

Último

Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptxMedidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptxaylincamaho
 
dokumen.tips_36274588-sistema-heui-eui.ppt
dokumen.tips_36274588-sistema-heui-eui.pptdokumen.tips_36274588-sistema-heui-eui.ppt
dokumen.tips_36274588-sistema-heui-eui.pptMiguelAtencio10
 
Hernandez_Hernandez_Practica web de la sesion 11.pptx
Hernandez_Hernandez_Practica web de la sesion 11.pptxHernandez_Hernandez_Practica web de la sesion 11.pptx
Hernandez_Hernandez_Practica web de la sesion 11.pptxJOSEMANUELHERNANDEZH11
 
Plan Sarmiento - Netbook del GCBA 2019..
Plan Sarmiento - Netbook del GCBA 2019..Plan Sarmiento - Netbook del GCBA 2019..
Plan Sarmiento - Netbook del GCBA 2019..RobertoGumucio2
 
Presentación inteligencia artificial en la actualidad
Presentación inteligencia artificial en la actualidadPresentación inteligencia artificial en la actualidad
Presentación inteligencia artificial en la actualidadMiguelAngelVillanuev48
 
El uso de las TIC's en la vida cotidiana.
El uso de las TIC's en la vida cotidiana.El uso de las TIC's en la vida cotidiana.
El uso de las TIC's en la vida cotidiana.241514949
 
Mapa-conceptual-del-Origen-del-Universo-3.pptx
Mapa-conceptual-del-Origen-del-Universo-3.pptxMapa-conceptual-del-Origen-del-Universo-3.pptx
Mapa-conceptual-del-Origen-del-Universo-3.pptxMidwarHenryLOZAFLORE
 
TEMA 2 PROTOCOLO DE EXTRACCION VEHICULAR.ppt
TEMA 2 PROTOCOLO DE EXTRACCION VEHICULAR.pptTEMA 2 PROTOCOLO DE EXTRACCION VEHICULAR.ppt
TEMA 2 PROTOCOLO DE EXTRACCION VEHICULAR.pptJavierHerrera662252
 
Arenas Camacho-Practica tarea Sesión 12.pptx
Arenas Camacho-Practica tarea Sesión 12.pptxArenas Camacho-Practica tarea Sesión 12.pptx
Arenas Camacho-Practica tarea Sesión 12.pptxJOSEFERNANDOARENASCA
 
definicion segun autores de matemáticas educativa
definicion segun autores de matemáticas  educativadefinicion segun autores de matemáticas  educativa
definicion segun autores de matemáticas educativaAdrianaMartnez618894
 
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptxLAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptxAlexander López
 
tics en la vida cotidiana prepa en linea modulo 1.pptx
tics en la vida cotidiana prepa en linea modulo 1.pptxtics en la vida cotidiana prepa en linea modulo 1.pptx
tics en la vida cotidiana prepa en linea modulo 1.pptxazmysanros90
 
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptxCrear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptxNombre Apellidos
 
El uso de las tic en la vida ,lo importante que son
El uso de las tic en la vida ,lo importante  que sonEl uso de las tic en la vida ,lo importante  que son
El uso de las tic en la vida ,lo importante que son241514984
 
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdfPARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdfSergioMendoza354770
 
FloresMorales_Montserrath_M1S3AI6 (1).pptx
FloresMorales_Montserrath_M1S3AI6 (1).pptxFloresMorales_Montserrath_M1S3AI6 (1).pptx
FloresMorales_Montserrath_M1S3AI6 (1).pptx241522327
 
La era de la educación digital y sus desafios
La era de la educación digital y sus desafiosLa era de la educación digital y sus desafios
La era de la educación digital y sus desafiosFundación YOD YOD
 
Actividad integradora 6 CREAR UN RECURSO MULTIMEDIA
Actividad integradora 6    CREAR UN RECURSO MULTIMEDIAActividad integradora 6    CREAR UN RECURSO MULTIMEDIA
Actividad integradora 6 CREAR UN RECURSO MULTIMEDIA241531640
 
R1600G CAT Variables de cargadores en mina
R1600G CAT Variables de cargadores en minaR1600G CAT Variables de cargadores en mina
R1600G CAT Variables de cargadores en minaarkananubis
 
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptxGoogle-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptxAlexander López
 

Último (20)

Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptxMedidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
 
dokumen.tips_36274588-sistema-heui-eui.ppt
dokumen.tips_36274588-sistema-heui-eui.pptdokumen.tips_36274588-sistema-heui-eui.ppt
dokumen.tips_36274588-sistema-heui-eui.ppt
 
Hernandez_Hernandez_Practica web de la sesion 11.pptx
Hernandez_Hernandez_Practica web de la sesion 11.pptxHernandez_Hernandez_Practica web de la sesion 11.pptx
Hernandez_Hernandez_Practica web de la sesion 11.pptx
 
Plan Sarmiento - Netbook del GCBA 2019..
Plan Sarmiento - Netbook del GCBA 2019..Plan Sarmiento - Netbook del GCBA 2019..
Plan Sarmiento - Netbook del GCBA 2019..
 
Presentación inteligencia artificial en la actualidad
Presentación inteligencia artificial en la actualidadPresentación inteligencia artificial en la actualidad
Presentación inteligencia artificial en la actualidad
 
El uso de las TIC's en la vida cotidiana.
El uso de las TIC's en la vida cotidiana.El uso de las TIC's en la vida cotidiana.
El uso de las TIC's en la vida cotidiana.
 
Mapa-conceptual-del-Origen-del-Universo-3.pptx
Mapa-conceptual-del-Origen-del-Universo-3.pptxMapa-conceptual-del-Origen-del-Universo-3.pptx
Mapa-conceptual-del-Origen-del-Universo-3.pptx
 
TEMA 2 PROTOCOLO DE EXTRACCION VEHICULAR.ppt
TEMA 2 PROTOCOLO DE EXTRACCION VEHICULAR.pptTEMA 2 PROTOCOLO DE EXTRACCION VEHICULAR.ppt
TEMA 2 PROTOCOLO DE EXTRACCION VEHICULAR.ppt
 
Arenas Camacho-Practica tarea Sesión 12.pptx
Arenas Camacho-Practica tarea Sesión 12.pptxArenas Camacho-Practica tarea Sesión 12.pptx
Arenas Camacho-Practica tarea Sesión 12.pptx
 
definicion segun autores de matemáticas educativa
definicion segun autores de matemáticas  educativadefinicion segun autores de matemáticas  educativa
definicion segun autores de matemáticas educativa
 
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptxLAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
 
tics en la vida cotidiana prepa en linea modulo 1.pptx
tics en la vida cotidiana prepa en linea modulo 1.pptxtics en la vida cotidiana prepa en linea modulo 1.pptx
tics en la vida cotidiana prepa en linea modulo 1.pptx
 
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptxCrear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
 
El uso de las tic en la vida ,lo importante que son
El uso de las tic en la vida ,lo importante  que sonEl uso de las tic en la vida ,lo importante  que son
El uso de las tic en la vida ,lo importante que son
 
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdfPARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
 
FloresMorales_Montserrath_M1S3AI6 (1).pptx
FloresMorales_Montserrath_M1S3AI6 (1).pptxFloresMorales_Montserrath_M1S3AI6 (1).pptx
FloresMorales_Montserrath_M1S3AI6 (1).pptx
 
La era de la educación digital y sus desafios
La era de la educación digital y sus desafiosLa era de la educación digital y sus desafios
La era de la educación digital y sus desafios
 
Actividad integradora 6 CREAR UN RECURSO MULTIMEDIA
Actividad integradora 6    CREAR UN RECURSO MULTIMEDIAActividad integradora 6    CREAR UN RECURSO MULTIMEDIA
Actividad integradora 6 CREAR UN RECURSO MULTIMEDIA
 
R1600G CAT Variables de cargadores en mina
R1600G CAT Variables de cargadores en minaR1600G CAT Variables de cargadores en mina
R1600G CAT Variables de cargadores en mina
 
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptxGoogle-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
 

11.interfaz de usuario

  • 1. 11.Interfaz de Usuario Ramiro Estigarribia Canese
  • 2. Interacción y Usabilidad. ➔ Vivimos en un mundo de productos de alta tecnología, y virtualmente todos ellos requieren interacción humana. ➔ Si un producto ha de alcanzar el éxito, debe tener buena usabilidad: medición cualitativa de la facilidad y eficiencia con la que un humano emplea las funciones y características que ofrece el producto de alta tecnología. ➔ La usabilidad importa, ya sea en una interfaz para un reproductor de MP3 o un sistema espacial.
  • 3. ¿Qué es el diseño de interfaz de usuario? ➔ El diseño de la interfaz de usuario crea un medio eficaz de comunicación entre los seres humanos y la computadora. ➔ Siguiendo un conjunto de principios de diseño de la interfaz, el diseño identifica los objetos y acciones de ésta y luego crea una plantilla de pantalla que constituye la base del prototipo de la interfaz de usuario.
  • 4. ¿Por qué es importante la Interfaz de Usuario? ➔ Porque si el software es difícil de usar, fuerza al usuario a cometer errores, o si frustra sus esfuerzos para alcanzar las metas, entonces no le gustará, sin que importe el poder computacional que tenga, el contenido que entregue o las funciones que ofrezca. ➔ La interfaz tiene que estar bien hecha porque moldea la percepción que el usuario tiene del software.
  • 5. Las Reglas del Diseño. 1. Dejar el control al usuario. 2. Reducir la carga de memoria del usuario. 3. Hacer que la interfaz sea consistente.
  • 6. 1.Dejar el control al usuario “Es mejor diseñar la experiencia del usuario que corregirla.” Se preguntó a una usuaria, acerca de la interfaz gráfica: “Lo que realmente me gustaría”, “es un sistema que lea mi mente. Que sepa lo que quiero hacer antes de que necesite hacerlo y que sea fácil. No hay nada descabellado en la solicitud de la usuaria. Un sistema que reacciona a sus necesidades y la ayuda para que las cosas se hicieran.
  • 7. 2. Reducir la necesidad de que el usuario memorice. ➔ Entre más cosas tenga que recordar el usuario, más fácil será que cometa errores. ➔ Es por esto que una interfaz de usuario bien diseñada no sobrecarga la memoria del usuario. ➔ Siempre que sea posible, el sistema debe “recordar” la información pertinente y ayudar al usuario con un escenario de interacción que lo ayude a recordar.
  • 8. 3. Hacer consistente la interfaz ➔ Toda la información debe organizarse de acuerdo con reglas de diseño que se respeten en todas las pantallas desplegadas. ➔ Los mecanismos de entrada se limitan a un conjunto pequeño usado en forma consistente en toda la aplicación. ➔ Los mecanismos para pasar de una tarea a otra se definen e implementan de modo consistente.
  • 9. ¿Qué es la Usabilidad? Es una medida de cuán bien un sistema: ➔ Facilita el aprendizaje. ➔ Ayuda a quienes lo emplean a recordar lo aprendido. ➔ Reduce la probabilidad de cometer errores. ➔ Permite ser eficientes a los usuarios.
  • 10. Usabilidad Ventajas 1. Mayor competitividad. 2. Repercusión automática en los medios. 3. Recomendaciones de boca en boca. 4. Menores costos de apoyo. 5. Más productividad del usuario final. 6. Menos costos de capacitación y documentación. 7. Disminución de la probabilidad de litigios por parte de clientes insatisfechos.
  • 11. Análisis y Diseño de la Interfaz de Usuario. ➔ Comienza con la creación de diferentes modelos del funcionamiento del sistema (según se percibe desde fuera). ➔ Se empieza delineando las tareas que se requieren a fin de obtener el funcionamiento del sistema, para luego considerar los aspectos que se aplican a todos los diseños de interfaz. ➔ Se emplean herramientas para hacer prototipos e implementar el modelo del diseño, y los usuarios finales evalúan la calidad.
  • 12. Entender a los Usuarios ➔ Todo diseño debe comenzar con la comprensión de los usuarios que se busca, lo que incluye los perfiles de edad, género, condiciones físicas, educación, motivación, metas y personalidad”. Además, los usuarios se clasifican como: 1. Principiantes: Poco conocimiento informático. 2. Intermedios: Conocimiento razonable. 3. Avanzados: Buscan atajos y modos abreviados.
  • 13. Análisis del usuario La imagen mental del usuario tal vez sea muy distinta de la del modelo del diseño que hizo el ingeniero de software. Para ello, se utiliza información procedente de una variedad amplia de fuentes: 1. Entrevistas. Éste es el enfoque más directo, los miembros del equipo se reúnen con los usuarios. 2. Información de ventas. El personal de ventas habla con los usuarios de manera regular. 3. Información de mercadotecnia. Análisis del mercado. 4. Información de apoyo. El equipo de apoyo habla a diario con los usuarios.
  • 14. Análisis y modelado de la tarea. La meta del análisis es responder las siguientes preguntas: 1. ¿Qué trabajo realizará el usuario en circunstancias específicas? 2. ¿Qué tareas y subtareas se efectuarán cuando el usuario haga su trabajo? 3. ¿Qué dominio de problema específico manipulará el usuario al realizar su labor? 4. ¿Cuál es la secuencia de las tareas (el flujo del trabajo)? 5. ¿Cuál es la jerarquía de las tareas?
  • 15. Patrones de diseño de la interfaz de usuario ➔ Las interfaces de usuario gráficas se han vuelto tan comunes que ha surgido una amplia variedad de patrones de diseño de ellas. ➔ Como ejemplo, considere una situación en la que un usuario debe introducir una o más fechas, a veces varios meses antes. ➔ Hay muchas soluciones para este sencillo problema y se han propuesto varios patrones distintos. ➔ Existe un patrón llamado CalendarStrip que produce un calendario continuo, giratorio, en el que se resalta la fecha actual y se eligen las futuras, tomándolas del calendario.
  • 16. Tiempo de respuesta. ➔ El tiempo de respuesta del sistema es la queja principal en muchas aplicaciones interactivas. ➔ Se mide desde el momento en el que el usuario ejecuta alguna acción, hasta que el software responde con la acción deseada. ➔ El tiempo de respuesta tiene dos características importantes: longitud y variabilidad. ➔ Si el tiempo de respuesta es demasiado largo, es inevitable que el usuario sienta frustración y tensión.
  • 17. Tiempo de respuesta. ➔ Por ejemplo, un tiempo de respuesta de 1 segundo para un comando resulta con frecuencia preferible a una respuesta que varíe de 0.1 a 2.5 segundos. ➔ Cuando la variabilidad es significativa, el usuario siempre se sale de balance, se pregunta si tras bambalinas ha ocurrido algo “distinto”.
  • 18. Manejo de errores. Los mensajes de error son “malas noticias” que llegan a los usuarios cuando algo sale mal. En el peor de los casos, los mensajes de error dan información inútil y sólo sirven para aumentar la frustración del usuario. “La aplicación XXX ha terminado porque encontró un error del tipo 1023.” Un mensaje de error presentado de esta manera, no hace nada para ayudar a corregir el problema.
  • 19. Manejo de errores. En general, todo mensaje de error o advertencia producida debería tener las siguientes características: 1. El mensaje debe describir el problema en un lenguaje que entienda el usuario. 2. El mensaje debe dar consejos constructivos para corregir el error. 3. El mensaje debe indicar las consecuencias negativas del error (por ejemplo, archivos corrompidos) para que el usuario pueda revisar. 4. El mensaje “no debe juzgar”. Es decir, sus palabras nunca deben culpar al usuario.
  • 20. Interfaz para WebApps Toda interfaz de usuario debe tener las características de usabilidad que se estudiaron en este capítulo. Una interfaz de webapp debe responder tres preguntas principales del usuario final: 1. ¿Dónde estoy? La interfaz debe dar una indicación de la webapp a la que se ha accedido. 2. ¿Qué puedo hacer ahora? La interfaz siempre debe ayudar al usuario a entender sus opciones. 3. ¿Dónde he estado, hacia dónde voy? La interfaz debe facilitar la navegación.
  • 21. WebApps - Principios ➔ La interfaz de usuario de una webapp es la “primera impresión” que se recibe. ➔ Sin importar el valor de su contenido, ni el beneficio general de la webapp en sí, una interfaz mal diseñada decepcionará al usuario potencial y en realidad hará que éste vaya a cualquier otro sitio. ➔ Debido al enorme volumen de webapps competidoras en virtualmente toda área temática, la interfaz debe “atrapar” de inmediato al usuario potencial.
  • 22. Flujo de trabajos de una WebApp - Ejemplo.
  • 23. Evaluación del Diseño. ➔ Una vez que se crea un prototipo operativo de la interfaz de usuario, debe evaluarse con objeto de determinar si satisfacen las necesidades de éste. ➔ La evaluación abarca un espectro de formalidad que va desde una “prueba de manejo” informal, en la que el usuario da retroalimentación instantánea a un estudio diseñado formalmente que utilice métodos estadísticos para evaluar cuestionarios que respondería una población de usuarios finales.
  • 24.
  • 25. Resumen y Conclusiones. ➔ La interfaz de usuario es presumiblemente el elemento más importante de los sistemas informáticos. ➔ Si la interfaz estuviera mal diseñada, afectaría mucho la capacidad del usuario de aprovechar el poder computacional y el contenido de información de una aplicación. ➔ En realidad, una interfaz defectuosa haría que fallara incluso una aplicación bien diseñada y con buena implementación.