1 puntos por GN⁺ 2024-07-28 | 1 comentarios | Compartir por WhatsApp
  • El borde en forma de herradura del diagrama de cromaticidad xy CIE 1931 no proviene de una fórmula arbitraria, sino de las funciones de igualación de color, que miden cómo las personas perciben relativamente la luz roja, verde y azul
  • Los datos CIE RGB son el resultado de experimentos en los que se ajustaron fuentes de luz de 700 nm, 546 nm y 435 nm para igualarlas con colores espectrales; los valores negativos en algunas longitudes de onda muestran que hay colores que no pueden reproducirse solo con RGB puro
  • El espacio de color XYZ es un estándar que transforma RGB de forma lineal para que todos los valores sean positivos y más fáciles de manejar, y proyecta los valores tridimensionales a coordenadas de cromaticidad 2D mediante x = X/(X+Y+Z), y = Y/(X+Y+Z)
  • Los colores dentro del diagrama pueden aproximarse no calculándolos directamente desde x, y, sino creando varias formas de líneas espectrales, multiplicándolas por las funciones de igualación de color e integrando el resultado antes de ubicarlas en coordenadas xy
  • Las pantallas reales están limitadas a espacios de color de visualización como sRGB o display-p3, por lo que muchos colores cercanos al borde no se muestran con precisión y se produce clipping o saturación de canales

Punto de partida del diagrama en forma de herradura

  • Al entender el espacio de color CIE 1931 XYZ, el diagrama de cromaticidad que aparece una y otra vez es una gráfica que representa la calidad del color separada del brillo
  • El borde está conectado con los colores espectrales de longitudes de onda específicas, pero la forma completa y los colores internos no se explican con una simple fórmula x = func(y)
  • La forma esencial surge de cómo las personas perciben el rojo, el verde y el azul entre sí, y los colores internos pueden renderizarse en una imagen 2D mediante matemática de mezcla de colores y muestreo por puntos

Funciones de igualación de color y CIE RGB

  • Las funciones de igualación de color indican cuánto hay que ajustar la intensidad de fuentes de luz roja, verde y azul para que un color objetivo de una longitud de onda específica se vea igual al ojo
  • Las funciones de igualación de color CIE 1931 RGB toman como referencia fuentes de luz roja, verde y azul de 700 nm, 546 nm y 435 nm, respectivamente
  • El experimento se realizó colocando una fuente de luz con el color objetivo de un lado, y del otro lado fuentes RGB que una persona ajustaba directamente para igualarlas con el color objetivo
  • En estos datos aparecen valores como rojo negativo
    • Una fuente de luz negativa no puede crearse físicamente
    • Significa que algunos colores espectrales no pueden reproducirse solo con fuentes RGB puras
    • Aun así, después de una transformación, pueden usarse de forma útil en cálculos de espacio de color

Espacio de color XYZ y coordenadas de cromaticidad xy

  • El espacio de color XYZ es una transformación lineal del espacio de color RGB mediante una matriz; es, en gran medida, la misma información reubicada en otro sistema de coordenadas más fácil de calcular
  • Usando la matriz de transformación RGB de Wikipedia, se pueden comparar los datos de las funciones de igualación de color XYZ con la gráfica RGB
matrix = [
  2.364613,  -0.89654, -0.468073,
 -0.515166,  1.426408, 0.088758,
  0.005203, -0.014408, 1.009204
]

[R, G, B] = matrix * [X, Y, Z]
  • XYZ puede usarse como un espacio estándar para describir todos los colores, incluso colores que un dispositivo de visualización no puede emitir directamente
    • Cada dispositivo debe interpretar estos valores dentro del espacio de color que puede mostrar físicamente
    • A medida que se amplía la gama de color del dispositivo, puede representar más colores a partir de la misma información de color
  • Las coordenadas de cromaticidad xy se calculan dividiendo los valores XYZ por su suma total
