The collective heart mouse interaction

Try the sketch here and access the code here.

For this sketch, I worked together with Name on the top of Lisa’s Web RTC example. We were tasked to create a two-player sketch using the mouse over webRTC peer connection that encourages the users to be co-present in some way.

How does the collective heart sketch work?

Both users accessing the browser simultaneously answer the question “What’s the color of your heart today?” on the bottom left of the page selecting a color for their mouse-heart. Then, when both hearts encounter, they start to beat and the color of the background of the page turns to be the mixture of both heart colors.

This example can be improved in a way that the user would use their real heart’s position instead of the mouse position to control the cute heart in the browser. And other layers could be added when both hearts meet, such as opening the microphone for people to listen to each other.

The design of the heart was inspired by the aesthetics of the project Luv ’til it Hurts.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: