Inspiration

I was inspired by the feeling of overthinking—how one small thought can spiral into many, and how trying to “fix” it often makes it worse. I wanted to turn that invisible, intense mental experience into something interactive and visual.

What it does

“Fix It” is an interactive web experience where users try to fix their thoughts. Each time they attempt to fix one thought, more thoughts appear, creating a growing sense of chaos and crowding. The progress bar gives the illusion of improvement and control, but ultimately reinforces the idea that perfection is unreachable.

How I built it

I built this using HTML, CSS, and JavaScript. The thought bubbles are dynamically generated using JavaScript, with random positioning, text, sizes, and shapes. The user interactions trigger new bubbles and update the progress system. CSS was used heavily for animations, transitions, and visual effects like glassmorphism (lowkey had to search that one up) and motion.

Challenges I ran into

One challenge was balancing chaos and usability—making the experience feel overwhelming without becoming completely unplayable. Positioning the elements dynamically without breaking the layout was also tricky. Another challenge was making the progression feel intentional rather than just random. I mostly had issues with layout, positioning, and how to make the actions seem natural and real but I persevered through and made something I truly like.

Accomplishments that I'm proud of

I’m proud of how the experience evolves emotionally—from calm and controlled to chaotic and overwhelming. I like that the interactive design successfully reflects the concepts I wanted to get across, and the visual details like animations and the misleading progress bar make the experience feel cohesive and meaningful.

What I learned

I learned how powerful small UI/UX decisions can be in shaping user experience. I learned to create better keyframes and media queries to make my designs feel almost natural. I also improved my ability to structure dynamic elements in JavaScript and create more intentional designs instead of just functional ones.

What's next for Fix It.

I’d like to expand the experience by adding sound design, more nuanced visual changes over time, and possibly different “modes” that represent other mental patterns like procrastination or self-doubt. I'd also like to add a definite end to the experience—rather than it just clearing the bubbles to try again all over again, I want to add steps to make the user do actions so as to clear the bubbles gradually and end the experience with a page of quotes.

Built With

Share this project:

Updates