R&D LAB Diseño computacional Entregado Instrumento de imagen
Tessera-Mosaic
Entra una imagen, sale una lámina para pintar
Cualquier imagen se descompone en zonas planas de color, cada zona recibe un número y sale una lámina vectorial imprimible con leyenda, sin que la imagen salga de la pestaña.
- 96colores como máximo, libre desde 12
- 12etapas en la cadena
- 0,8 stiempo de cálculo más largo de esta página
- 0peticiones de red

La lámina imprimible, aquí sobre la imagen de muestra que la aplicación dibuja al arrancar sin archivo alguno: 46 zonas, 25 colores. Contornos de línea fina, un numeral en cada zona, y debajo la leyenda con muestra, número, nombre de color más cercano, valor hex y porcentaje de superficie.
Por qué se publica
El paso de una imagen a algo que alguien sostiene de verdad no es un filtro: es una cadena de decisiones con restricciones: segmentar, fusionar, simplificar, etiquetar. Tessera-Mosaic es la prueba de que construimos esa cadena y la comprobamos contra sus propias restricciones, en lugar de mostrar una imagen al final y confiar.
Una lámina para pintar por números parece un filtro y no lo es. El número en una zona presupone que la zona es lo bastante grande para pintarse, que no es tan fina que no quepa un pincel, que tiene un lugar donde el numeral cabe entero y que el color contiguo se distingue de sus vecinos. Tessera-Mosaic es la cadena de pasos que satisface esas cuatro condiciones a la vez, y tres vistas en las que usted puede juzgar el resultado antes de comprar pintura.
Una fotografía no tiene zonas
Tiene degradados, ruido y bordes que no empiezan en ningún punto exacto. Una lámina para pintar necesita lo contrario: zonas cerradas, cada una lo bastante grande para un pincel, cada una de un color que se pueda comprar y volver a encontrar. Entre ambas cosas no hay un ajuste, hay una cadena.
Cuatro condiciones tienen que cumplirse a la vez o la lámina no sirve. Una zona necesita superficie suficiente. No puede ser tan estrecha que no quepa un pincel. Necesita un lugar donde el numeral quepa entero. Y su color debe seguir siendo distinguible de sus vecinos. Cada condición por separado es fácil, juntas son el problema.
La lámina de al lado está calculada a partir de una fotografía de paisaje de dominio público, 914 x 1280 píxeles, reducida a 714 x 1000 píxeles de trabajo. Salieron 239 zonas en 24 colores, 10,9 m de contorno, 0,8 s de cálculo. El pie de página nombra cada uno de esos números antes de que nadie imprima.
Toda la cadena corre en un worker
Doce etapas, leídas en seis pasos
- 01 A un espacio donde la distancia significa algo El sRGB pasa a CIELAB. Solo allí una distancia pequeña entre dos colores significa también que un ojo apenas los separa, y solo allí el aviso de paleta es un número real y no una sensación.
- 02 Fuera el ruido, quedan los bordes Un filtro bilateral separable de radio 0 a 4 suaviza superficies y deja los bordes en pie, para que el paso siguiente no ascienda el grano a color propio.
- 03 Calcular la paleta k-medias ponderado en Lab, siembra k-means++, 32 iteraciones de Lloyd y dos semillas ancladas en los percentiles 1 y 99 de luminosidad para que luz y sombra no se promedien. La asignación es exacta y sin difuminado: un difuminado aquí no sería un efecto, sería una zona imposible de pintar.
- 04 Los píxeles pasan a ser zonas Un filtro de mayoría de tres por tres elimina el moteado, y luego se etiquetan las componentes 4-conexas. Desde aquí la cadena ya no trabaja con colores sino con superficies.
- 05 Fusionar lo demasiado pequeño o fino Union-find hasta el punto fijo, con la carta de distancias recalculada entre rondas. Demasiado fino es la condición que casi todas las herramientas pasan por alto: una banda larga y estrecha supera cualquier prueba de área y aun así no admite pincel.
- 06 Borde, contorno, numeral Los bordes se construyen como aristas y cadenas, cada cadena se suaviza una vez (Douglas-Peucker, Chaikin, Douglas-Peucker), se ensamblan los contornos, se renumeran los colores por superficie pintada y solo entonces se colocan los numerales.
La cadena construye un mosaico
La única decisión
Un número en coma flotante decidía si una imagen era pintable
Tres de los cinco niveles de paleta no entregaron durante mucho tiempo lo que decía su nombre. Rich 40, Deep 56 y Full 72 devolvían un puñado de zonas y una fracción de los colores pedidos, y tanto peor cuantos más colores se pedían. La misma lámina que daba 24 colores y 574 zonas en Medium volvía en Deep con 8 colores y 9 zonas.
La causa cabía en una línea de la fusión. El array que guarda el grosor de cada zona es un Float32Array, el radio mínimo con el que se compara es un double. Cuando una zona absorbía a una vecina, el grosor de la unión era desconocido, así que el código escribía en él el radio mínimo, como afirmación: esta zona ya cuenta como pintable. Un double guardado en un Float32Array se redondea, y cerca de la mitad de los valores redondea hacia abajo.
Si redondeaba hacia abajo, la unión seguía siendo demasiado fina según su propia prueba. Así que absorbía otra vez, y otra, hasta que del cuadro quedaban unas pocas decenas de manchas. Hacia dónde redondea depende del valor exacto del radio mínimo, y ese valor se deriva del tamaño de paleta y del formato de papel, de modo que cambia con cada combinación. El valor de Medium redondeaba hacia arriba y funcionaba. Rich, Deep y Full compartían un valor que redondeaba hacia abajo.
La prueba era incómodamente clara: un cambio de cuatro millonésimas en el radio mínimo hacía saltar la misma lámina entre 574 y 79 zonas, y comparar el valor con su propio redondeo Float32 predecía la rama obtenida en doce de doce muestras.
La decisión fue no reparar la comparación sino eliminarla. La afirmación vive hoy como un indicador propio junto a la zona, el array de grosor conserva el máximo honesto, y una zona ya fusionada se salta la prueba de finura. Ningún número en coma flotante lo decide ya. Desde entonces cada nivel entrega su paleta exacta sin un solo reintento: Rich 40 con 633 zonas, Deep 56 con 618, Full 72 con 874. A cambio una lámina de esa imagen tarda de 1,0 a 2,2 s en lugar de 0,6 a 1,0 s, porque sobreviven muchas más zonas.
Un número puesto como afirmación se releía como una medición.
Lo que 24 colores hacen de una fotografía
Esta vista existe para una sola pregunta: si la paleta sirve, antes de comprarla. Son las mismas 239 zonas y 24 colores que la lámina de más arriba, solo que sin numerales y sin líneas finas.
Cada entrada de paleta conoce su distancia a la más próxima. Ese único número mueve la lectura bajo el deslizador, el reintento y la negativa cuando una imagen no soporta los colores pedidos. Aquí hay 5,9 dE entre el par más cercano, y la misma fotografía soporta también los 72 colores, entonces con 3,7 dE. Un gráfico vectorial plano, en cambio, se satura sobre los 50 a 60 colores y lo dice.
Lo que entra, lo que sale
La fotografía
- 914 x 1280 píxeles, reducidos a 714 x 1000 para el cálculo.
- Millones de valores de color, ninguno con nombre.
- Degradados sin borde: dónde acaba el follaje es cuestión de umbral.
- Ningún detalle mínimo. Una rama puede medir un píxel de ancho.
- Nada en ella dice cuánto se tardaría en pintarla.
La lámina
- 239 zonas cerradas, exactamente un numeral en cada una.
- 24 colores, cada uno con muestra, nombre más próximo, valor hex y porcentaje de superficie.
- Cada zona de al menos 2,4 mm de ancho en A4, o ha sido fusionada.
- 10,9 m de contorno, 0,8 s de cálculo, unos 32 minutos estimados a mano.
- Una página A4 en vectorial, sin una sola referencia externa.
El mismo encuadre, dos paletas
Menos colores no significa menos zonas
15 colores273 zonas, par más cercano a 7,9 dE, unos 36 minutos estimados a mano. Son más zonas que con 24 colores, no menos: una paleta gruesa deshilacha la frontera entre follaje y cielo en vez de simplificarla.
72 colores782 zonas, par más cercano a 3,7 dE, aproximadamente 1 hora 44 a mano. La fotografía soporta las 72, y la aplicación dice ese número en lugar de callarlo.
Las otras dos vistas
Dónde encaja
- Todo lo que deba traducir una imagen en algo fabricable: corte, aplique, taracea, azulejo, vinilo.
- Productos en los que un cliente aporta su propia fotografía y espera un resultado físico realmente factible.
- Cualquier problema cuya restricción sea un tamaño mínimo y una anchura mínima, y no solo un número de colores.
- Herramientas que por protección de datos no pueden subir nada y aun así deben funcionar en un navegador.
Créditos: cada captura muestra nuestra propia aplicación. Cinco de ellas muestran un resultado calculado a partir de una fotografía de dominio público: Limestone quarry landscape de Rosendahl, vía Wikimedia Commons. El resto usa la imagen de muestra dibujada por la propia aplicación.
Por qué se publica
Lo que esto significa para su proyecto
Más del laboratorio
Método Event Scout Un modelo de lenguaje lee las páginas de eventos; todo lo demás es código fijo. Queda una lista breve de dónde merece la pena un día presencial.
Investigación aplicada Vellum Bordes, perspectiva, luz y texto se calculan en el teléfono. Un documento solo sale del dispositivo cuando alguien lo envía.
Diseño computacional Atlas EV1 Doce capítulos desmontan un coche eléctrico, hasta una sola celda. Sin archivos de modelo ni texturas: 327 piezas de una tabla de medidas. ¿Necesita convertir una imagen en algo fabricable, con restricciones reales? Ese es nuestro tipo de problema.
Contactar