This is a submission for the World's Largest Hackathon Writing Challenge: Building with Bolt.
Building with Bolt: From Idea to Illustrated Book in Under 3 Weeks
Over a year ago, I made a personalized book for my niece and nephew using Midjourney. It took days, manually prompting consistent characters, designing layouts in Canva, and prepping it for print. They love it and I love reading it to them I visit them. However,the process to create this was painful. It was extremely slow and took way longer than most people would want to spend to create a book like this. This hackathon gave me the spark to turn that pain into something delightful and scalable: WigglyTales, an AI powered book platform where anyone can generate a fully customized children’s book in minutes.
What I Built
WigglyTales lets users upload photos (I used up to 3 as the more images the more it costs to generate a great image and generally 3 is enough for consistent characters). Then at the same time a user picks a story genre and is able to generate a custom story. It uses OpenAI for text and image generation, and a React-Konva canvas to customize layout, fonts, and styles. The final output is a print ready, exportable PDF without requiring any design skills.
How Bolt Changed Everything
I built almost the entire app using vibe coding in Bolt including Supabase integration, image generation, layout customization, and export logic. I didn't touch the database or write manual routes. Of course I ran a ton of migrations, and was constantly updating the routes and modifying the database, but being a front end engineer with little backend experience this allowed me to whip up a design really quickly. I was able to say what kind of design I wanted to quickly prototype the app. Knowing UI/UX definitely helps but when you know what you want using the messaging functionality with Bolt is very powerful.
I found that the best way to use bolt was to write what I wanted to execute then use the messaging functionality to get a better prompt or make sure the prompt was an efficient one. This ultimately cut down on the number of attempts and credits used to get something working.
Additionally, having to work during this whole process what I love about bolt is you can leave the platform to execute and then work on other tasks and come back and then see what was built and then repeat until you get what you want.
As the project evolved, I used Bolt to spin up a second app just for the canvas editor - a full React-Konva implementation with font and style tools, layered backgrounds, and precise text placement. That separation of concerns massively sped up development and reduced credit usage.
Favorite Prompts Dumbed Down Because Generally More Specific
- Imagine you are the best designer in the world or understand UI/UX like no one else, go ahead and modify this
- Based on the supabase current structure what would be the best migration to add this file in these specific areas where the field is utilized
- Bring in this specific package, recreate in a new component and move the old x package to an unused file for now (this is really good for trying out different packages, but also not making you revert way later on)
- Using gpt/ claude/ or another service getting what you want pasting in and then using the chat functionality
- Redesign this component based on this specific component (it can work all at once but generally its less buggy if you do 2-3 components at a time)
What I’m Proud Of
- Built and shipped a full app with an intuitive interface, working export flow, and beautiful end product.
- Never wrote any backend logic — fully vibe coded.
- Pushed through tough moments and kept building, lots the night before.
- Didn’t compromise quality — the result is a product I’d be proud to share with any parent or educator. I think the whole application is fully functional without any issues and the only thing I will probably bring in the future is an option for people to pay for credits instead of requiring them to use their own api keys.
Favorite Bolt Moment
After struggling for days with React-PDF, I vibe-coded a DOM-based export flow that just worked. Seeing the finished book PDF with crisp text, styled headers, and perfect alignment was the “this is real” moment. That process is a little bit jankier than using react-pdf, but with react-pdf I just couldn't get the same text placement, shadows, etc.
Very excited to continue on a journey with this product- will be building in eleven labs support to show kids how to read highlighting words as it goes as well as providing kids an alternative to television when parents are busy as the books will read themselves. The main thing I am waiting for is the submission period. I know I could spin up a new database and use a branch to work off of, I would rather not break anything until the hackathon judging ends.
Devpost user- sbphillips19
Hackathon submission- https://devpost.com/software/wigglytales
Top comments (0)