AI-Assisted Development
I'm pretty oldschool when it comes to tabletop RPGs. My favorite system is Dungeons & Dragons B/X (1981), and I'm also not a big fan of using miniatures or elaborate accessories. Much of the experience I enjoy providing to the people who play with me revolves around nothing more than theater of the mind, a sheet of paper, and dice rolls.
š° This post meant to inspire beginners
Because of that, I don't intend to dive into agents, harnesses, or different models, just the basics of Claude on its free plan.
So I decided to build a very simple Virtual Tabletop so I could play online with friends who live far away. I started with three main goals:
- A canvas that supports images and freehand drawing
- 3D dice for a more immersive experience
- Support for different devices (mobile-friendly)
Then I sketched a few ideas to solidify the MVP I wanted, resulting in this:
This wasn't the first time I'd attempted this project. Previous attempts were blocked by the challenge of integrating a 3D dice rolling library, and I knew that would be a hurdle again. So this time, I decided to use AI as a development assistant with Claude Code.
The grill-me skill
I've been following Matt Pocock's work recently and really enjoy the way he shares both his thought process and the results of using AI. His grill-me skill is one of his most well-known creations, so I decided to use it at the beginning of the project to build a development plan.
The result was far more interesting than I expected. It asked me 100 questions, progressively, helping me think through the architecture and major decisions behind the project. Some of the most valuable suggestions were:
- Guest-first authentication using shareable links (anonymous auth);
- A 24-hour lifetime for created rooms, making better use of free database and server plans;
- Automatic host transfer when the current host leaves, with automatic ownership restoration when the original host returns;
- More realistic participant, drawing, and image limits based on Supabase's free tier;
- And several other ideas that helped shape a much more robust MVP.
I also made sure Claude wouldn't act as the project's sole developer. The goal was for it to behave as an assistantāguiding me through the development stages and helping answer implementation questions whenever necessary.
The project was then divided into seven phases:
- Supabase setup (schema, RLS, cron jobs, permissions)
- Room creation with guest-first authentication
- Whiteboard implementation using
react-konva - Image upload implementation
- Multiplayer presence and host transfer
- Dice rolling
- Limits and TTL-based data cleanup
Claude's Assistance
Throughout the project, Claude helped me design a much better Supabase schema, define RLS (Row Level Security) policies, and create cron jobs to handle the TTL (Time To Live) of game rooms. I don't have much experience with databases or backend development in general, so this guidance was extremely valuableānot only because it accelerated the implementation, but also because it helped me understand the reasoning behind each decision.
Next, we implemented the whiteboard using react-konva, connected drawing events to Supabase RPC (Remote Procedure Call), added image uploads, multiplayer presence, and finally implemented the dice rolling system. This time, integrating the dice library was surprisingly smooth thanks to Claude's guidance, using @3d-dice/dice-box-threejs.
I wrapped up the project by implementing limits for images, players, and drawings. I also finished the UI using CSS Modules and made a few metadata adjustments for Next.js.
I was extremely happy with the final result, and I'm excited to test it with friends during our online RPG sessions. It took just three days of spare-time development, and once again it reminded me that AI-assisted development is a great way to accelerate implementation and turn ideas into reality.
So if you have an idea you've been meaning to build in your spare time, I hope this post inspires you to finally get started.
See you next time! šš¾