Análisis de Esquemas de Color en El Diseño de Interfaces de Usuario
Análisis de Esquemas de Color en El Diseño de Interfaces de Usuario
Análisis de Esquemas de Color en El Diseño de Interfaces de Usuario
Fondo 2 Texto
Plecas
Ligas
Botones
Fondo 1
Texto
Fondo 1
Toolbars Texto
Botones
TextBox
Fondo 1 Texto
Fondo 2 Texto
Fondo 3 Texto
Fondo 4 Texto
Pleca Texto
Botones Texto
TextBox
Ligas
Fondo 1 Texto
Fondo 2 Texto
Fondo 3 Texto
Fondo 4 Texto
GroupBox Texto
Botones Texto
Ligas
Fondo 1 Texto
Fondo 2 Texto
Texto
Fondo 3 Texto
Fondo 4 Texto
Pleca Texto
Botones Texto
TextBox
Ligas
Fondo 1 Texto
Fondo 2 Texto
Fondo 3 Texto
Botones Texto
Ligas
Fondo 1 Texto
Fondo 2 Texto
Fondo 3 Texto
Pleca Texto
Botones Texto
TextBox
Ligas
¿Qué sigue?
• Podemos seguir analizando más sitios para
encontrar un patrón que nos indique como
elegir colores.
• O podemos investigar como lo hacen los
artistas gráficos.
La teoría del color
• La teoría del color es un grupo de reglas
básicas en la mezcla de colores para
conseguir el efecto deseado combinando
colores de luz o pigmento.
Modelos de color
• Los modelos de color proporcionan varios métodos para
definir los colores, y cada modelo define los colores
mediante componentes de color específicos.
• Se han elaborado distintos modelos de color, y existen
diferencias en la construcción de los círculos cromáticos
que responden a cada modelo.
• El avance que significaron los estudios de Newton es la
posibilidad de identificar objetiva y no subjetivamente un
color nominándolo por las mezclas con las que fue creado.
Modelos de color
http://www.desarrolloweb.com/articulos/1878.php
Esquema de Color Análogo
Los esquemas de color análogos, utiliza los colores que están adyacente a
uno en la rueda del color. Un color se utiliza como color dominante
mientras que los otros se utilizan para enriquecer el esquema.
Energy
F15F66 FF5159 F1885F FF8151 F1B75F FFBA51
Aqua
74DCA8 51FFA9 74DCDC 51FFFF 74A8DC 51A9FF
Sunny
F1B55F FFB851 F1D15F FFD951 F1EC5F FFFA51
EE8062 FF7651 FC8F54 FF8E51 FCA654 FFA551
Eggplant Contrast
D3EDBA D2FFA8 C6EDBA BCFFA8 BAEDBB A8FFAA F6D2B1 FFD1A8 F6D9B1 FFDBA8 F6E1B1 FFE5A8
A7DC74 A6FF51 8DDC74 7AFF51 74DC77 51FF55 EEA562 FFA451 EEB462 FFB851 EEC562 FFCC51
7ECB33 7DFF00 57CB33 3CFF00 33CB37 00FF06 EEA562 FFA451 EEB462 FFB851 EEC562 FFCC51
538622 52A800 398622 27A800 228624 00A803 985110 A85000 986010 A86400 987010 A87700
D8BAED DCA8FF E0BAED EAA8FF E9BAED F9A8FF BAE2ED A8EDFF BACFED A8CBFF BABAED A8A9FF
B274DC B951FF C374DC D651FF D574DC F351FF 74C6DC 51DBFF 749EDC 5197FF 7476DC 5154FF
8E33CB 9900FF A733CB C300FF C133CB EE00FF 33ACCB 00CBFF 3371CB 0067FF 3336CB 0004FF
5D2286 6400A8 6E2286 8000A8 7F2286 9D00A8 227186 0085A8 224A86 0043A8 222386 0002A8
Esquemas de color Triádico
Los esquemas de color Triádico utilizan tres colores
equidistantes alrededor de la rueda del color. El esquema es
popular entre artistas porque ofrece contraste visual fuerte
mientras que conserva el balance, y riqueza del color.
Fantasy
FDC7AA FFCDA8 EDD4BA FFD6A8 EDDABA FFDFA8
A091BF 9B81CF AF91BF B381CF BD91BF C48AC6
Sports
F1CB5F FFD251 F1DC5F FFE651 F1EC5F FFFA51
http://sobrecolores.blogspot.com/2010/05/esquemas-de-color-en-el-diseno.html
Comentarios finales
• Un buen diseño gráfico no es cosa de suerte, buen
gusto o instinto; tiene bases científicas y técnicas
(claro que el talento también cuenta).
• El secreto es la matemática y la geometría
(aplicada a un esquema de referencia que relaciona
a los colores).
• Los ingenieros son malos para hacer UIs, pero con
los principios y elementos adecuados, podemos
hacerlo bien.
Referencias
• http://es.wikipedia.org/wiki/Teor%C3%ADa_del_color
• http://www.webnova.com.ar/articulo.php?recurso=312
• http://www.fotonostra.com/grafico/modeloscolor.htm
• http://www.worldlingo.com/ma/enwiki/es/Color_wheel
• http://es.wikipedia.org/wiki/CMYK
• http://s3.accesoperu.com/wp6/includes/htmlarea/mezclador/ayuda/ec.htm