0% encontró este documento útil (0 votos)
58 vistas13 páginas

Fundamentos del Diseño UI

El documento habla sobre los fundamentos del diseño de interfaz de usuario. Explica que el diseño es un proceso centrado en el usuario para resolver problemas visuales o físicos. Luego describe algunos principios básicos del diseño como el uso de cuadrículas, iconografía, teoría del color y tipografía. Finalmente, detalla cada uno de estos elementos y cómo aplicarlos para lograr una interfaz de usuario funcional y de calidad.

Cargado por

Alejandro Medina
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
0% encontró este documento útil (0 votos)
58 vistas13 páginas

Fundamentos del Diseño UI

El documento habla sobre los fundamentos del diseño de interfaz de usuario. Explica que el diseño es un proceso centrado en el usuario para resolver problemas visuales o físicos. Luego describe algunos principios básicos del diseño como el uso de cuadrículas, iconografía, teoría del color y tipografía. Finalmente, detalla cada uno de estos elementos y cómo aplicarlos para lograr una interfaz de usuario funcional y de calidad.

Cargado por

Alejandro Medina
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd

UI Design

TCS Internal Use


UI Design
Fundamentos del Diseño

 Diseñar es un método de resolución de Principios sobre el diseño


problemas. Ya sea un plano, una interfaz de
usuario inteligente, un folleto o una silla, el  Estos principios son
diseño puede ayudar a resolver un problema fundamentales al momento de
visual o físico. diseñar e implementar interfaces
efectivas, como los entornos de
 Diseñar es un proceso de trabajo que gira GUI tradicionales, la web,
entorno al usuario e impulsa el desarrollo en dispositivos móviles, dispositivos
función de las necesidades específicas de sus portátiles o dispositivos
clientes. inteligentes conectados a
Internet.
 No es puramente estético, ni totalmente
analítico o funcional. Al considerar el diseño de  Una comprensión básica de los
sus proyectos, debe pensar en cómo todo principios del buen diseño es la
encaja en armonía, siendo esta la forma base para crear una buena
práctica de abordar los problemas para interfaz de usuario.
diseñar.

TCS Internal Use


UI Design
El diseño de interfaz de usuario

 El diseño de interfaz de usuario se conoce Elementos de diseño de interfaz de


como el proceso de guiar visualmente a un usuario
usuario a través de la interfaz de un Para lograr un diseño funcional es
producto, sus elementos interactivos y en necesario tener en consideración
todas sus plataformas. siempre como usar los siguientes
elementos:
 Esta también transmite la fortaleza y los
activos visuales de una marca a la interfaz  Cuadrículas de diseño
de un producto para mejorar la experiencia  Iconografía
del usuario.
 Teoría del color
 Tipografía

TCS Internal Use


UI Design
Cuadrículas de diseño

Es la caja de herramientas de los diseñadores,


siendo uno de los elementos básicos
fundamentales. Si no usamos cuadrículas de diseño:

Las Cuadrículas de diseño ayudan a  Tus proyectos nunca tendrán


estructurar su diseño de una manera eficiente armonía visual.
y ordenada.  Como todo lo que carece de
estructura o una base sólida, sus
conceptos serán visualmente
inconsistentes.
 Los elementos gráficos no
funcionarán armoniosamente
juntos.

TCS Internal Use


UI Design
Iconografía
La iconografía es una forma efectiva de transmitir una idea
en un factor de forma pequeño. Este enfoque se está
volviendo más crítico en los días de la reducción de la
pantalla.
Con el aumento de dispositivos móviles, los íconos juegan un
papel importante en el diseño de la interfaz, ayudan a la
tactilidad, simplificación y ahorro de espacio dada la cada vez
más frecuente navegación en pantallas pequeñas.

Hay seis pautas para tener en cuenta al diseñar iconos. Estas aseguran que
su uso no sea confuso para el usuario

• Etiquete los iconos a menos que haya una restricción de espacio.


• Representar tanto la acción del icono como el objeto.
• Agrupe iconos similares.
• Dele a sus iconos un motivo visual común.
• Evite proporcionar iconos con demasiados detalles.
• Asegúrese de que el orden y la ubicación de los iconos sean consistentes.

TCS Internal Use


UI Design
Teoría del color

El color es uno de los elementos del diseño Matiz:


esenciales de la interfaz de usuario. Debido a su
impacto en el usuario, es importante conocer la
teoría del color e incluso un poco de psicología.  El matiz es el más básico de los
términos de color y denota el color
de un objeto.
Los colores cálidos emiten un mensaje ardiente,
 Cuando decimos azul, verde o rojo,
