Prototype 2

Music notation Poem on your face?

How's your life

I have always wanted to create a website to archive my previous works and documentaries. In my previous job, I worked on editing HTML/CSS/JavaScript-based visual content for promotion rather than coding, so I rarely had the chance to work with code prototypes. I was always driven by projects and needed to find motivation to do these things for myself - that's when HTML Club inspired me! We practiced various design formats with Manetta. She suggested we find references and study their code to replicate them. I began learning coding formats through practice. I came across a simple personal portfolio website that used dot patterns and coordinates, which I found really interesting, and I tried to combine the concept of '面相图' (face reading) with my work.

I want a good fortune

Chinese parents always want their children to have a good life, so they consult fortune-telling - every mark on our faces has a specific meaning. If a person has no marks on their face, it's called "面无善痣为贵" (a face without moles is lucky and rare). Most people have marks, so we have to interpret it as "面无恶痣" (a face without bad-meaning moles), and when we were young, our parents would often take us to have them removed, believing it would bring good fortune.

My father studied Feng Shui and calculated my destiny, saying that I would be working until I die and must keep working to achieve a better life. I always want to change this explanation because I think it was negative and traditional; it did not fit the times. This made me contemplate the theme of 'labor'. I combined my personality with my previous works, hoping to give them meaning.

View my whole life through my marks on the face
View my first try to make a face

How to tell your life

I could create a face-reading interactive installation, combining every mark and mole on the face to compose a song. This reminds me of gleemen, who would sing about people's lives during their journeys. I want to create an interactive installation based on this idea: when a person approaches, a camera scans their face and composes a song based on the interpretation of their facial marks. I think "sing your life in your own tone" is more positive than "calculate your fortune".

Every mark in your face is like a music notation poem

In Chinese legends, fortune-telling is said to shorten one's life because destiny belongs to '天机(mystery known only to heaven)'. It's believed that blind people are suited for fortune-telling because they traded their sight for the ability to read life, death, fortune, and misfortune - both past and future. However, blind people could not participate in society due to visual impairment, so they developed unique ways of communicating through fortune-telling, which is one way to maintain livelihood and participate in public activities.

Moreover, since visually impaired people don't rely on visual information and aren't distracted by sight, they depend on other sensory perceptions and are more sensitive to environmental changes than sighted people. Therefore, I plan to use Braille music notation for the visual presentation of this destiny score, making it an inclusive program that is friendly to visually impaired people.

I intend to use dots to represent facial marks, moles, and even acne. This concept is similar to Braille music notation, where braille cells allow visually impaired musicians to read music. The idea also parallels '工尺谱' (Gongche notation), a traditional Chinese musical notation system that uses Chinese characters to represent musical notes. In ancient China, symbols like '◐ ◯ ◑ ●' were used to play sound and tone with three strings. In Gongche notation, percussion marks are written alongside the notes, and the whole system is written vertically from top to bottom and right to left, with rhythm marks placed to the right of the note characters.

But it's a little tricky to achieve this goal, cause it contains potential bias... If someone has a dark skin color, It would be hard to recognize whether people have marks/moles on the face. (I am thinking should I change it to read palms)

http://hub.xpub.nl/cerealbox/~wyn/pratice/facenotation/facenotation.html

Destiny Score

Collect all the explaination and use python to create the poem, and collabrate with the abstract pattern to show the personality traits and destiny. The Wisdom of Your Face

The position of moles corresponds to pitch, the size of moles corresponds to volume, the left-right arrangement corresponds to time sequence, and shape characteristics correspond to different timbres. The degree of mole protrusion corresponds to Braille music notation, and mole shapes correspond to the circular symbols in Gongche notation, using Gongche's vertical reading direction, combining the tactile characteristics of Braille and the timbral expression of the three-string instrument to create a printed musical score. This score represents a calculated destiny. I might add a certain word for each changes and make it become a poem!

As the user interacts with and stretches the webpage, the poem generated from their facial features will transform in real-time. Words will rearrange, metaphors will shift, and new insights will emerge. This represents how our understanding of ourselves is not fixed but can be viewed from multiple perspectives.

The poems will draw from a database of interpretations of facial marks from various cultures, creating a cross-cultural dialogue about destiny, identity, and self-determination. As the page stretches in different directions, different cultural interpretations might become more prominent, showing how our understanding of ourselves can vary across cultural contexts.

Using JavaScript and CSS transformations, the face visualization will respond to the browser window dimensions. HTML5 Audio API will dynamically generate sounds based on the new configurations. Python will be used on the backend to generate the evolving poems based on the rearranged facial features.

This responsive approach transforms what could be a static fortune-telling exercise into a dynamic, interactive experience that empowers users to explore different interpretations of their facial features and, metaphorically, their own lives.

You can explore an early prototype here: http://hub.xpub.nl/cerealbox/~wyn/pratice/facenotation/facenotation.html

Basically, I want to make an interactive web installation where stretching the webpage dynamically transforms facial feature positions, generated poetry content, and audio synthesis, symbolizing that destiny is not fixed but can be reinterpreted and reshaped through our own perspective.

moodboard

code and processing

I draw a face and then using two main functions to generate sounds: ::-webkit-slider-thumb and Web Audio API