Today's Mood Widget (Vibe Coding)
This is a widget that I vibe-coded with the AI on Essential Playground, Nothing Tech’s new beta AI platform.
Today's Mood invites you to track how you feel every day without compromise, no questions asked.
The project was designed and built in three days, combining UX design, interaction design and AI-assisted coding.
Client
Nothing
Services
UX/UI & Vibe coding
Timeline
3 days
[Photo shooted & edited by me]
Many mood tracking apps rely on forms or questionnaires, which can make daily tracking feel repetitive.
This widget explores a simpler interaction:
Users select their mood by dragging a circle along a spectrum. Each day is represented by a small dot that changes colour based on the selected mood.
Over time, the widget creates a visual overview of how the user has felt throughout the year.
The most time-consuming part was creating a good prompt, so I did a lot of research and tried to make a template with Chat GPT's Help and filled it to describe my idea, and I pasted in Essential Apps AI.
[Photo shooted & edited by me]
[ P R O B L E M ] :
Being a beta version, sometimes when I ask for a small change, it completely alters the design.
So I turned to Claude AI, gave it the generated code, and asked for the specific change I needed. That was very helpful.
[ R E S U L T ] :
The result is a minimal widget that lets you actually see, at the end of the year, how you felt most. It has a very clean design, similar to the Nothing style.
People really liked it so much! Even Sélim, co-founder of bento.me and currently AI Product Lead & Design Lead at Nothing, liked and commented on the post, and Carl Pei, CEO of Nothing, reposted the tweet!
Today's Mood Widget (Vibe Coding)
This is a widget that I vibe-coded with the AI on Essential Playground, Nothing Tech’s new beta AI platform.
Today's Mood invites you to track how you feel every day without compromise, no questions asked.
The project was designed and built in three days, combining UX design, interaction design and AI-assisted coding.
Client
Nothing
Services
UX/UI & Vibe coding
Timeline
3 days
[Photo shooted & edited by me]
Many mood tracking apps rely on forms or questionnaires, which can make daily tracking feel repetitive.
This widget explores a simpler interaction:
Users select their mood by dragging a circle along a spectrum. Each day is represented by a small dot that changes colour based on the selected mood.
Over time, the widget creates a visual overview of how the user has felt throughout the year.
The most time-consuming part was creating a good prompt, so I did a lot of research and tried to make a template with Chat GPT's Help and filled it to describe my idea, and I pasted in Essential Apps AI.
[Photo shooted & edited by me]
[ P R O B L E M ] :
Being a beta version, sometimes when I ask for a small change, it completely alters the design.
So I turned to Claude AI, gave it the generated code, and asked for the specific change I needed. That was very helpful.
[ R E S U L T ] :
The result is a minimal widget that lets you actually see, at the end of the year, how you felt most. It has a very clean design, similar to the Nothing style.
People really liked it so much! Even Sélim, co-founder of bento.me and currently AI Product Lead & Design Lead at Nothing, liked and commented on the post, and Carl Pei, CEO of Nothing, reposted the tweet!
Today's Mood Widget (Vibe Coding)
This is a widget that I vibe-coded with the AI on Essential Playground, Nothing Tech’s new beta AI platform.
Today's Mood invites you to track how you feel every day without compromise, no questions asked.
The project was designed and built in three days, combining UX design, interaction design and AI-assisted coding.
Client
Nothing
Services
UX/UI & Vibe coding
Timeline
3 days
[Photo shooted & edited by me]
Many mood tracking apps rely on forms or questionnaires, which can make daily tracking feel repetitive.
This widget explores a simpler interaction:
Users select their mood by dragging a circle along a spectrum. Each day is represented by a small dot that changes colour based on the selected mood.
Over time, the widget creates a visual overview of how the user has felt throughout the year.
The most time-consuming part was creating a good prompt, so I did a lot of research and tried to make a template with Chat GPT's Help and filled it to describe my idea, and I pasted in Essential Apps AI.
[Photo shooted & edited by me]
[ P R O B L E M ] :
Being a beta version, sometimes when I ask for a small change, it completely alters the design.
So I turned to Claude AI, gave it the generated code, and asked for the specific change I needed. That was very helpful.
[ R E S U L T ] :
The result is a minimal widget that lets you actually see, at the end of the year, how you felt most. It has a very clean design, similar to the Nothing style.
People really liked it so much! Even Sélim, co-founder of bento.me and currently AI Product Lead & Design Lead at Nothing, liked and commented on the post, and Carl Pei, CEO of Nothing, reposted the tweet!