const x = X / (X + Y + Z)
const y = Y / (X + Y + Z)
const z = Z / (X + Y + Z) = 1 - x - y
  • Como z puede derivarse de x e y, normalmente se omite en el diagrama de cromaticidad xy
  • Para volver de xy a XYZ se necesita el valor Y; la representación que lo incluye es el espacio de color xyY

Por qué se ve como una herradura

  • Al proyectar los datos de las funciones de igualación de color RGB a xy, empieza a aparecer el contorno familiar del diagrama de cromaticidad
  • Debido a los colores imposibles, los datos RGB incluyen una región negativa en el eje x; al transformarlos a XYZ, se acercan más a la forma de herradura conocida
  • Si se renderizan directamente en xy los datos tabulados de las funciones de igualación de color XYZ, coinciden con la misma forma
  • La forma se deriva directamente de las curvas de las funciones de igualación de color XYZ
    • Para cada longitud de onda, se calcula la proporción que ocupan X, Y y Z dentro del total
    • Al marcar puntos siguiendo esas proporciones, se forma el borde de cromaticidad
  • Si se aplica el mismo procedimiento a funciones de igualación de color creadas arbitrariamente, aparece una forma totalmente distinta, por lo que la herradura real es el resultado de funciones derivadas de experimentos de visión humana

Forma aproximada de rellenar los colores internos

  • Solo con las coordenadas x, y no se puede saber de inmediato si ese punto es un color válido ni qué color debería aproximarlo
  • En cambio, puede usarse el enfoque de crear valores XYZ o espectros arbitrarios, convertirlos a coordenadas xy y ubicarlos en la gráfica
  • La clave es generar formas de líneas espectrales
    • Se crea una línea sobre todo el eje de longitudes de onda que indica cuánto aporta cada longitud de onda al color
    • Esa línea se multiplica por las funciones de igualación de color XYZ y se integra para obtener los valores XYZ finales
    • Del mismo modo, se multiplica por las funciones de igualación de color RGB y se integra para obtener valores RGB
    • Los valores XYZ obtenidos se convierten a xy y se colocan en el diagrama de cromaticidad
  • Al cambiar el offset y el ancho de dos curvas sinusoidales, se generan distintas líneas espectrales, y como resultado aparecen otros colores y coordenadas en la gráfica
  • La demo automatizada recorre un espacio más amplio variando el offset y el ancho, pero no llega a rellenar por completo todo el espacio de color
  • Se ofrece una demo en CodePen para experimentar directamente

Visualización en pantalla y restricciones de espacio de color

  • Para mostrar en pantalla los valores XYZ calculados, hay que convertirlos a un espacio de color de renderizado real, como sRGB
  • El rgb() del navegador asume sRGB, por lo que al convertir XYZ a RGB hay que considerar la corrección gamma
  • display-p3 es un espacio de color con una gama más amplia que sRGB, y muchos navegadores y pantallas lo soportan
  • En CSS, los colores display-p3 pueden especificarse con la forma color(display-p3 r, g, b)
  • El espacio de color p3 del navegador también usa la misma corrección gamma que sRGB, así que hay que incluirla para que el color se renderice correctamente
  • En navegadores y pantallas wide gamut se pueden ver colores más intensos, pero solo con este experimento es difícil determinar cómo se transmite p3 en capturas de pantalla o al compartir pantalla por Zoom, o cómo se convierte a sRGB

Por qué los colores no son completamente precisos

  • Si los colores internos se convierten directamente desde valores XYZ con XYZ_to_sRGB, muchos colores quedan fuera del rango 0–255 y el resultado se ve demasiado saturado
  • En lugar de obtener colores directamente desde XYZ, el método de multiplicar las líneas espectrales por las funciones de igualación de color RGB e integrar parece una mejor interpolación
  • Aun así, una parte considerable de los colores generados sigue siendo valores RGB no válidos
  • Si no se renderizan los colores que salen del rango 0–255, solo queda el familiar triángulo sRGB
  • Los colores fuera del triángulo no se muestran con precisión, pero cuando solo 1 o 2 de los canales RGB están saturados, los cambios en los canales restantes todavía permiten percibir cierta diferencia de color

