ICM & Visual Language – Week 4: “Palette of Me” Image Editor

This week we were asked to pick a palette of our own for the Visual Language class, and try to use functions and objects to draw a sketch with P5.js. I combined my works of both and made an image editor that can assign a 5-color palette to any given image. To begin with, I’ll start with the palette I’ve chosen.

Palette of Me

On a lovely Sunday afternoon of tons of sunshine, I wandered around the Rubin Museum of Arts with a friend and bumped into some magnificent pieces of Himalayan arts. As someone previously having some but not much exposure to Tibetan and Hindu culture, it was quite a fascinating and eye-opening visit. Here are just a few examples of the beautiful pieces:

My favorite among them is this smiling deity portrait shown below, which in my opinion, skillfully stroke a balances between peacefulness and holiness. The color palette used here is classic in Himalayan arts: black, red, and orange with two complementary shades of brownish green.

Predictably, you might think that I would choose my palette based on this timeless combination. Well, I did plan to do that… BUT! As it is such a recurring theme in Himalayan arts, I decided to pick something completely different – colors that are nowhere possible to show up in any Himalayan pieces in the reality. After a few experiments, I finally came up with the following purple-based palette with a flashy green highlight.

Now that I have a palette, I would need an image editor to help me automatically transform photographs I love into this anti-classic theme. So I made my own editor to do the works.

P5 Image Editor

The idea of this editor is basically to compare the source image’s color, pixel by pixel, to each color in the palette. The color distance algorithms can be used to determine which palette color is “closest” to a given image color. After that, the editor will replace the color of a source image’s pixel with its closest color in the palette. Tow color distance calculation algorithms are used in my editor – Euclidean, and CIE76. Here is the URL to my editor: YG’s 5-Color Palette Image Editor.

Final Works

Here are the final six compositions of my palette. They are famous graffiti walls I visited in six different cities across the world: Guangzhou, Hongkong, Shanghai, Beijing, Penang, and New York.

—- “Paletted Walls” —-

Added a bonus yellow:

Leave a Reply Cancel reply