.png)
Bolt.new is a prompt based AI development tool created to quickly build and publish web apps. It uses a design system—so anything I prompt it to build looks pretty decent right off the bat.
I discovered Bolt.new and used it to build a live, functioning gym leaderboard—it only took about an hour to get the basic features up and running. However, Bolt.new doesn’t do everything, so I integrated Supabase to handle the backend.
I’d never worked with databases before, but between Supabase’s documentation and a bit of help from ChatGPT, I was able to set up a system to store and manage data.
Each product demonstration we make at Horizn has thorough accessibility (a11y) copy for each step. This is the copy someone using a screen reader would hear.
Below is the a11y copy I wrote for the "Make an appointment" screen, and why I wrote it the way I did—in bold.
The user using the screen reader would first hear the screen description copy describing what is on the screen:
Make an appointment page. (WHERE they are)
Displaying your banking type selection (WHAT happened in the last step)
and a question asking how you would like to meet. (WHAT is happening on this step)
In Person, Video Chat and Phone Call buttons available. (Actions they could take on this step—if this wasn’t a demo)
The user would then hear the highlighted control copy describing what UI element the focus indicator is on and why they should select it:
Highlighted Control: In Person button. (The button they need to select in this step)
Select to make an in person appointment. (WHY they are selecting this button)
I began by booking an appointment with a M&T representative through the mobile website, It is easier to teach something if you have done it yourself. I also gathered screen shots along the way of essential steps.
At Horizn, we use an internal tool called the SBT (Simulator Builder Tool) to build the demos. I threw all my screenshots into the SBT and began writing.
I brought together a group of athlete participants one Sunday in December 2024 to complete three workouts I had added to the leaderboard. After the session, they tested the app and provided feedback.
I also ran a quick walkthrough with two additional participants, and one of them found it unclear how to return to the homepage. I had assumed the logo was an obvious navigation cue, which proved not to be the case.
Not as many people opted to compete in the CrossFit Open this year (officially or unofficially), but I had enough athletes sign up and use the leaderboard for me to consider it a success.
I didn’t follow a traditional design process while building this solution—it was initially sparked by another coach’s comment that a leaderboard would be cool, and I decided to see if it could be done quickly.
This experience makes me question the future of design processes. Typically, product development demands lots of time and resources, so the current design methodology was needed to ensure we built the right thing. But now, using platforms like Bolt.new and Supabase, I can prototype and test ideas fast—faster than a typical design cycle might allow.
This approach still provided valuable insights once real users interacted with the leaderboard. It’s a sign that the industry’s design approach may be evolving, giving us the ability to iterate quickly in response to user feedback rather than spending months perfecting concepts on paper.
What should I build next?
