Grumble - Know your hunger before your body has to scream for it.
Designing a speculative hunger-sensing tool in 4 days that makes an invisible body signal visible, social, and actionable for Fig Build 2026.
Role
Visual & Motion Design
Timeline
4 days
March 2026
Team
Catherine Jia
Sabrina Chen
Shuang Liang
Leveraged Skills
Visual interface design
Micro-animation motion
Motion design
Grumble - Know your hunger before your body has to scream for it.
Designing a speculative hunger-sensing tool in 4 days that makes an invisible body signal visible, social, and actionable for Fig Build 2026.
Role
Visual & Motion Design
Timeline
4 days
March 2026
Team
Catherine Jia
Sabrina Chen
Shuang Liang
Leveraged Skills
Visual interface design
Micro-animation motion
Motion design
background
Reimagining hunger as a sense you can finally see.
Reimagining hunger as a sense you can finally see.
A lifestyle community app by ByteDance — a place where people share authentic takes on beauty, fashion, travel, and food. Less performance, more personality.
A lifestyle community app by ByteDance — a place where people share authentic takes on beauty, fashion, travel, and food. Less performance, more personality.
About this feature
What is Notes?
What is Notes?
Grumble started as a question about sensing hunger. It became a signal visible to people who are close to you and transforms in to act of caring.
Grumble started as a question about sensing hunger. It became a signal visible to people who are close to you and transforms in to act of caring.
The Solution
existing section header — "Higher screen efficiency, increased user interactions
existing section header — "Higher screen efficiency, increased user interactions
S
S
Core Design Updates
01 Prioritize content immersion
01 Prioritize content immersion
Enlarging the image preview area was the most direct way to give Notes more presence on screen. A larger preview doesn't just look better — it changes the user's relationship with the content, inviting them to look before they decide to scroll past. The improved design brought stronger visual engagement and lifted likes and reposts. Though comment interactions dipped slightly, the overall direction on content engagement was positive.
Enlarging the image preview area was the most direct way to give Notes more presence on screen. A larger preview doesn't just look better — it changes the user's relationship with the content, inviting them to look before they decide to scroll past. The improved design brought stronger visual engagement and lifted likes and reposts. Though comment interactions dipped slightly, the overall direction on content engagement was positive.
02 Strengthen identity-driven interaction
02 Strengthen identity-driven interaction
The fix for the author-interruption problem wasn't to remove creator identity — it was to reposition it. By reorganizing where profile information appeared in the reading flow, we made creator recognition feel like part of the experience rather than a tax on it. When users see who someone is at the right moment — after they've already started engaging with the content — they're far more likely to follow. The data reflected this: significant lift in follow rate and profile click-through rate.
The fix for the author-interruption problem wasn't to remove creator identity — it was to reposition it. By reorganizing where profile information appeared in the reading flow, we made creator recognition feel like part of the experience rather than a tax on it. When users see who someone is at the right moment — after they've already started engaging with the content — they're far more likely to follow. The data reflected this: significant lift in follow rate and profile click-through rate.
03 Increase content density without sacrificing readability
03 Increase content density without sacrificing readability
A flatter content structure — tightening the spacing between username, text, and media — let more notes appear per screen without making the feed feel cramped. More content visible at once means more chances to capture interest before a user decides to leave.
A flatter content structure — tightening the spacing between username, text, and media — let more notes appear per screen without making the feed feel cramped. More content visible at once means more chances to capture interest before a user decides to leave.
04 Preserve interaction behaviors
04 Preserve interaction behaviors
One risk with layout optimization is disrupting what's already working. We made sure that the interaction bar — likes, comments, shares — stayed accessible and clearly weighted. Where we could, we used hierarchy to make it feel more clickable, not just preserved. Both variants saw small decreases in likes and comments. Reposts ticked up slightly in V2 (+1.29% vs. control). These trade-offs shaped how we thought about the next round.
One risk with layout optimization is disrupting what's already working. We made sure that the interaction bar — likes, comments, shares — stayed accessible and clearly weighted. Where we could, we used hierarchy to make it feel more clickable, not just preserved. Both variants saw small decreases in likes and comments. Reposts ticked up slightly in V2 (+1.29% vs. control). These trade-offs shaped how we thought about the next round.
BEHIND THE SCENES
Research & process
Research & process
Glucose drops 60–90 min before you feel hungry. Grumble reads the signal before your body has to shout.
Glucose drops 60–90 min before you feel hungry. Grumble reads the signal before your body has to shout.
What we want
We believe hunger is more than a sensory. It's a signal, a conversation, and an invitation.
We believe hunger is more than a sensory. It's a signal, a conversation, and an invitation.
My teammate and I analyzed brand visual guidelines and mood boards to bridge the gap between LA’s "cinematic energy" and the Metro’s "rigid" reality.
My teammate and I analyzed brand visual guidelines and mood boards to bridge the gap between LA’s "cinematic energy" and the Metro’s "rigid" reality.
Daily view: Identify the exact moment of hunger to plan meals.
Daily view: Identify the exact moment of hunger to plan meals.
Utilizing a 24-hour circular dial to mirror the natural circadian rhythm. The radial heatmap provides an intuitive "clock-look" that maps body signals to specific times of day
Utilizing a 24-hour circular dial to mirror the natural circadian rhythm. The radial heatmap provides an intuitive "clock-look" that maps body signals to specific times of day
Weekly view: Compare fluctuations and identify anomalies across the week
Weekly view: Compare fluctuations and identify anomalies across the week
Unfolding the circular clock into vertical time-strips. This linear alignment allows for side-by-side comparison, making it easy to spot if hunger peaks shifted
Unfolding the circular clock into vertical time-strips. This linear alignment allows for side-by-side comparison, making it easy to spot if hunger peaks shifted
My Takeaways
What I took away
What I took away
Think beyond conventional patterns and explore creative interactions
FigBuild taught me to push past expected solutions and consider more imaginative interaction patterns that solve problems in a memorable and intuitive way.
FigBuild taught me to push past expected solutions and consider more imaginative interaction patterns that solve problems in a memorable and intuitive way.
Balance vision with execution by leaving enough time to build
I learned that strong ideas need enough time for both vibe coding and mocking, so the concept can actually come to life instead of staying at the idea stage.
I learned that strong ideas need enough time for both vibe coding and mocking, so the concept can actually come to life instead of staying at the idea stage.
Storytelling and time management are just as important as the final design
A compelling project is not only about what you build, but also how clearly you tell the story behind it and how well you manage your time to bring the idea together.
A compelling project is not only about what you build, but also how clearly you tell the story behind it and how well you manage your time to bring the idea together.
Back