# FC Daily Dungeon - How I built this

*tl;dr: built a turn-based dungeon crawler that runs entirely in farcaster frames. 2 days from idea to launch with 150 players. here's how*

By [hellno](https://paragraph.com/@hellno) · 2024-10-21

---

**my goal**  
create a turn-based game that is fully playable in a Farcaster frame in two days

**result**

we're live, [play in Warpcast here](https://warpcast.com/hellno.eth/0x58b323db), gameplay video below.

four days after opening the dungeon we had 150 players in 218 battles.  
players randomly meet one of 7 opponents who each have two unique attacks.

[

fc daily dungeon demo vs betashop
---------------------------------

https://warpcast.com/hellno.eth/0x58b323db

https://vimeo.com/

![](https://storage.googleapis.com/papyrus_images/0d9c2990727344ecc2bdc736d3e1e353.jpg)

](https://vimeo.com/1021678072/cf357e6d1c?share=copy)

**why a game in a frame?**

I wanted to build a frame that goes beyond trivial one-click interactions. I didn't see many frames using the benefits of the Lego block:

*   user brings context: the frame knows the user's Farcaster identity, their connected onchain addresses and on which cast a user interacts with it
    
*   one click to start: the frame appears in the Farcaster feed and the player can start it. no app store downloads or additional login needed
    
*   post anywhere, but play one game: a frame can be posted many times. the game keeps the state of each player's progress independent from where it appears
    

**prototyping**  
I wanted to get a grasp of the game flow, so I started with some rough sketches in excalidraw. kept this as my the source of truth while developing. I got a sequence of the core game loop locked down after a lot of simplification.

![](https://storage.googleapis.com/papyrus_images/43c9062110e52d86afc58f2ee1ad8a95.png)

### **tech stack**

**backend**  
runs on python using django framework. I wanted something fast and I'm fluent in the python & django stack. Struggled with some project templates for an hour, because I wanted to get fancy and have async workers from the start. None of it worked when I deployed it, so scrapped everything, copy-pasted an old project and went from there. Built in admin dashboard provides an easy overview of the player activity.

**frame / frontend**  
runs on typescript using [frames.js](https://framesjs.org/). I had previously used frames.js, so wanted to test if [frog.fm](https://frog.fm/) had any upside that I missed out on. summary: hell no. I failed miserably to built any non-trivial frames because of the URL size limit. Never got to render a user's profile picture or anything beyond a box with two lines of text. Switched to frames.js, merged a few templates that the team provides with my previous code and five minutes later had the battle frame showing up. highly recommend the custom image worker [example](https://github.com/framesjs/frames.js/tree/main/templates/next-starter-with-examples/app/examples/images-worker-custom).

neynar API provides the player info, mostly name and profile picture.

### **what's next**

*   add custom player attacks via text input
    
*   add a public leaderboard
    
*   add exploration mode to walk around 🤩

---

*Originally published on [hellno](https://paragraph.com/@hellno/fc-daily-dungeon-how-i-built-this)*