reproduce puedo puede porque musical musica funciona escuchar elemento disponibles disponible canciones borro biblioteca apple aparece activar algorithm user-interface itunes

algorithm - puedo - no se puede activar la biblioteca musical de icloud



¿Cómo funciona el algoritmo para colorear la lista de canciones en iTunes 11? (7)

El nuevo iTunes 11 tiene una vista muy agradable para la lista de canciones de un álbum, seleccionando los colores para las fuentes y el fondo en función de la portada del álbum. ¿Alguien descubrió cómo funciona el algoritmo?


Acabo de escribir una biblioteca JS implementando aproximadamente el mismo algoritmo que el descrito por @Seth . Está disponible gratuitamente en github.com/arcanis/colibrijs , y en NPM como colibrijs .



Con la respuesta de @ Seth-thompson y el comentario de @bluedog, construyo un pequeño proyecto Objective-C (Cocoa-Touch) para generar esquemas de color en función de una imagen.

Puedes consultar el proyecto en:

https://github.com/luisespinoza/LEColorPicker

Por ahora, LEColorPicker está haciendo:

  1. La imagen se escala a 36x36 px (esto reduce el tiempo de cálculo).
  2. Genera una matriz de píxeles a partir de la imagen.
  3. Convierte la matriz de píxeles en el espacio YUV.
  4. Reúne colores como el código de Seth Thompson lo hace.
  5. Los conjuntos de colores están ordenados por conteo.
  6. El algoritmo selecciona los tres colores más dominantes.
  7. El más dominante se asigna como fondo.
  8. La segunda y tercera mayoría de los dominantes se prueban utilizando la fórmula de contraste de color w3c, para verificar si los colores tienen suficiente contraste con el fondo.
  9. Si uno de los colores del texto no pasa la prueba, se asigna a blanco o negro, dependiendo del componente Y.

