Vibe Coding a Merge Game

When we built products for Gaming companies at App Annie (now data.ai (by Sensor Tower) ), my team was eager to build our own Gaming apps so we could dogfood our products. However, the cost of building the apps was prohibitively expensive at that point.

However now with Vibe Coding, I am so excited to finally be able to build games on my own! It is worth pointing out that I have a background in Engineering and am familiar with basics of software development. I have learned multiple software languages during my Undergrad and Grad schools and since then also self-taught myself others through Coursera . This enabled me to more seamlessly interact with vibe coding platforms and without this basic level of understanding, I may not have been able to create functional games.

In this article, I am sharing my experiment with different vibe coding platforms to build a Merge game. For those not familiar, a Merge Game is a type of game where the primary gameplay is combining two or more identical items to create a new (upgraded) item. Note that Merge games are very popular and very sophisticated and I was not attempting to create a viral game. My aim was to create a basic functioning merge game, the kind that could have been used internally for testing at data.ai (by Sensor Tower) .

The Vibe Coding Platforms

I evaluated 4 popular vibe coding platforms.

Summary of findings

Claude was my favorite, despite some drawbacks like not automatically detecting and correcting all syntax errors. It produced a gorgeous UI, a sophisticated gameplay and had minimal friction in the workflows to edit and publish.

Google Gemini performed pretty well, but the default gameplay and UI were not as pleasing. However the platform was fast and generated error-free code.

Lovable had the most SaaS capabilities like integrated analytics and collaboration workflows, as well as some unique UI elements. Unfortunately I was very disappointed with the speed of execution in this platform.

ChatGPT was my least favorite and I found the workflows particularly difficult to use.

Gory Details

I used each of these platforms to create a simple merge game with animals as merge objects. Initially I was looking to build an iOS app, but the only way for me to test it out was to download and run with Xcode. Not being a power user of Xcode, this started to feel like a roadblock. And so I switched to building a Web App instead. Note that this iOS friction exists with all the platforms.

I was keen to find a platform that would let me build my game quickly and with minimal friction. Hence I chose to go with the Chat interface (versus the developer portals). My prompt to all of these platforms was quite minimal, as shown below:

create a web merge game with pictures of the following items - dog, cat, rabbit, horse, cow, tiger, monkey, elephant, zebra, giraffe        

1. ChatGPT by OpenAI

I started with the well-known and popular platform ChatGPT. Sadly, this experience made me very concerned about my likelihood of success... ChatGPT created a pretty decent game and showed me a preview right after creation.

However, after switching back to chat, I was unable to get back to the preview. When I asked ChatGPT to run the game, instead of launching the preview, it gave me two options - one with instructions on how to run it locally and second to create a single file that could be run locally. I chose the second, but it sounded clunky in that I had to download the file to play the game. See below:

This was such a strange experience, I couldn't figure out how it did preview the one time after creation but was then unable to relaunch the preview. After some digging, it turned out there was a hidden way to rerun the preview, by opening the preview through Canvas in the saved Chat.

Canvas is also a very confusing workflow with auto-named apps and not very intuitive names. See below, I had two options for the one app and only the second one could actually be previewed.

When chose the offered option to create a standalone HTML app, the game changed from the original React version which used emojis for the animals to a HTML version which used images. This unexpected change was one of the problems, but the bigger one was that some of these imaged were awful (see the cat) and some were completely missing (see the rabbit). This was also the least attractive game generated across all the platforms.

In summary, the workflow was very confusing and the output was unpredictable. Hence, I am wary to try building other games using ChatGPT.

To see even more of the gory details,

• View my interaction with ChatGPT here: https://chatgpt.com/share/689676e9-bf7c-800d-82c6-fa402468fd9b
• Play the ChatGPT-powered game here:

2. Claude by Anthropic

Claude was the second platform I tried, and in terms of the quality of the output and experience interacting with Claude, I was thrilled. Taking a simple prompt, Claude not only created a game but also described it in detail. I feel like this description could be easily reused for help documentation, app store pages etc. See this description below.

However, the first version created had syntax errors, and initially old-school me tried to fix the error myself. After wasting a couple of hours, thankfully I had the Eureka moment to ask Claude to fix the syntax errors. After that, it was smooth sailing and the end result was a pretty good game with a polished UI.

To see even more of the gory details,

• View my interaction with Claude here: https://claude.ai/share/d31641e4-ad6f-42aa-adfa-234b9817d801
• Play the Claude-powered merge game here: https://claude.ai/public/artifacts/11279392-2333-42a1-a397-d0e7eb3922a8

3. Google Gemini

Gemini was quite good as well. It was the second runner-up for my experiment. Where it lagged behind Claude was in the design of the UI (including missing header) and quality of the default gameplay. However with instructions, it easily evolved to a better gameplay. Where it did better was in the quality of code, I didn’t run into any syntax or console errors while generating the code. Integrations with preview and publish workflows were also quite seamless. I can see future for integration into the Google Playstore which could be unique to Google.

To see even more of the gory details,

• View my interaction with Gemini here: https://g.co/gemini/share/11bb9188bb99
• Play the Gemini-powered merge game here:

4. Lovable

Lovable was the slowest of all these platforms, noticeably much slower. Note I tested them all of them on their free tiers.

Interestingly, Lovable showed a lot of detail on which files were created and how many edits were made, but it wasn't clear how these could be useful to the end user.

Where Lovable really shone was in its SaaS capabilities - collaboration, domain management, integrations with Supabase and Github, analytics, marketplace etc. The visuals of the cartoon animals in the generated game were also quite stunning, and seemed unique. While the default gameplay had the same drawbacks as Gemini, I was able to change this quite easily.

To see even more of the gory details,

• View my interaction with Lovable here: I couldn't figure out how to share this... I will update this if I can find a way.
• Play the Lovable-powered merge game here: https://critter-mix-mania.lovable.app/

What’s Next

Based on these experiments, I decided to move forward with Claude for my future experiments. I made this decision primarily because I don’t have UI and UX experts to support my work. And I have my fingers crossed that I don't run into too many syntax and console errors...

And hence begins my journey to test different use cases that Vibe Coding can enable for Product teams. Let me know in the comments if there is a certain use case you’d like me to try out.