Diseño de interfaces de

programación

Componentes gráficos.
RECORDEMOS
 Componentes gráficos

Capacidades Temas
● Identificar componentes gráficos 1. Selección de componentes gráficos.
frecuentes. 2. Identificación de los componentes
gráficos más frecuentes.

Componentes gráficos.
 TEMA
TEMA

Selección de componentes
gráficos
El Diseño Gráfico

El objetivo del diseño gráfico es crear una

interfaz transparente:
• No obstruye el acceso.
• El usuario tiene una buena experiencia
interaccionando con el sistema.
• La interfaz casi no es detectada.

Selección de componentes gráficos.

¿Cómo conseguir un buen diseño?

Considerar cada aspecto con un sentido del

conjunto
Conjuntar el diseño funcional y el visual
• Los controles deben tener un aspecto
acorde a su función y funcionar de
acuerdo con su aspecto.
• Cuando el diseño visual clarifica sus
funciones, la interfaz resulta intuitiva.

Selección de componentes gráficos.

Componentes gráficos

Color Ilustraciones

Tipografía Iconos

Botones

Selección de componentes gráficos.

Color

• El círculo cromático moderno se

compone de tres colores primarios (rojo,
amarillo y azul). Si bien los estudios
modernos demuestran que, en realidad,
la teoría del color es un poco más
complicada que eso, el círculo cromático
sigue siendo una herramienta valiosa
para los diseñadores gráficos que
buscan combinaciones de colores
estéticamente agradables.

Identificación de los componentes gráficos más frecuentes.

Ejemplo de uso del color en diseño gráfico

• Este caso de Studio–JQ es un excelente

ejemplo de esquemas de colores
gratuitos puestos en acción. Al combinar
violeta y amarillo, que están totalmente
opuestos en el círculo cromático
moderno, se logra un efecto intenso y
muy atractivo visualmente.

Identificación de los componentes gráficos más frecuentes.

Ilustraciones

• La ilustración es uno de los recursos más

usados en diseño, pues al no estar
sometidas a un modelo natural,
permiten al ilustrador dibujar libremente
el motivo que más se adapte a la
composición.
• Se deben elegir de forma adecuada al
sentido del diseño y a cada contexto.

Identificación de los componentes gráficos más frecuentes.

Tipografía

• Debemos saber que el 95% de la

comunicación digital es a través de texto.
Es decir, que por mucho que transmita
un diseño, un logo o un icono, realmente
es el texto el que nos transmite y con lo
que nos comunicamos con el usuario.

Identificación de los componentes gráficos más frecuentes.

Tipografía

• Aprovechar esta cualidad para nuestra

app es clave para una buena interacción
y comunicación con nuestro usuario.
• La facilidad con la que se lean los textos
— es decir, la legibilidad — afectará a la
experiencia de usuario y a la usabilidad
de ésta.
• La tipografía forma parte esencial de este
proceso, una buena tipografía fácil de
leer siempre será tu mejor opción.

Identificación de los componentes gráficos más frecuentes.

Tipografía

Identificación de los componentes gráficos más frecuentes.

Iconos

• Los misión fundamental de un icono es

ofrecer, sin distraer, una información
visual concreta.

Identificación de los componentes gráficos más frecuentes.

Características de los Iconos

• Debe ser los más sencillo posible, con los

suficientes detalles como para expresar
lo que debe, pero no más.
• Debe seguir los modelos ya aceptados
por el público tipo que los va a visualizar.
Existen iconos característicos dentro de
una comunidad o país, así como otros
asumidos a nivel mundial.
• Debe estar perfectamente concebido
para la información concreta que va a
representar.

Identificación de los componentes gráficos más frecuentes.

Enlaces y Botones

• Permiten al usuario interactuar con la

aplicación, informando de la acción que
se va a producir si pincha sobre ellos.
• Funcionan de esta forma como iconos
ampliados, que permiten ejercer las
mismas funcionalidades que estos
elementos pero sin estar tan limitados
en aspectos como formas, tamaños,
colores, etc.

Identificación de los componentes gráficos más frecuentes.

Enlaces y Botones

• Otro uso de los botones es el de

representación de opciones en un menú
de navegación.
• Los sistemas de navegación suelen estar
formados por enlaces textuales, a los
que se les cambia el estilo propio de este
tipo de elementos.

Identificación de los componentes gráficos más frecuentes.

 ¿Qué aprendimos?
Cierre

Componentes gráficos.
 Conclusiones

• Los estándares y guías de estilo facilitan el diseño

de interfaces.

• Es imprescindible para un diseñador conocer el

entorno en el que trabaja.

• El diseño gráfico es importante para la usabilidad

de una interfaz.

Componentes gráficos.
PREGUNTAS???
¿Qué haremos la próxima
clase?
Libros a Consultar
● Analisis y Diseño de Sistemas, Kendall & Kendall, 8va
Edicion, Pearson.
● Ingeniería del Software Un enfoque practico, Roger S.
Pressman, 7ma Edicion, Mc Graw Hill.
FIN DE LA UNIDAD