Cloud Chameleon — Making a serverless ‘whodunit’ game for the Zoom generation.
With no end to the UK lockdown in sight, Zoom parties will remain the weekly highlight of social interaction. Some classic party games such as Outburst can be easily played without everyone having the game available at home.
Looking for new party games to play I bought The Chameleon by Shoreditch game designers BigPotatoGames. While the idea is simple enough the game doesn’t easily lend itself to be played by Zoom party without some tweaking. Being a javascript developer I decided to port the game to the cloud.
In this article I decsribe the game mechanics of the CloudChameleon prototype which I was able to put together within a few hours. Hopefully some interested parties will pick up the game and provide us with feedback to further tweak this version of the game. In addition to the game itself I want to discuss the development process and how the codebase may easily be adpated to port other games to the cloud.
The Chameleon
Your job is to blend in and not get caught. Everyone else is trying to work out who the Chameleon is. Everyone suspects everyone else at the beginning.
Using one carefully chosen word the other players try to smoke out the Chameleon, who doesn’t know the secret word.
How to play CloudChameleon
Hosted on Vercel the game can be accessed here: https://chameleon-roan.vercel.app/
The initial screen provides a link to create a new game.
Each game has a unique ID. Following the link to create a new game will redirect the browser with url path being the ID of the game.
The cloud version of the game is centered around a lounge where players may join or leave in between rounds. Providing your name in the input field and clicking join will request a player cookie from the CloudChameleon host and add the player to the current game. A player will automatically join a game if a CloudChameleon cookie is already present.
The first player to join is the dealer. It is possible to deal a card with a single player but it wouldn’t make sense to play the game with less than 3 or 4 players minimum.
The dealer may select a card to be played in the next round. As for now I only provide half of the cards which were shipped with the game as bought from the BigPotatoGames shop.
Selecting a card will close the lounge. The host randomly selects who the Chameleon is and the secret word from the card. Every player in the lounge will now see the card with the secret word highlighted.
The Chameleon is now in control of the game but does not have the secret word highlighted.
The round can now be played via zoom. Every player, including the Chameleon, should take a moment to consider which word they want to say in order to describe the secret word. The chosen word should be vague enough to not give away the secret, but concise enough to flush out the Chameleon.
Once every one is ready the round is played by saying the word each player has chosen, beginning with the dealer for this round. Beware that it is possible that the dealer for this round can be the Chameleon.
Due to the nature of a Zoom party the order of play should be determined prior to each player saying their chosen word. Alternatively the player to say their word may name the next player until everyone has provided their clue.
The group must now decide who the Chameleon is. If no majority decision can be made the dealer of this round can act as tie breaker.
It is now the turn of the Chameleon.
If undetected the Chameleon may click the text button and end this round.
If uncovered by the other players may Chameleon may make an educated guess for the secret. By clicking any of the words on the card the Chameleon may guess that this word is indeed the secret.
All players return to the lounge with the scoreboard reflecting the result of the round played. The Chameleon is now the dealer and may start the next round by selecting a card.
Scoring
If undected the Chameleon will received 2 points.
If detected but guessing the secret the Chameleon will receive 1 point.
But guessing poorly and every other player will receive a point instead for uncovering the Chameleon.
Making the game
By nature of my profession it was clear that the game should be deployed as a serverless function via Vercel. As of today and according to their website forever; It is possible to deploy serverless functions for free.
Being serverless the game data itself must be stored in a document store to record the game status and scores. This can be done with FireStore, Google’s fully managed, scalable, and serverless document database. This service comes with a very generous free tier of 20,000 requests per day, and 1GB document storage.
The game data itself is tiny. The game and document itself share an ID which is created through the Nano package. The status of the game is defined by the current card. Players are in the lounge if the card key is undefined. The players are stored in an array. The first entry being the dealer / chameleon. The game data is updated when a card is selected and during scoring.
The game id is provided with all requests as URL path parameter. The player id is provided in a cookie with each request.
The host must be able to trigger events in the browser script for the game. This is usually done with socket.io. However, our host lambda will terminate after a request has been processed. Socket.io does not play well serverless.
Pusher/channels is a great service for socket.io~like functionality without the fuss. The free tier includes 200k messages per day which should be plenty for quite a few games. The initial setup took me less time than writing this paragraph. The browser script subscribes to a channel with the same ID as the game. This allows the host to trigger events in the script when players join, leave, a card is dealt, or the scores are updated at the end of a round.
This leaves only the game script and view to be assembled. This is hardly at facebook level complexity and using a framework such as React would be overkill. We believe in vanilla and simple javascript. The µhtml library developed by Andrea Giammarchi provides us with means to effeciently render the game interface into a browser document view.
Please feel free to fork my repository and deploy your own host of this game with the information provided here.
I strongly feel that there is more to be made with the techniques applied in this port. I would like to create a serverless host for the Secret Hitler game next. And then perhaps design my own game mechanics in due time. Then again this lockdown can not last forever.
#staysave
