Inspiration

In Indonesia, it is customary for friends, relatives, and colleagues to send large flower boards to big events such as weddings, graduations, promotions, even funerals. As an Indonesian myself, I’ve always appreciated the sentiment behind these grand displays. They symbolize community, respect, and care.

However, these flower boards produce piles of trash made of styrofoam, plastic, paper, and other single-use materials. They are usually displayed at event venues for a few hours before being tossed out. I started to ask: can we show support to others with less waste?

This waste problem sparked the creation of bungadigital.xyz. It is a platform that lets people create and send digital flower boards. The idea is to keep the spirit and symbolism of flower boards alive, but in a more eco-friendly way.

What it does

"Bunga" means flowers in Indonesian. The name is self-explanatory; this app lets users design flower boards. Users can customize the flowers, colors, and fonts that fit their style and message best. These user-designed boards can be shared to event organizers, venue owners, or whoever is in charge of decoration and logistics at the event venue. Sharing can be down via file download or public link to the digital board.

How I built it

I heavily used Bolt and Anima (Figma plugin). A rough estimate would be 90% AI prompting & code generation and 10% manual coding. Here is a quick summary of what I did:

  1. I used Figma to design the flower boards because Bolt's limited functionality with generating code that heavily depends on static assets (in my case PNG flower images)
  2. I used Anima plugin to convert my Figma boards to JSX & Tailwind CSS code
  3. I used Bolt (both build & discussion mode) to create the website and integrate it with Netlify, Supabase, and IONOS custom domain
  4. Minor manual code debugging, mainly regarding file download

Challenges I ran into

I only found out about this hackathon on June 29 Indonesia time (almost 2 days before deadline). But seeing how easy it seems to use Bolt (and it IS actually easy!), I challenged myself to join. Although I've had the idea about this product for almost a month, the total effective build time for my submission is less than one day.

Accomplishments that I'm proud of

I can get a prototype MVP up and running in less than one day! This kind of feat used to be unthinkable unless you're a 10x Silicon Valley engineer. The fact that this mediocre-ole-me can do it really shows how good AI is getting. AI really is the future of web development.

What I learned

Non technical: The barrier to entry to just start building digital products is lower than ever. So, if you have an idea, just start building! It is during the building process that you will learn the most. If you really want to perfect the idea before you start building, don't mull it over by yourself. Throw the idea out somewhere: discuss it with trusted friends and mentors, post it on a forum, just put it out there first.

Technical:

  1. Pros and cons of various authentication flows (password-based, magic link/OTP, OAuth, Enterprise/SAML)
  2. How to convert JSX + CSS component into downloadable file format (using html2canvas)

What's next for Bunga Digital

  1. Refine the board designs
  2. Enable animated board download
  3. Enable online public links to share
  4. Establish partnership with event venues and digital board agencies

Built With

  • anima
  • bolt.new
  • figma
  • ionos
  • netlify
  • react
  • supabase
  • vite
Share this project:

Updates