Eso es por ahora, revisaré el proyecto ColorTunes ( https://github.com/Dannvix/ColorTunes ) y el proyecto Wade Cosgrove en busca de nuevas características. También tengo algunas ideas nuevas para mejorar el resultado del esquema de color.



También puede seleccionar https://github.com/Dannvix/ColorTunes que es una implementación HTML de la vista del álbum de Itunes, que utiliza el algoritmo MMCQ (cuantización del color de la mediana).



Aproximé el algoritmo de color iTunes 11 en Mathematica dada la portada del álbum como entrada:

Como lo hice

A través de prueba y error, se me ocurrió un algoritmo que funciona en el 80% de los álbumes con los que lo he probado.

Diferencias de color

La mayor parte del algoritmo trata de encontrar el color dominante de una imagen. Sin embargo, un requisito previo para encontrar colores dominantes es calcular una diferencia cuantificable entre dos colores. Una forma de calcular la diferencia entre dos colores es calcular su distancia euclidiana en el espacio de color RGB. Sin embargo, la percepción del color humano no coincide muy bien con la distancia en el espacio de color RGB.

Por lo tanto, escribí una función para convertir colores RGB (en la forma {1,1,1} ) a YUV , un espacio de color que es mucho mejor para aproximar la percepción del color:

(EDIT: @cormullion y @Drake señalaron que los espacios de color CIELAB y CIELUV incorporados de Mathematica serían tan adecuados ... parece que reinventé un poco la rueda aquí)

convertToYUV[rawRGB_] := Module[{yuv}, yuv = {{0.299, 0.587, 0.114}, {-0.14713, -0.28886, 0.436}, {0.615, -0.51499, -0.10001}}; yuv . rawRGB ]

A continuación, escribí una función para calcular la distancia de color con la conversión anterior:

ColorDistance[rawRGB1_, rawRGB2_] := EuclideanDistance[convertToYUV @ rawRGB1, convertToYUV @ rawRGB2]

Colores dominantes

Rápidamente descubrí que la función Mathematica DominantColors no permite suficiente control preciso para aproximar el algoritmo que utiliza iTunes. Escribí mi propia función en su lugar ...

Un método simple para calcular el color dominante en un grupo de píxeles es recolectar todos los píxeles en grupos de colores similares y luego encontrar el grupo más grande.

DominantColorSimple[pixelArray_] := Module[{buckets}, buckets = Gather[pixelArray, ColorDistance[#1,#2] < .1 &]; buckets = Sort[buckets, Length[#1] > Length[#2] &]; RGBColor @@ Mean @ First @ buckets ]

Tenga en cuenta que .1 es la tolerancia de cómo deben considerarse los diferentes colores por separado. También tenga en cuenta que aunque la entrada es una matriz de píxeles en forma de triplete sin procesar ( {{1,1,1},{0,0,0}} ), devuelvo un elemento Mathematica RGBColor para aproximar mejor la función DominantColors integrada .

Mi función real DominantColorsNew agrega la opción de devolver hasta n colores dominantes después de filtrar un color dado. También expone las tolerancias para cada comparación de color:

DominantColorsNew[pixelArray_, threshold_: .1, n_: 1, numThreshold_: .2, filterColor_: 0, filterThreshold_: .5] := Module[ {buckets, color, previous, output}, buckets = Gather[pixelArray, ColorDistance[#1, #2] < threshold &]; If[filterColor =!= 0, buckets = Select[buckets, ColorDistance[ Mean[#1], filterColor] > filterThreshold &]]; buckets = Sort[buckets, Length[#1] > Length[#2] &]; If[Length @ buckets == 0, Return[{}]]; color = Mean @ First @ buckets; buckets = Drop[buckets, 1]; output = List[RGBColor @@ color]; previous = color; Do[ If[Length @ buckets == 0, Return[output]]; While[ ColorDistance[(color = Mean @ First @ buckets), previous] < numThreshold, If[Length @ buckets != 0, buckets = Drop[buckets, 1], Return[output]] ]; output = Append[output, RGBColor @@ color]; previous = color, {i, n - 1} ]; output ]

El resto del algoritmo

Primero redimensioné la portada del álbum ( 36px , 36px ) y reduje los detalles con un filtro bilateral

image = Import["http://i.imgur.com/z2t8y.jpg"] thumb = ImageResize[ image, 36, Resampling -> "Nearest"]; thumb = BilateralFilter[thumb, 1, .2, MaxIterations -> 2];

iTunes elige el color de fondo encontrando el color dominante en los bordes del álbum. Sin embargo, ignora los bordes estrechos de la portada del álbum al recortar la imagen.

thumb = ImageCrop[thumb, 34];

A continuación, encontré el color dominante (con la nueva función arriba) en el borde más externo de la imagen con una tolerancia predeterminada de .1 .

border = Flatten[ Join[ImageData[thumb][[1 ;; 34 ;; 33]] , Transpose @ ImageData[thumb][[All, 1 ;; 34 ;; 33]]], 1]; background = DominantColorsNew[border][[1]];

Por último, devolví 2 colores dominantes en la imagen como un todo, y le dije a la función que también filtrara el color de fondo.

highlights = DominantColorsNew[Flatten[ImageData[thumb], 1], .1, 2, .2, List @@ background, .5]; title = highlights[[1]]; songs = highlights[[2]];

Los valores de tolerancia anteriores son los siguientes: .1 es la diferencia mínima entre colores "separados"; .2 es la diferencia mínima entre numerosos colores dominantes (un valor más bajo puede devolver negro y gris oscuro, mientras que un valor más alto garantiza una mayor diversidad en los colores dominantes); .5 es la diferencia mínima entre los colores dominantes y el fondo (un valor más alto producirá combinaciones de colores de mayor contraste)

Voila!

Graphics[{background, Disk[]}] Graphics[{title, Disk[]}] Graphics[{songs, Disk[]}]

Notas

El algoritmo se puede aplicar de manera muy general. Ajusté la configuración anterior y los valores de tolerancia hasta el punto donde trabajan para producir colores generalmente correctos para aproximadamente el 80% de las carátulas del álbum que probé. Algunos casos de borde ocurren cuando DominantColorsNew no encuentra dos colores para regresar a los momentos destacados (es decir, cuando la portada del álbum es monocromática). Mi algoritmo no aborda estos casos, pero sería trivial duplicar la funcionalidad de iTunes: cuando el álbum muestra menos de dos aspectos destacados, el título se vuelve blanco o negro dependiendo del mejor contraste con el fondo. Luego, las canciones se convierten en el color de resaltado si hay uno, o el color del título se desvaneció un poco en el fondo.

Más ejemplos