updownonly.com : Building my own crypto mobile game [part 1]
I woke up one morning and grabbed a pen and paper because in my dream I had created a crypto game and I wanted to remember what the game was before the dream left my head completely.
The idea was a ‘higher lower’ style game with crypto prices e.g you’re shown a random cryptoasset and you have to guess whether its price is higher or lower than another asset.
Not exactly revolutionary but the idea stuck in my head and so I decided to test out some AI tooling and see whether, as a non-engineer I could bring this to life. At this point I want to stress that this is not some made-up lore for a blog post, this idea literally did come to me in a dream!
So this post details how the process of creating a game using AI tooling went.
Development Day 1
I decided to focus on using Claude for this since he (yes, I’m pronoun-ing my AI) has the ability to not just write code but show you what it ‘looks’ like in the tool too and since this was going to be a user interface heavy build, I wanted to be able to see in real time what my game was looking like.
I gave Claude the brief with a download of everything that was in my dream and some images as inspiration for the retro gaming style I was after. I outlined that I was not an engineer so he was going to need to handhold me through the process and prompt me with what was needed. He replayed back to me what was required and even suggested some great ideas to improve the game mechanics!
Then it was into some ‘development’. Claude whipped up an initial user interface and it was really exciting to see my vision start to come to life. As a product manager I know one fo the biggest challenges in software development is naming things, so I decided I’d wait for some pre-launch inspiration and went with a placeholder during the development phase.
Claude prompted me with various tasks that we could explore next like adding real crypto price fetching, implementing the game logic or creating the scoring system. We worked through the various setting up of the countdown timer, the scoring logic and some styling decisions. In general these were pretty straightforward and easy to do.
However one frustrating theme through the whole app development was how challenging specific user interface visualisation can be with Claude. The below is the 4 background options he gave me, described as:
Option 1: Subtle grid with a cyber glow
Option 2: Animated starfield effect (like old space games)
Option 3: Circuit board pattern
Option 4: Classic arcade dot pattern
Despite numerous messages back and forth I could not get these images to show properly and hence the game has the starfield background it does — it was literally the only one which wasn’t just a solid black background!
But things were looking more promising now and the basic design was at:
We then started work on a key component of how the real time pricing data would be pulled in. As a product manager this is familiar territory for me as all the crypto products I’ve built have needed to hook into one or another real time data feeds and so Claude and I assessed which one was best for my needs (free being a core component!) and we settled on CoinGecko’s API. There were some settings to tweak in this Crypto Price Service to ensure we weren’t polling the API too much and the potential for various errors now raised its head as the next item to tackle. So we got down to creating some error states.
Claude did a great job here in setting up some basic options (using the space theme I’d outlined for the project as a starter for 10):
And after a few rounds of my creative vision plus his engineering smarts, we had our own Star Loader component where a little planet orbits the sun as you wait:
We then got the user interface (UI) updated with this, connected in some mock data to start testing and …. I’d hit the usage limit and needed to wait until 2am to call Claude again. 🤦
Unfortunately in our two person team, I’m pretty limited without Claude so me and my creative vision would need to wait until the next day.
Development Day 2
To kick back off I wanted to ask Claude if the previously discussed leaderboard idea was going to be a bit of a lift (I’d had a hint from my CTO boyfriend that this was going to make my project require a database and should be avoided to reduce project scope). Claude agreed and we decided to scrap it.
We then set about creating a ‘How to Play’ modal for the game and integrating this into the UI. Claude had a few issues getting this growing file working as there were now various components; the Crypto Price Service, the star loader, the UI, the how to play modal etc and so he suggested we combine everything into one massive component. That sounded good to me.
But when he showed me the updated UI it looked liked this:
Gone was all the styling, the burger menu no longer worked, and I felt like I was back to the first few minutes of day 1! 🙃
I gave Claude a laundry list of improvements to make and we started to get back towards where I had left off but then …. I’d hit the limit again. This time MUCH quicker than day 1, and it turned out that one mega component and one giant chat history with Claude was not the best idea after all because it meant that every query Claude replied to reprocessed the giant file and the whole chat history.
So I had some splitting back up to do for day 3!
Development Day 3
The first task was to go back through the chat history and pull out the various components to add them into the Claude project history. This is a feature that let’s you add context to your conversations with Claude and means you can have multiple chats with him, all referring to the same material. The hope here was that this would mean that Claude didn’t have to reprocess so much and I’d get more dev time from my engineering buddy.
However I still had to try and get back to where I’d left off with my user interface (UI) so I re-prompted Claude, this time in a brand new chat with all the project context.
He started off with:
Which was definitely a step in the right direction but still a long way to go!
After a few design round we were finally getting somewhere and I was constantly downloading the files and adding them to Claude’s project history — deleting the old version to ensure he always had the ‘right’ and up to date version.
But then came button-gate!
The ‘Higher’ and ‘Lower’ buttons weren’t the 8-bit style I was after. So I did some googling and found a few inspiration pictures and even some CSS code snippets of some perfect retro style buttons:
However what should have been some easy button creation was HOURS of back and forth with Claude where he just could not understand the pixelated style I was after, nor give me an actually futuristic font. Even when I downloaded one and gave it to him. Nope, still the same arial-style boring font!
And then within all this back and forth of getting nowhere … I hit the usage limit again.
So far day 1 had been a big leap forward and the next 3 days had been getting back to the same UI point and failing to creating some 8-bit buttons. I was not feeling happy with my robot engineering overlord’s progress.
Originally published at https://www.linkedin.com.
