1

ÍNDICE

Introducción ............................................................................................................................ 2

Diseño de Interfaz ................................................................................................................... 3

Interfaz de usuario ............................................................................................................... 3

Diseño de Interfaz ............................................................................................................... 3

Funciones Principales .......................................................................................................... 4

Tipos ................................................................................................................................... 5

Procesos de diseño de una interfaz de usuario ......................................................................... 5

Principios para el Diseño de Interfaz de usuario ...................................................................... 7

Prototipos en la implementación del diseño IU ........................................................................ 8

Interacción del usuario en el diseño de IU ............................................................................... 8

Color en el Diseño de la IU ..................................................................................................... 9

Ventajas del Diseño de IU ....................................................................................................... 9

Pautas para evaluar un Diseño de IU ..................................................................................... 10

Conclusiones ......................................................................................................................... 10

Bibliografía ........................................................................................................................... 11
 2

Introducción

En un proyecto de desarrollo de software, específicamente de un sistema, se desarrollan ciertas

etapas desde su comienzo hasta su fin. El desarrollo del sistema no sólo es la programación de las

funcionalidades de la aplicación que el usuario requiere, se pasan por diversas etapas, tanto

previas como posteriores.

Ya estando en la etapa del desarrollo, y una vez sabiendo exactamente qué va a hacer la

aplicación, las funcionalidades que va a realizar se deben distribuir en una interfaz gráfica de

usuario, a partir de elementos visuales; botones, campos de texto, barras de herramientas,

paneles, tablas, etiquetas, etcétera.

Podríamos decir entonces que la interfaz de usuario es el entorno visual, con el cual el usuario

va a acceder a las funcionalidades de la aplicación, sus opciones, elementos, etcétera. Es el

elemento de interacción y manejo entre la persona y el programa. El diseño de la interfaz de

usuario es una etapa conjunta con el desarrollo o programación de la aplicación y es una etapa de

gran importancia, tan importante como todas las demás.

Además de representar aspectos visuales, comodidad, usabilidad y funcionalidad, la interfaz

de usuario es la “cara” de todo nuestro sistema, es la presentación del trabajo conjunto de todo el

proyecto, por eso es de vital importancia conocer los aspectos, procesos, etapas y principios para

un buen desarrollo.

Esta investigación tiene como objetivo conocer todos esos aspectos, los cuales se presentan a

grandes rasgos en este trabajo.

 3

Diseño de Interfaz

Interfaz de usuario

La interfaz de usuario es el medio con que el usuario puede comunicarse con una máquina,

equipo, computadora o dispositivo, y comprende todos los puntos de contacto entre el usuario y

el equipo.

Normalmente suelen ser fáciles de entender y fáciles de accionar, aunque en el ámbito de la

informática es preferible referirse a que suelen ser "usables", "amigables e intuitivos" porque es

complejo y subjetivo decir "fácil".

Diseño de Interfaz

El diseño de interfaz de usuario o ingeniería de la interfaz es el resultado de definir la forma,

función, usabilidad, ergonomía, imagen de marca y otros aspectos que afectan a la apariencia

externa de las interfaces de usuario en sistemas de todo tipo (computadoras de uso general,

sistemas de control, dispositivos de comunicación móviles, software de sistemas, software de

aplicaciones, sitios web, etc). El diseño de la interfaz de usuario es una disciplina asociada al

diseño industrial.

El objetivo final del diseño de la interfaz de usuario es hacer que la interacción entre el usuario

y el sistema del que es interfaz sea tan simple y eficiente como sea posible, en términos de

cumplimiento de los objetivos del usuario. Sigue por ello una filosofía de diseño centrado en el

usuario.

Normalmente el diseño de interfaces de usuario es una actividad multidisciplinar que

involucra a varias ramas tales como el diseño gráfico, el diseño industrial, el diseño web, el
 4

diseño de software y la ergonomía; y puede aparecer como actividad en un amplio rango de

proyectos, desde el desarrollo de sistemas informáticos hasta el desarrollo de aviones

comerciales.

Un buen diseño de la interfaz de usuario facilita la compleción de tareas a realizar sin que el

usuario vea atraída su atención hacia la forma. El diseño gráfico y la tipografía se combinan para

ofrecer usabilidad, influyendo en cómo el usuario realiza ciertas interacciones y mejorando la

