Adjective – Dusty – Final

A dusty surface. The user must feel it not only from its visual aspect, but also from the interaction. Dragging the fingers over it should clear the surface, just like real-life dust.
Since it’s a concrete adjective, i.e., based on a physical simulation, I think that two main aspects of the project must work in order to get the desired effect.

1. Visual
It’s hard to display dust. In most occasions, the color it seems to have actually depends on the background color. I tested some different combinations for background and foreground:

Screen Shot 2013-10-01 at 12.04.06 PM Screen Shot 2013-10-01 at 12.03.02 PM Screen Shot 2013-10-01 at 12.01.08 PM Screen Shot 2013-10-01 at 12.36.47 PM

In the end, the white background with light-brown particles worked best.
In addiction, I changed the particles distribution to make it feel more natural. The dust density increases from the boundaries to the center:

Screen Shot 2013-10-01 at 1.18.47 PM

2. Interaction
In relation to the first prototype, I added the multitouch add-on. I did it because I had the impression that the interaction didn’t “feel” like dust without it.

I didn’t like the result, though, and didn’t keep it.
Nevertheless, there was a positive side: I found out  that I could get the touch size, instead of having a fixed mouse radius:

That feature took the app closer to an analog experience. It made it seem more like a finger drawing movement than a digital mouse-mouve interaction.

Source code here.

Original post:


Leave a Reply

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

You are commenting using your 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