Squishmallow Counter
(Because too many Squishmallows is never enough.)
Squishmallow Counter
Prototyping, Animation & Brand Integration
Solo project for Experience & Interaction
Adobe XD
Mar 2022 - Apr 2022
OVERVIEW
Squishmallows have taken the world by storm -- with their patented filling and super soft exterior. These stuffed animals are pretty expensive -- ranging depending on how rare the Squishmallow is.
This reimagined design intends to comment on the rampant consumerism that has emerged in regards to Squishmallows and the collector culture associated with it. The design challenges the audience in dissecting the psychological need and/or craving for more than one Squishmallow -- whether it be for the sheer number or not.
This project playfully critiques collector culture while creating an oddly satisfying user interaction. I leaned into exaggerated visual feedback, incorporating simple animation to bring the counter Squishmallow to life. Although the idea began with a physical prototype, I pivoted to a digital concept to better communicate the narrative and keep the emotional trauma of cutting into my Squishmallow to a minimum.
This was also an opportunity to explore basic animation and motion principles as part of the prototyping process, adding personality to the interaction while pushing my own skillset beyond static UI.
PROCESS + SKETCHES
The project began as a physical prototype idea: I planned to cut into a large Squishmallow and fill it with mini ones, tracking the number either through a written log or a tally counter. But two things stopped me — the cost of all those Squishmallows, and the emotional toll of slicing into one.
Pivoting to a virtual prototype allowed me to deliver a clearer message. I initially considered mimicking a real e-commerce flow with “add to cart” functionality but decided a stripped-back interface better emphasized the absurdity of accumulation. While my early designs toyed with more graphic visuals (gore included), I opted for a gentler, more satirical tone in the final product.
Constraints in my prototyping software influenced some final design decisions, but the core interaction — the compulsive click to collect — remained central throughout development.
FINAL WIREFRAMES + PROTOTYPE
How it works:
-
The user selects a Squishmallow to act as their personalized “counter.”
-
As they shop and hit “Buy Now,” they’re redirected to a screen where their counter Squishmallow "eats" the new one.
-
A tick sound plays, and the number displayed on the counter Squishmallow increases — visually reinforcing how many they've collected.
This feature gamifies accumulation while gently satirizing the thrill of hoarding and Instant gratification. It turns collecting into a micro-ritual, complete with animation, sound, and an unsettlingly hungry mascot.
CHALLENGES + SOLUTIONS
Pivoting from a tangible to a virtual prototype
Challenge:
My initial concept involved physically cutting open a Squishmallow and inserting smaller ones (a fun but emotionally and financially damaging idea.)
Solution:
I transitioned to a digital prototype that could more effectively convey my satirical intent while giving me more control over the user experience and interactions.
Challenge:
My initial concept involved physically cutting open a Squishmallow and inserting smaller ones (a fun but emotionally and financially damaging idea.)
Solution:
I transitioned to a digital prototype that could more effectively convey my satirical intent while giving me more control over the user experience and interactions.
Animating the mouth and integrating it into the wireframes
Challenge:
I had no prior animation experience and needed to figure out how to make the "eating" interaction feel playful and satisfying.
Solution:
I taught myself basic animation techniques, used my existing After Effects skills and layered the motion into my wireframes, using visual cues and sound to make the experience feel tactile and responsive.
Challenge:
I had no prior animation experience and needed to figure out how to make the "eating" interaction feel playful and satisfying.
Solution:
I taught myself basic animation techniques, used my existing After Effects skills and layered the motion into my wireframes, using visual cues and sound to make the experience feel tactile and responsive.
Recreating the Squishmallow website UI
Challenge:
Matching the official brand’s soft, playful aesthetic while designing a fictional feature that still felt native to the site.
Solution:
I closely studied the site’s layout, typography, and color scheme, then recreated a matching UI in Figma to keep the counter experience seamless and on-brand.
Challenge:
Matching the official brand’s soft, playful aesthetic while designing a fictional feature that still felt native to the site.
Solution:
I closely studied the site’s layout, typography, and color scheme, then recreated a matching UI in Figma to keep the counter experience seamless and on-brand.