apariencia estética del diseño; la estética del diseño puede mejorar o dificultar la capacidad de los

usuarios para utilizar las funciones de la interfaz.

Funciones Principales

 Puesta en marcha y apagado.

 Control de las funciones manipulables del equipo.

 Manipulación de archivos y directorios.

 Herramientas de desarrollo de aplicaciones.

 Comunicación con otros sistemas.

 Información de estado.

 Configuración de la propia interfaz y entorno.

 Intercambio de datos entre aplicaciones.

 Control de acceso.

 Sistema de ayuda interactivo.

 5

Tipos

En las interfaces de usuario se pueden distinguir básicamente tres tipos:

Una interfaz de hardware, a nivel de los dispositivos utilizados para ingresar, procesar y

entregar los datos: teclado, ratón y pantalla visualizadora.

Una interfaz de software, destinada a entregar información acerca de los procesos y

herramientas de control, a través de lo que el usuario observa habitualmente en la pantalla.

Una interfaz de software-hardware, que establece un puente entre la máquina y las personas,

permite a la máquina entender la instrucción y al hombre entender el código binario traducido a

información legible.

Procesos de diseño de una interfaz de usuario

El diseño de la interfaz de usuario también requiere de una buena comprensión de las

necesidades del usuario. Cualquiera pensaría que es muy aparte el diseño de la interfaz con las

funcionalidades que va a realizar el sistema, y que es más importante la función que cumpla el

software, pero la interfaz de usuario será lo primero con lo que el cliente se va a relacionar.

Hay varias fases para el diseño de la interfaz de usuario, algunos de los cuales pueden ser más

significativos que otros dependiendo del proyecto.

• La ingeniería de requisitos: desde aquí se obtiene una lista de los elementos

funcionales requeridos por el sistema, lo que apoya en la distribución visual de las

funcionalidades.
 6

• El análisis del perfil de los usuarios: consiste en analizar al usuario al que está

dirigido el proyecto y la forma en la que trabaja, de forma que el diseño de la aplicación

le permita trabajar o se adecúe a sus necesidades.

• Arquitectura de la información: estudia cómo se va a organizar la información y

sus procesos, de forma de que la interfaz también sea adecuada.

• Prototipado: se desarrolla un prototipo simple con las pantallas y los elementos

visuales que va a contener la aplicación. Utilización de elementos de estilo, aspecto y

comportamiento. Para esto muchas veces se utilizan herramientas que ayudan a diseñar

softwares.

• Inspección de usabilidad: un evaluador, puede ser un ingeniero de software,

inspecciona la interfaz de usuario creada en la fase anterior. Se inspecciona la usabilidad

y la simplicidad de la interfaz, y se corrigen errores si se detectan. Después de la

inspección de un evaluador, el prototipo puede o no ser evaluado por el usuario, es decir,

puede decir lo que piensa mientras interactúa con el sistema.

• Diseño de la interfaz gráfica de usuario: se realiza el diseño final de la interfaz

de usuario, su aspecto y comportamiento, tomando en cuenta las fases anteriores.

• Mantenimiento: después del despliegue de una interfaz de usuario de un sistema

ya lanzado, es posible que la interfaz aún pueda ser mejorada o simplemente cambiada,

agregar características, etc. Esto se puede hacer ocasionalmente. Cabe mencionar que se

volverá a requerir de un nuevo proceso de diseño y puede que sea necesario que se repitan

algunas de las fases anteriormente mencionadas.

 7

Principios para el Diseño de Interfaz de usuario

Además de los procesos y fases que se siguen para el desarrollo de una interfaz de usuario,

también existen principios relevantes que se deben tomar en cuenta, y en caso de que sea factible

su realización, se deben aplicar.

Son los siguientes:

• Familiaridad del usuario: que el diseño de la aplicación le sea familiar, respecto a las

aplicaciones que utiliza.

• Recuperabilidad: el sistema debe contar con mecanismos para recuperarse de errores,

con el fin de que no se ponga en riesgo la información con la que se trabaja, además de

implementar mecanismos para deshacer acciones.

• Guía de usuario: es importante que el sistema cuente con algún tipo de soporte y ayuda

al usuario.

• Diversidad de usuarios: la interfaz debe adecuarse a los diferentes tipos de usuarios.

