Griple
Bringing Full Contact Chat to the Fans
Skills Focus
> Product Design
> Systems Thinking
> Usability Testing
> Rapid Prototyping
01 —
Situation
Griple set out to solve a problem sports fans already knew they had: watching a game alone strips out the best part, needling your friends in real time. Griple's answer was to use 3D avatars to bring trash talk, predictions, reactions, and enough physical comedy in the avatars to make a dunk actually feel like one. I was the sole product designer on an eight-person team, working directly with a game designer and a Unity UI developer to turn that idea into something people could use on their phones.
— 02 —
Approach
There was no established pattern for this. Chat UX has decades of convention behind it. A 3D avatar layered on top of chat, built in a game engine and shipped as a mobile app, has almost none. My approach was to treat the avatar layer and the chat layer as one product from day one, test with real users as early as budget allowed, and judge every concept against four requirements: fun, clear, connected, and legible. A design only counted as viable if it held all four — losing any one of them, no matter how good the rest looked, meant killing it.
— 03
Results
The fix for our core issue of avatars and chat reading as two disconnected surfaces held up in a second round of testing: 9 of 10 users in a new cohort correctly identified who sent each message, up from a session where that exact confusion was the main thing testers reacted to. That result was strong enough to justify the next bet, TEA, an on-device model that reads message sentiment and drives matching avatar animation automatically. TEA has recently shipped and I’m tracking three KPIs to measure impact of the roll out.
Glamour shots of final design
Where the Avatar Meets Chat
Griple is built for young sports fans, bringing sports trash talk into a digital space. Our differentiator is that our interface is accessible enough to feel like a chat app but borrowing some presence and expressiveness from the metaverse products that are out of reach from our target consumer. When I joined, that meant a flat, sequential list of messages with a name and thumbnail per message, similar to Slack or Discord. Avatars were rendered separately at the bottom of the screen, playing a small set of animations. Chat carried the whole experience; the avatars could animate but weren’t providing the impact.
The first round of user testing I ran, five sessions, pulled from a public waitlist and a friends-of-friends, surfaced a key problem directly. Testers enjoyed the avatar animations but didn't connect them to who triggered them; a common reaction was some version of "haha, that's so funny, who did that?" The player's behavior showed they weren't associating avatars in the 3D room with their owner, or with messages in the chat. The two surfaces read as separate and disconnected, challenging our core value prop.
[IMAGE: original flat message list, avatars separate from chat]
Merging the Surfaces
Griple is built for young sports fans, bringing sports trash talk into a digital space. Our differentiator is that our interface is accessible enough to feel like a chat app but borrowing some presence and expressiveness from the metaverse products that are out of reach from our target consumer. When I joined, that meant a flat, sequential list of messages with a name and thumbnail per message, similar to Slack or Discord. Avatars were rendered separately at the bottom of the screen, playing a small set of animations. Chat carried the whole experience; the avatars could animate but weren’t providing the impact.
The first round of user testing I ran, five sessions, pulled from a public waitlist and a friends-of-friends, surfaced a key problem directly. Testers enjoyed the avatar animations but didn't connect them to who triggered them; a common reaction was some version of "haha, that's so funny, who did that?" The player's behavior showed they weren't associating avatars in the 3D room with their owner, or with messages in the chat. The two surfaces read as separate and disconnected, challenging our core value prop.
[IMAGE: grid-based message layout concept]
A question from our UI developer sparked the next attempt: what does "Full Contact Chat," the app's tagline, actually mean? I read it as physics. Each message became a rigid body that took up real space — bubbles could bounce off each other, an angry bubble could turn spiky and stick to another, a laughing one could bounce. I prototyped it in Figma Make with a handful of bubble types, each with its own inertia and elasticity. It was genuinely fun. It was also wrong: in internal play, a message sent a second after yours could bury it entirely. Within a few days of prototyping — before any engineering time went into it — it was clear the concept broke legibility, the one requirement fun couldn't override. I shelved it.
[IMAGE: physics-based bubble prototype, Figma Make]
What shipped instead was the synthesis of both failures: sequential, overlapping vertical bubbles for readability, each carrying a caret that pointed back to whoever sent it and elongated over time until the message timed out or scrolled off screen. I added typing and talking states on the avatars themselves so they visibly participated instead of sitting in frame. It kept the established pattern legible while making the avatars feel like part of the room.
[IMAGE: shipped bubble system — caret + typing/talking states]
I ran a second round of testing with the new feature. Five sessions with two new users each, showed 9 of 10 correctly identifying who sent each message. The new cohort also had more fun with it than the first: we saw players run "revenge" exchanges (what we call duos), where one player's animation inspired an immediate comeback from whoever it targeted. Recognition wasn't just working, it was driving the exact behavior the app was built for.
TEA: Text, Expression, Animation
That result set up the next real bet. While this behavior was strong indicator the app was moving in the right direction, it wasn’t differentiating us enough.
To push us far enough to differentiate, the game designer pitched a new system he called TEA: Text, Expression, Animation. This system would pair every message with an animation and expression. The original proposal used a manual emotion picker, a wheel or selector the player would choose from before sending. I pushed back: messaging app users expect to send fast, with instant feedback, hundreds of times a session. A selection step at that frequency would go unused.
Instead I designed a system that selects the animation automatically from message sentiment, with a manual override available for anyone who wants to be deliberate — or intentionally sarcastic — about it. To drive the automatic side, the team built a small on-device model that reads sentiment and triggers a matching themed animation and bubble style, with no added friction; the room stays alive just from sending a message normally. TEA is built to recover what made the physics bubbles fun, inside the legible pattern testing had already proven worked.
[VIDEO: TEA — emotion-driven avatar animation demo]
[VIDEO: TEA — emotion-driven avatar animation demo]
Measuring Success
TEA has shipped, and the app remains available to test directly. Our current user base is small but I will be tracking these targets over the coming months to validate the success of the feature:
Average messages sent per player up 2/week
Manual override used on fewer than 20% of messages
Fewer than 30% of players disable the feature in settings
Improved D30 retention, with at least 15% of users inviting one more friend than before the change
[VIDEO: TEA — emotion-driven avatar animation demo]
Learning and Growth
This was the first project where AI-assisted prototyping was viable inside my actual process, not just a novelty. Figma Make let me build a functional prototype of the physics bubbles in a single day, before costing a penny of engineering time. That changed how far I was willing to explore during a phase where almost nothing about the interaction had precedent. Now it's a tool I build into how I approach any concept this untested.
