Questions? Shoot me an email!

Web Development / Motion Graphics

Synesthesia

ROLE


Research, Front-end Development, Motion Graphics

OVERVIEW


Synesthesia is a two-part project combining a website and a narrated animation for audience to visualize the fascinating sensory clashes synesthetes experience.

Background

For this project, I interviewed Carolyn ‘CC’ Hart, synesthete, writer, artist, massage therapist and Secretary for the International Association of Synesthetes, for a better understanding of her day-to-day experiences as a person with synesthesia. I was captivated by her descriptions and wanted to represent the sensory clashes she experienced through a fun and engaging way for my audience.

INSPIRATIONS

As a huge psychology nerd I've always been fascinated by synethesia. I wanted to take this chance to make something not only educational for my users, but also a delightful experience which they can enjoy learning from and being a part of.

WEBSITE

A game-based site that allows users to visualize what synesthetes experience with their senses through playing simple web games by tapping on their keyboards.

ANIMATION

A 1-minute video attempting to capture the mind of Carolyn “CC” Hart's. Narrated by CC, all imagery are based on her visualization of different sounds through verbal expression.

The Website

When users first enter the site, there is a captivating and mysterious entrance that invites the users to enter and learn more. Once entered, users are presented with two simple interactive games to play with their keyboards. Through playing these games, users are better able to understand what synesthetes sees in their minds when letters and sounds are presented to them.

1. Grapheme-Color

"A person who experiences this may associate or see individual letters or numbers with a specific color."

When users type on their keyboard, they can see each letter they type out in a different color, similar to what people with grapheme-color synesthesia see.

2. Chromesthesia

"Synesthetes with this form of synesthesia see different sounds as having colors and even shapes."

When users type on their keyboard, they can hear a random sound effect accompanied by a shape of color on screen, similar to what people with chromesthesia experience.

*Audio must be on!

The Animation

This is a minute-long short film narrated by Carolyn 'CC' Hart. I had first interviewed her about the general day-to-day sensations she experienced. She told me that being a synesthete isn't always as cool as it sounds, so I wanted to capture that sense of mystery and darkness in this video. While it definitely holds the "wow" effet, synesthesia is a very troubling condition for many synesthetes in the world. I wanted to capture the very raw and authentic appeal of it.

The two types of synesthesia - Grapheme-coloe and Chromesthesia - are what CC has. I asked her what she saw in her mind when different types of music came up, she then described to me in words what she saw.

Tools used: Adobe After Effects CC - Trapcode Tao, Trapcode Mir, Trapcode Particular

Conclusion

For this project I taught myself how to use Trapcode Plugins in Adobe After Effects. I was always fascinated by 3D animations but didn't know how to do it myself. So when the assignment presented itself, I set a goal to learn the software and eventually did in a few weeks, thus was able to create this video.

As for the website, I learned to use Paper.js to make the interactive games. I didn't want to just create a site that presents information. I wanted to take it to the next level and create an experience that's not only fun, enjoyable but educational.

ONWARD TO NEXT PROJECT >

OH, CARDS