• Personalizable: la interfaz puede ser modificada para ajustarse a las necesidades del

cliente, ya sea por comodidad, por mayor usabilidad, etc.

• Carácter auto-descriptible: esto se da cuando se genera una ventana de diálogo por

ejemplo. La explicación de la solicitud al usuario debe ser clara y comprensible.

 8

Prototipos en la implementación del diseño IU

Prototipos Estáticos: son aquellos que no permiten la alteración de sus componentes, pero

sirven para identificar y resolver problemas de diseño. En esta categoría se incluyen las

presentaciones sobre reproductores, papel u otro medio de visualización.

Prototipos Dinámicos: permiten la evaluación de un modelo del sistema sobre una estación

de trabajo o una terminal. Estos prototipos involucran aspectos de diseño más detallados que los

prototipos estáticos, incluyendo la validación del diseño del sistema en términos de

requerimientos no funcionales, por ejemplo, de performance.

Prototipos Robustos: deben ser relativamente completos en la simulación de las

características dinámicas de la interfaz (presentación de mensajes de error, entrada y edición de

datos, etc.). Esta categoría puede ser utilizada para validar los objetivos de diseño.

Interacción del usuario en el diseño de IU

Una interfaz coherente debe integrar la interacción del usuario y la presentación de la

información. Shneiderman (1998) clasifica la interacción en 5 estilos primarios:

Manipulación directa: Interacción directa con los objetos de la pantalla.Rápida e intuitiva.

Fácil de aprender.

Selección de menús: El usuario selecciona un comando de una lista de posibilidades. Evita

errores del usuario. Se requiere teclear poco. Lenta para usuarios experimentados.

Llenado de formularios: Introducción de datos sencilla en los campos de un formulario. Fácil

de aprender. Ocupa mucho espacio en la pantalla.

 9

Lenguaje de comandos: Los usuarios emiten un comando especial y los parámetros

asociados para indicar al sistema que hacer. Poderoso y flexible. Difícil de

aprender. Administración de errores pobre.

Lenguaje Natural: El usuario emite comandos en lenguaje natural. Accesible a usuarios

casuales. Fácil de ampliar. Se requiere teclear más. Los sistemas de comprensión de lenguaje

natural no son fiables.

Color en el Diseño de la IU

El color ayuda y mejora la presentación de la interfaz, permitiendo al usuario comprender y

manejar la complejidad. Shneiderman establece 14 lineamientos claves para la utilización

efectiva del color.

Los más relevantes:

 Limitar el número de colores utilizados. No más de 4 o 5 colores diferentes en una

ventana y no más de 7 en la interfaz total del sistema.
 Utilizar un cambio de color para mostrar un cambio en el estado del sistema.
 Utilizar el código de colores para apoyar la tarea que los usuarios están tratando de llevar
a cabo.
 Ser cuidadoso al utilizar pares de colores.
 Si se utilizan muchos colores o sin son muy brillantes, puede ser confuso.

Ventajas del Diseño de IU

 Para interactuar con el sistema, los usuarios cuentan con pantallas múltiples. Se puede
pasar de una tarea a otra sin perder de vista la información de la anterior.
 Interacción rápida y acceso inmediato a cualquier punto de la pantalla.
 10

Pautas para evaluar un Diseño de IU

Las heurísticas ayudan a poder analizar las IU y localizar problemas que afecten la utilización

de las mismas.

 Visibilidad del estado del sistema.

 Semejanza del sistema al mundo real.
 Control y libertad por parte del usuario.
 Consistencia y estandarización.
 Prevención de Errores.
 Reconocimiento de acciones y opciones.
 Flexibilidad y eficiencia en el uso.
 Estética y diseño minimalista.
 Reconocimiento de errores, diagnóstico y recuperación.
 Ayuda y documentación.

Conclusiones