Recursos relacionados

1 comentarios

 
GN⁺ 2024-07-28
Comentarios de Hacker News
  • La forma más común de representar la cromaticidad en una cuadrícula de coordenadas cartesianas es bastante engañosa. Los diagramas de cromaticidad usan coordenadas baricéntricas, y la forma extrañamente torcida del diagrama de cromaticidad XYZ habitual parece más una distorsión causada por la manera de dibujarlo que una propiedad real de los datos.
    Es más natural ver el diagrama de cromaticidad como una sección plana bidimensional que pasa por los tres vectores unitarios estándar en un espacio de color tridimensional, y una ilustración con un triángulo equilátero como [1] muestra bien ese punto. También deja más claro que la gama completa del espacio XYZ no es una forma aplastada arbitrariamente, sino que fue elegida deliberadamente para llenar bastante bien el octante positivo dentro de las restricciones de la visión humana.
    [1]: https://physics.stackexchange.com/questions/777501/why-is-th...

    • El diagrama de cromaticidad CIE 1976 u'v' está distorsionado a propósito para ser más uniforme perceptualmente, y en general puede ser una mejor representación que el diagrama xy o el del triángulo equilátero.
      Como los ejes X, Y y Z en sí son hasta cierto punto arbitrarios, no se puede decir que dibujar xy dentro de un triángulo equilátero sea intrínsecamente más correcto que dibujarlo dentro de un triángulo rectángulo isósceles. Usar coordenadas más cercanas a las respuestas de los conos podría ser conceptualmente más claro, pero estos diagramas bidimensionales al final pueden inducir a error a quien no tenga una comprensión profunda de cómo funciona la visión y qué significa el gráfico.
    • Hay un video que muestra este concepto. Cada fotograma muestra los colores permitidos para un brillo determinado en el espacio Rec. 709 YCbCr.
      https://www.w6rz.net/chromacity.mp4
    • Correcto. Aunque un diagrama de cromaticidad no es una sección del espacio de color, sino más bien una proyección central desde el origen hacia el plano X+Y+Z=1.
  • Esa versión específica del diagrama de cromaticidad hace que los colores que faltan en las pantallas parezcan verdes de varios tipos de punteros láser. En realidad también faltan muchos rojos y azules, debido a primarios rojo y azul muy saturados que son demasiado oscuros por unidad de energía como para ser utilizables.
    Referencia: https://nanosys.com/blog-archive/2012/08/14/color-space-conf...
    Aprendí más de lo que quería sobre gestión de color mientras hacía imágenes estereoscópicas rojo-cian. Pedía rojo sRGB, pero en un monitor de gama amplia obtenía valores como (180,16,16), lo que provocaba mucha diafonía entre canales. Ahora estoy trabajando con una amiga costurera en telas impresas personalizadas, y el amarillo de un estampado floral de algún modo se volvió naranja durante el procesamiento, así que estoy intentando terminar la depuración y la corrección antes de hacer el pedido. Todavía estoy aprendiendo demasiado sobre gestión de color.

    • Por eso Pantone gana tanto dinero.
    • Dicho de otra forma, ¿eso significa que el diagrama de cromaticidad podría extenderse más hacia el sureste? Es decir, me pregunto si en el espacio de color XYZ las funciones de activación X y Z podrían extenderse más hacia la izquierda y la derecha, pero como la línea espectral continúa con frecuencias que siguen más allá, esa región quedaría ocupada en su mayor parte por infrarrojo y ultravioleta, que no podemos ver.
    • El artículo enlazado dice que la zona coloreada marcada como “visible region” representa los colores que los humanos pueden ver, y que las zonas sin color representan estímulos de conos físicamente imposibles.
      Pero la percepción visual va mucho más allá de lo que los conos del ojo pueden ver físicamente. Detrás está todo el cerebro intentando interpretar los fenómenos del nervio óptico. Como estimulación cerebral curiosa, conviene buscar los colores quiméricos, que se pueden ver aunque los conos no puedan detectarlos físicamente. Por ejemplo, azul estigio, rojo autoluminoso y naranja hiperbólico.
      †: https://www.perplexity.ai/search/please-provide-chimerical-c...
      W: https://en.wikipedia.org/wiki/Impossible_color
    • Si estás trabajando con telas impresas personalizadas, casi con seguridad deberías trabajar en el perfil de espacio de color CMYK/SWOPv2 del proveedor para que los colores salgan bien. Conviene preguntarle al proveedor. Los RGB saturados no se convierten bien. Una alternativa es bajar la saturación del amarillo para que tenga un poco de gris.
      Ejemplo: https://ctnbee.com/en/upload
  • Hay otra exploración interesante sobre espacios de color: https://ericportis.com/posts/2024/okay-color-spaces/

    • Esta es mejor. Es bastante raro que el enlace original no trate Lab y OKLab.
      A quienes creen que el violeta/magenta no son colores “reales”, les diría que, como en longitudes de onda cortas el rojo X disminuye más lentamente que el azul Z, por debajo de 400 nm se puede obtener un violeta/magenta saturado de una sola longitud de onda y alta potencia. No está bien representado en los gráficos de cromaticidad estándar, tampoco es eficiente para monitores y, como ocurre incluso con el azul, mirarlo durante mucho tiempo es peligroso. Si ves un láser violeta/magenta de una sola longitud de onda, debes apartar la mirada o cerrar los ojos.
  • Excelente. Me hizo pensar en una idea sobre el color, la percepción y la gama.
    En pocas palabras, imaginemos que cierta combinación de longitudes de onda de luz te hace percibir el olor de un queso madurado, y otra combinación te hace pensar que hay un oso detrás de ti. Entonces el diagrama debería incluir no solo píxeles de color, sino también pequeños dibujos de queso y osos en los puntos donde se produce esa percepción específica.
    En realidad creo que el magenta es algo así. Es un color que no está en el espectro, y se siente más como una sensación o percepción que el cerebro convierte simplemente en otro color para no verse demasiado abrumado. Creo que esto también se acerca a explicar fenómenos reales en personas con distintos grados de sinestesia, o, si se me permite el juego de palabras, personas dentro del espectro sinestésico.

    • No entiendo por qué el cerebro se vería “abrumado” por colores no espectrales. Me pregunto si sabes que en la naturaleza prácticamente no hay colores espectrales.
  • Está bien partir de XYZ, pero hoy existen espacios de color mucho mejores que se corresponden mejor con nuestra visión. Entre los principales están CIE 1976 L',u',v' y, más recientemente, ICtCp de las investigaciones de Dolby

    • El espacio de color xyY está diseñado para que el color de la luz obtenida al mezclar dos puntos quede sobre la línea recta entre esos dos puntos correspondientes. Por eso es muy útil para averiguar qué colores se pueden crear con un conjunto específico de primarios.
      Del mismo modo, si se dibujan los colores correspondientes a longitudes de onda puras y luego se toma su envolvente convexa, se obtiene todo el espacio de color físicamente posible. Esta característica es difícil de reproducir correctamente en otros espacios de color; a lo sumo, mediante una transformación lineal. XYZ ya es una transformación de ese tipo y tiene casi todas las propiedades que uno podría desear de una elección de base
    • No creo que sea buena idea empezar por XYZ y las funciones de igualación de color. LMS y las funciones de respuesta de los conos explican la respuesta humana al color de una manera más fundamental e intuitiva, así que si de todos modos se va a tratar XYZ, habría que partir de LMS desde primeros principios y llegar hasta ahí
    • Si ya terminaste con XYZ, también vale la pena ver XYB, usado en JPEG XL y jpegli
      https://giannirosato.com/blog/post/jpegli-xyb/
    • CAM-16. Si te confunde, pregúntale a un científico del color
  • Me pregunto si existe un espacio de color “educativo” optimizado para la enseñanza y el aprendizaje. Uno que priorice la precisión por encima de la matemática simple, y en el que las características llamativas sean rasgos reales de la percepción humana, no “artefactos del modelo”.
    Me gustaría que cubriera toda la gama, funcionara bien hasta con el locus espectral, y que el tono y la mezcla de colores fueran en cierta medida lineales. Algo parecido al lugar que ocupaba Munsell, pero que abarque toda la gama y sea del siglo XXI. En un proyecto paralelo sobre “¿no se podría enseñar mejor el color si se enfatizara el espectro?”, no encontré nada cercano, así que armé algo provisional. Usé CAM16UCS como candidato moderno de espacio de color perceptual, desenredé el tono lineal con Jzazbz, hice también una comprobación de cordura de luminancia absoluta, y aplasté de forma bastante poco principista una extraña cola azul cerca del locus, que entendí como algo no perceptual de CAM. La implementación fue con una lookup table. Me gustaría saber si existe trabajo relacionado

    • Cam16, a diferencia de cam16 ucs, está basado en la percepción. Calcula croma, claridad y tono, y se basa en el sistema de color Munsell.
      Hellwig y Fairchild simplificaron matemáticamente el modelo recientemente y mejoraron la precisión del croma (http://markfairchild.org/PDFs/PAP45.pdf). Un modelo más simple es CIELAB, que genera los parámetros L, a, b. Aquí L es la claridad, hypot(a,b) es el croma y arctan2(b,a) es el tono
    • Al hablar de color con estudiantes, el espacio HSL fue el más fácil de usar. He oído que desde el punto de vista de la matemática del color es muy desordenado, y que esa fue una de las razones por las que Adobe dejó de usarlo en Photoshop 3. Pero desde el punto de vista perceptual es una forma que les gusta a los artistas.
      Una mejor opción podría ser el espacio de color Munsell. Munsell dividió todo el dominio de colores en miles de pequeñas piezas, y la distancia entre cada pieza era una unidad de “diferencia apenas perceptible”, determinada mediante cuidadosas pruebas con usuarios. Por eso la región verde era mucho más grande que la amarilla. El proceso de desarrollo de este espacio de color también es muy interesante; él era pintor, pero su trabajo abrió el camino a espacios de color más modernos
  • Una “fuente de luz roja negativa” significa que el sujeto giró el dial que agrega luz roja al color que intentaba igualar.
    Básicamente, hay un color desconocido C y un color R+G+B. A veces no se puede igualar, así que se intenta igualar C+R = G+B. En ese caso, como se agrega R al otro lado de la ecuación, aparece un R “negativo”. Lo mismo ocurre con el verde y el azul, pero en menor medida

  • En general es correcto, pero en la última sección no entiendo bien la parte en la que el autor genera espectros con dos picos, los proyecta en el diagrama de cromaticidad e intenta rellenar el interior del locus. No sé por qué lo hace.
    Creo que la forma de hacerlo debería ser esta: primero elegir un valor Y como luminancia del gráfico y, para cada píxel dentro del área delimitada por el locus espectral y la línea púrpura, tomar las coordenadas x, y. Estos tres valores especifican un color en el espacio de color CIE xyY, y la conversión de xyY a XYZ es simple: X = Y / y * x, Y = Y, Z = Y / y * (1 - x - y). Luego se mapean los valores XYZ al espacio de color de la imagen de salida, por ejemplo sRGB. Si un valor XYZ específico cae fuera del rango [0,1] de sRGB, está fuera de la gama sRGB, así que basta con recortarlo al valor válido de gama más cercano

    • Soy el autor. No entendía cómo hacer que eso funcionara, y lo mencioné en el artículo. Esta demo lo hace de esa manera: https://jlongster.com/why-chromaticity-shape#block-31f373
      El problema es “cada píxel dentro del área”. Podría haber hecho eso y luego recortar la salida con esa forma, pero entonces estaría recortando la salida con la forma misma, lo que no responde en absoluto por qué tiene esa forma. Me parecía falso. Dicho eso, parece ser la forma más común. Intenté entender un enfoque más riguroso, y el método de generar espectros para rellenarla está explicado aquí: https://clarkvision.com/articles/color-cie-chromaticity-and-...
      Eso me parece un enfoque más riguroso, aunque probablemente el recorte también sea una forma “suficientemente buena”
  • Tengo una pregunta para quienes saben de ciencia del color. Estoy leyendo los datos originales de Guild https://royalsocietypublishing.org/doi/pdf/10.1098/rsta.1932... y me cuesta entender qué significan los números de la tabla 4.
    Me pregunto si alguien entiende todas las columnas que aparecen ahí. En particular, estoy buscando los coeficientes no normalizados que salieron del experimento de igualación de color, o una forma de desnormalizar esos coeficientes. Los coeficientes a los que me refiero son los coeficientes tricromáticos u{a,b,c}_\lambda de la tabla 3. Ni siquiera sé si esos datos están en la tabla 4, así que quizá sean dos preguntas distintas

  • Creo que la explicación es simple. El color es luz, y es algo lineal que va del ultravioleta al azul, verde, amarillo, rojo e infrarrojo. Es simplemente una línea
    En la realidad física no existe la luz violeta. Cuando el ojo recibe luz roja y azul al mismo tiempo, la mente crea todos los tonos violetas y magentas entre el azul y el rojo. Por eso, para incluir el magenta, hay que trazar otra línea entre el azul y el rojo. Es decir, hay que doblar la línea de los colores reales, y eso es justamente lo que se ve en el diagrama de cromaticidad

    • Opté por una explicación que separa fuertemente “color” y “luz”. En un proyecto paralelo sobre “¿no se podría enseñar mejor el color si se enfatiza el espectro?”, intenté distinguir entre la luz física del mundo y el color percibido por el sistema nervioso
      Por eso escribí luz “roja”, y no “luz roja”. Emparejé el espectro físico con una escala de grises sobre los ejes de nm y energía, y el espectro perceptual con colores de ángulo de tono y luminancia. Ambos pueden envolverse en un espacio de color perceptual tridimensional, y también se puede interpolar el espectro físico de nm a tono. O bien se puede disponer a lo largo de un espacio bidimensional de dicromacia de mamíferos no primates para enfatizar la dependencia del sistema nervioso. Los malentendidos sobre el color están tan extendidos desde el jardín de niños hasta el posgrado que, para mayor claridad, ayuda ser extremadamente cuidadoso
    • El malentendido más común sobre el color es creer que es una propiedad externa al sujeto que ve. El color está en la mente
      En la óptica a la que se aludía como “realidad física” no hay color en absoluto. La mente crea todos los colores. Atribuirle a la luz una propiedad llamada color independiente del sujeto que ve es un error categorial. En la ciencia del color, lo que aquí se llama realidad física se denomina con más precisión distribución espectral de potencia de la radiación electromagnética en el rango visible. En la medida en que esa radiación estimula la respuesta cromática del sistema visual humano, la luz violeta claramente existe. Solo que no se simula con una única radiación de banda estrecha de longitud de onda
      El “límite púrpura” en la parte inferior del diagrama de herradura de la CIE muestra el límite perceptual al mezclar estímulos de longitud de onda larga y corta, es decir, primarios rojo/azul. Pero asumir que la luz tiene un color natural es una descripción de la realidad muy centrada en lo humano. Otros seres vivos tienen respuestas características muy distintas de las humanas. Basta imaginar un sentido sensible a la polarización. La rueda de color de los artistas es circular porque, en la mente de los artistas, el color como qualia se manifiesta así. La física de los qualia tiene más que ver con la complejidad de las respuestas internas del organismo que con los estímulos externos. Hablar del color de la luz es una expresión de sentido común, pero atribuye en exceso características humanas a la física del estímulo. Hay que explicarlo de la forma más simple posible, pero no más simple que eso
      Una explicación que ve el “color real” como una propiedad de la luz y no como percepción causa más malentendidos en lugar de aclarar
    • La longitud de onda o la frecuencia son lineales, pero la luz común está compuesta por muchas longitudes de onda, es decir, por el espectro completo