mientras que los colores fríos tienen un efecto
estamos hablando de matiz.
calmante.

Los esquemas de color análogos, a menudo


encontrados en la naturaleza, son agradables a
la vista, mientras que los esquemas de color
complementarios tienen una sensación más
enérgica.

TCS Internal Use


UI Design
Teoría del color

Croma: Saturación:
 Croma se refiere a la pureza de  La saturación señala cómo surge un matiz en
un color. condiciones de iluminación particulares.
 Un tono con alto croma no tiene  Considere la saturación basada en tonos
negro, blanco o gris. pálidos vs puros o débiles vs fuertes.
 Agregar blanco, negro o gris
reduce el croma.

TCS Internal Use


UI Design
Teoría del color

Valor: Tono:
 El valor o la claridad se refiere a cuán  Los tonos se forman cuando el gris
oscuro o claro es un color. se combina con un matiz y se ven
 Los colores más claros tienen valores más suaves o más opacos que los
más altos. matices puros.
 Por ejemplo, el anaranjado exhibe un
valor más alto que el púrpura oscuro o
el azul marino. El negro muestra el
menor valor de cualquier tono, y el
blanco el mayor.

TCS Internal Use


UI Design
Teoría del color

Sombra: Tinte:
 Se forma cuando el negro se  Se crea cuando se agrega blanco a
combina con un matiz haciéndolo un matiz para aligerarlo.
más oscuro.  Los tintes muy claros se conocen
 Es mejor evitar mezclar sombras con como pasteles. Cuando cualquier
matices ya que esto crea un aspecto matiz puro se mezcla con blanco
demasiado oscuro y pesado. obtenemos un tinte.
 Por ejemplo, el rosa es un color y a la
vez un tinte del rojo.

TCS Internal Use


UI Design
Tipografía

La tipografía es el arte del tipo. Las partes principales de la tipografía son las
fuentes, la legibilidad y los tamaños.

TCS Internal Use


UI Design
Tipografía

Partes de un tipo
 Altura de Mayúscula es la altura total
de las letras mayúsculas en una
formación de palabras.
 El Ascendente se conoce como la
cola hacia arriba en letras como b, d,
h, k, l y t.
 Descendente se conoce como la cola
hacia abajo para letras como y, q y g.
 Altura X es la altura de la letra y no
tiene descendentes ni ascendentes.
 La línea de base se conoce como el
límite en el que se encuentra la parte
más baja de la letra.
 Blanco Interno es el espacio en
blanco que se ve dentro de las letras,
como p y o.

TCS Internal Use


UI Design
Tipografía

Partes de un tipo

 Interlineado se conoce como el


espacio entre líneas de texto.
– Es una herramienta valiosa para  Interletrado o Kerning es el espacio
entregar texto legible. entre los caracteres.
– Un buen interlineado puede
mejorar la apariencia del peor
tipo.
– Un mal interlineado puede
depreciar un trabajo de calidad.

TCS Internal Use


Elements of User Experience

Gracias

TCS Internal Use

TCS Internal Use
UI Design
TCS Internal Use
UI Design

Diseñar es un método de resolución de 
problemas. Ya sea un plano, una interfaz de 
usuario inte
TCS Internal Use
UI Design

El diseño de interfaz de usuario se conoce 
como el proceso de guiar visualmente a un 
usuario a
TCS Internal Use
UI Design
Es la caja de herramientas de los diseñadores, 
siendo uno de los elementos básicos 
fundamentales
TCS Internal Use
UI Design
Iconografía
La iconografía es una forma efectiva de transmitir una idea 
en un factor de forma peq
TCS Internal Use
UI Design
El color es uno de los elementos del diseño 
esenciales de la interfaz de usuario. Debido a su 
im
TCS Internal Use
UI Design
Croma:

Croma se refiere a la pureza de 
un color.

Un tono con alto croma no tiene 
negro, blan
TCS Internal Use
UI Design
Teoría del color
Tono:

Los tonos se forman cuando el gris 
se combina con un matiz y se ven 
más
TCS Internal Use
UI Design
Teoría del color
Sombra:

Se forma cuando el negro se 
combina con un matiz haciéndolo 
más oscur
TCS Internal Use
UI Design
La tipografía es el arte del tipo. Las partes principales de la tipografía son las 
fuentes, la le

También podría gustarte