Gerardo Gutierrez Torres: La interfaz de usuario es una parte muy importante dentro de un
sistema o aplicación pues es la primera parte con la que hace contacto el cliente y cuando se
busca vender dicho sistema o aplicación esta parte puede determinar la venta pues debe ser
sencilla pero agradable con una estructura fácil de entender para cualquier persona además de
contar con colores agradables, este también debe contar con características de apoyo para el
usuario como sección de ayuda, información del sistemas y código de colores para dar a conocer
la tarea que está llevando a cabo.
Cárdenas Télles Gabriel Amador: La interfaz de usuario, no solo es una asignación que forma
parte de nuestra integridad académica, sí que es algo mucho más grande. Ya que esta también es
vista por varias carreras, sobre todo a aquellas que están mas enfocadas en el diseño tales como el
diseño industrial, y diseño gráfico. Pero esto no quiere decir que el ingeniero en sistemas no sepa
desenvolverse para esta asignación. Hay que tomar en cuenta que no solo es de colocar colores en
nuestra interfaz, sí que también está demostrado que los colores que escojamos forma parte de un
estudio para demostrar que nuestra interfaz es capaz de ser amigable con el entorno.
Vargas Argüello Jesús Alexandro: La integración de los principios, prototipos de evaluación
durante el proceso de diseño de IU permite la creación de interfaces que satisfacen las
expectativas del Modelo del Usuario, el cual es el punto de vista más importante para garantizar
la aceptación de un sistema.
 11

Entre las características que contribuyen a construir una interfaz sencilla de utilizar, sobresale la
utilización de metáforas como ayuda para simplificar al usuario en la operación del sistema. Para
que el usuario pueda entender mejor la interfaz y se adapte con mayor facilidad.
Mondragón Madrigal Cristian: Dentro del diseño de la interfaz de usuario de un sistema
concurren bastantes áreas para su desarrollo. Además de conocer la funcionalidad del sistema, el
tipo de usuarios que van a hacer uso de la aplicación, obtención de requisitos, etcétera, también es
necesario tener un poco de conocimientos de diseño, puesto que se deben ver reflejados en una
buena apariencia de la aplicación, lo cual se logra con un buen diseño de interfaz de usuario. De
esta forma, dentro del proyecto, se mezclan conocimientos de otras ciencias; puede que se
necesite la ayuda de diseñadores gráficos, o bien, personas que tengan ya experiencia en esto. El
proceso de diseño de la interfaz de usuario sigue ciertas normas, por ejemplo, las de colores,
principios y modelos que se siguen para su buen desarrollo. Todos estos elementos se aplican
hasta el final y se siguen mejorando en las etapas de evaluación y prueba, todo esto con el fin de
obtener el mejor producto final posible.

Bibliografía

Anonimo. (17 de Septiembre de 2017). EcuRed. Obtenido de

https://www.ecured.cu/Diseño_de_Interfaces_de_Usuario

Arellano, D. (25 de julio de 2013). Semántik. Obtenido de

www.semantik.com.mx/universitarios/los-colores-a-traves-de-la-interfaz-de-usuario/

Artigas, S. G. (2 de diciembre de 2016). torresburriel. Obtenido de

https://www.torresburriel.com/weblog/2016/12/02/el-uso-de-colores-en-lasinterfaces/

Ávila, J. L. (s.f.). Obtenido de http://www.ticarte.com/contenido/diseno-de-interfaces-de-usuario

Cardenas, A. (1 de Agosto de 2016). Prezi. Obtenido de https://prezi.com/ol_tba_wgr38/tipos-de-

interfaz-del-usuario/
 12

Gómez, L. S. (s.f.). Obtenido de

https://www.researchgate.net/publication/228877430_Diseno_de_Interfaces_de_Usuario_

Principios_Prototipos_y_Heuristicas_para_Evaluacion

Gómez, L. S. (16 de Enero de 2000). Research Gate. Obtenido de

https://www.researchgate.net/publication/228877430_Diseno_de_Interfaces_de_Usuario_

Principios_Prototipos_y_Heuristicas_para_Evaluacion

Gomez, S. (s.f.). Monografias.com. Obtenido de

https://www.monografias.com/trabajos10/diusuar/diusuar.shtml

Kennedy, E. D. (26 de Noviembre de 2014). Medium. Obtenido de

https://medium.com/español/7-normas-para-crear-interfaces-de-usuario-esplendidas-

parte-1-1c2cd2422ecea

Tames, J. P. (09 de Noviembre de 2011). SlideShare. Obtenido de

https://es.slideshare.net/jpbthames/el-proceso-de-diseo-de-interfaz-del-usuario-pressman

Zamora, F. (18 de Febrero de 2015). EcuRed. Obtenido de

https://www.ecured.cu/Dise%C3%B1o_de_Interfaces_de_Usuario