I spent 6 weeks creating a set of engaging and delightful micro-interaction experiences inspired by the Cartoon Network mobile app.
The Start Button
When the user hovers over the button, the hands of several CN characters are revealed. The hands work together to push the button upon clicking.
Work In Progress
Enjoy these captures of my work in progress. These are all hand-drawn, frame-by-frame animations created in Adobe Photoshop and composited in Adobe After Effects.
Simple Toggle Switch
The helper tentacle assists the user with all of the toggle switch interactions.
Ideation & Sketches
Multiple concepts were sketched and tested for the theme of this animated series. I settled on the most favorable and logical idea: to use familiar characters from several of Cartoon Network's popular animated series.
Mega Menu
Upon hover, "Blu" from Foster's Home for Imaginary Friends appears with a wide grimace, beckoning the user to press. Upon hover over the other menu items, more Cartoon Network characters are revealed.
Slider
As the user scrubs through the volume slider, Ice bear trots along with Panda and Grizz along for the ride. When the user is done with the interaction and releases the slider, the bears vanish.
Limited Slider
Panda, Ice Bear, and Grizz mimic the prompted reaction ratings for both visual appeal and overall greater user understanding.
Style Board
The color palette and textures are kept simple, as to not distract the user from their primary function. This design allows the attention to fall on the intricate hand-drawn animations.
