Clase 10

Unidad 6: La informatización del color 

(segunda clase de esta unidad)

Dado que las actividades previstas para hoy han sido pensadas para que puedas resolverlas en menos tiempo que otras clases, te recomendamos comenzar con el cuestionario asincrónico 6A a continuación de las actividades sincrónicas y así resolverlo dentro del crédito horario de la asignatura. Además, que aproveches para ponerte al día si tenés actividades pendientes de clases anteriores.

La notación HTML, otra forma de designación de colores en los selectores

El lenguaje HTML emplea notación hexadecimal de seis dígitos para designar los colores RGB.  El sistema de numeración hexadecimal tiene como base el 16. Esto quiere decir que se usan 16 símbolos y no diez, como en el sistema decimal. Dado que el sistema arábigo de numeración es de base decimal y, por ello, sólo tiene diez dígitos, se adoptó la convención de usar las seis primeras letras del alfabeto latino (indistintamente en mayúsculas o minúsculas) para suplir los dígitos restantes. Resulta así que los dígitos de este sistema van del 0 a la F. 

En hexadecimal, los símbolos que se  emplean son:

0; 1; 2; 3; 4; 5; 6; 7; 8; 9; A; B; C; D; E; F

(A equivale al 10 del sistema decimal, B al 11, C  al 12, D al 13, E al 14 y F al 15).

El lenguaje HTML emplea notación hexadecimal de seis dígitos para designar los colores RGB.

La notación HTML (o códigos Hex) suele ser empleada por sitios web y muchas aplicaciones de software para designar colores RGB. Esto porque dos dígitos hexadecimales permiten codificar hasta 256 posibilidades, (lo que se deriva de destinar un byte en memoria), la misma cantidad que se emplea en el modelo RGB para cada primario luz. Los primeros dos dígitos se emplean para designar las variaciones de luz roja (del mínimo al máximo), los siguientes para la luz verde y los dos últimos para la luz azul. El color blanco, por ejemplo, se obtiene por la mezcla de los tres colores primarios luz en su máxima intensidad, entonces el código HTML que corresponde al blanco es #FFFFFF. El código que corresponde al negro será #000000.

Aprovechamos el Modelo HSV para construir paletas de colores armónicos

Te mostramos cómo usar la herramienta recoge-color en Gimp para poder recuperar el código de color de un píxel y así poder registrar su código.

¡Ahora, manos a la obra!

1- Construí tus propias paletas de armónicos en GIMP y compartilas

  • Elegí “archivo Nuevo”, creá un lienzo de 1000×200 pixeles y guardalo con el nombre: paletas tu apellido.xcf (en el formato nativo de GIMP) en tu computadora. 
  • Luego usá guías para dividir el lienzo en cinco cuadrados de 200×200 pixeles.
  • Creá tres capas y en cada una de ellas, generá una paleta de 5 armónicos:
  1. Por saturación y brillo
  2. Por saturación y tinte
  3. Por brillo y tinte
  • Elegí una de las paletas (la que más te guste),  exportá como jpg y denominá el archivo con el tipo de armónicos al que corresponda la paleta + tu apellido y la inicial de tu nombre (por ejemplo: tinte-saturación-RomeroM.jpg) y sin compresión.
  • Cargá el archivo en la columna del Mural que corresponda, como título colocale tu Nombre y apellido y en la descripción escribile los códigos HTML de cada color, separados por comas. (Tenés tiempo hasta mañana viernes 19/05 a las 13:00 hs. para completarlo).

Este mural está cerrado, y no admite más contribuciones.

Hecho con Padlet

2- Registrá los códigos de color de la paleta que cargaste en el mural y subilo al aula

  • En una tabla como la que se muestra a continuación, completá con los códigos de los colores de la paleta que subiste al mural, según los modelos que en ella se indican. (recordá que podes usar la herramienta recoge-color de Gimp)
  • Podes editar la tabla que descargaste en PDF o replicarla dibujándola en una hoja. En tal caso, sacale una foto y editala para que de ancho tenga 1200 píxeles.
  • Renombrá el archivo con tu apellido y la inicial de tu nombre.
  • Cargá tu archivo PDF o JPG en el aula virtual. (Tenés tiempo hasta mañana viernes 19/05 a las 13:00 hs. para cargarlo al aula).

Te mostramos, alternativas al trabajo que hiciste en Gimp usando una aplicación en línea para seleccionar paletas de colores.

Generación de paletas de color desde la web con Adobe Color.

 

Adobe 1 en tgd

Extracción de una paleta de color de una fotografia empleando Adobe Color.

Adobe 2 en tgd

Existen muchas otras aplicaciones, en línea, que permiten prestaciones similares a la que ofrece Adobe color. En la pestaña links de interés de este blog, hemos cargado las direcciones de algunas de ellas.

La parte A del Cuestionario Asincrónico de la Unidad 6, sobre Modelos de Color, se encuentra disponible en el Aula. La fecha de entrega es el lunes 29 de mayo a las 8:00 hs.