Building a “Puzzle Factory” for CRISPR Crunch
2023-08-12
Going with the flow: How games can improve learning
2023-11-15How CRISPR Crunch transformed from Tower Defense to Pattern-Matching Puzzle
Our game CRISPR Crunch is a fast-paced puzzle game for mobile, in which the player fends off waves of attacking viruses by matching the sequence of colors on the virus DNA with those in the hexagonal grid in the center of their screen.
But it didn’t start this way! At first, CRISPR Crunch was actually a tower-defense style game, about “programming” your towers to match the viruses. So how did we get to your current form? That’s what this blog post is all about.
Genetic Origins
So what’s all this about viruses and DNA?
Well, the origins of this game go back to a collaboration with Jake Wintermute at the Learning Planet Institute (formerly called the CRI). Jake is a biologist who loves finding innovative ways to explain how biology works, whether to students or the general public.
Jake wanted to teach the concept of CRISPR-Cas9 through a video game. CRISPR is a key technology behind genetic engineering, and the story of how it was found is fascinating (I first heard about it on this excellent episode of Radiolab). It’s exactly the kind of challenge I enjoy taking on, where you “marry” gameplay to science teaching to create a fun experience where people learn something new.
But what kind of game would work to teach CRISPR? Jake and I had many discussions where he would school me on biology, and together we brainstormed about what kinds of gameplay could best express those concepts.
Tower Defense
The first idea that we found promising was a tower-defense style game where the player “programmed” the towers to match virus sequences. The virus sequence would pass like a snake on a path, and when it passed a “tower” that matched the sequence, the tower would jump into action and cut the sequence at that point.
In earlier levels you would drag-and-drop pre-chosen sequences, and in later levels you would drag-and-drop the individual letters. Here's what that played like:
Unfortunately, while the idea seemed promising, it was too difficult to sort through the long sequences to find commonalities. We couldn't find a way to dose the level of challenge without making the whole concept so easy it was no longer fun.
Draw me a Virus
Around that time I was enjoying playing Grindstone by Capybara Games, and was impressed by both the fighting animations and how well the “drawing on the grid” gameplay was adapted to mobile. This gave me ideas for our CRISPR game- why not give the player a grid of DNA that they “draw” on to make a DNA sequence?
I’m a big proponent of paper prototyping, so I printed out a grid and started playing with plastic tokens, and immediately started finding interesting interactions. The 4 nucleotides became 4 differently-colored tokens, which we thought would be more recognizable than the traditional way of representing them with the letters A, C, G and T.
This is also the point where we figured out that a hexagonal grid was more flexible to work with than the square grid that Grindstone used. Because each hexagon has up to 6 neighbors, there are a lot more possibilities to make complex paths. And in our case, the levels couldn’t be too large if we wanted smartphone players to be able to select them with their finger.
-
- Early grid sketch
-
- A cartoon take on the grid
-
- The grid, but … darker?
By the way, we got so much out of this guide to implementing hex grids that I can’t recommend enough!
Sharp Ends
Once we had that basic concept done, we started working on transforming it from a paper prototype to a working video game. It went something like this:
The player starts with a random grid of DNA, and along comes a virus that injects a random sequence of DNA. The player has to match the virus DNA with that in their grid, and they have as long as they want to do so.
So far, so good. But in nature, CRISPR complexes act as genetic “scissors”, cutting the viral sequences at certain points that match. This gave us the idea to put scissors on the grid as well. The rules then became that the player had to make a sequence that goes through the scissors at some point.
We tested this with players, and actually found it provided a nice sense of challenge and creativity. I was really excited about it, until I presented it to Jake, and he told me this was scientific nonsense!
In reality, a biologist can’t just copy part of a virus sequence and throw the scissors in the middle. They need to match at very particular points, called PAM for Protospacer adjacent motif.
Needless to say, this was quite annoying. We had to throw away a whole of the game design (and the code that went along with it). But in the end, I think led to a more streamlined design, with PAM elements taking the place of scissors. Because players had to start with a PAM, we could control their attention based on where we placed PAMs on the grid, and how many of them there were.
By forcing the player to start with a PAM (located in the center), we concentrate their attention on specific points in the level.
This eventually led to us dropping the idea that the player has as long as they want to solve the puzzle, and into a faster-paced puzzle design. If you’re interested in that story and how we measure and balance the difficulty of these puzzles, check out my previous post.
Graphical Evolution
Along with the game design itself, the graphics also evolved quite a lot.
-
- We had the idea that DNA on the grid could be “infected” when you didn’t solve a puzzle. Once the infection covered the grid, you lost. I loved the visual aspect of it, that reminded me of the black stuff representing evil in Princesse Mononoké
-
- Moodboard we created to see how cells were represented in other video games
-
- Portal animation. It was really hard to capture the “sucking in” aspect instead of a “turning spiral” aspect
-
- Hello, it’s me, the boss! This was the our first animation for the boss level
-
- Our first design for the “map” screen
-
- Second design for the map screen.
-
- In this version of the map screen, we imagined having previews of each level within the cell. But it was hard to make it work with larger grids, and was kind of a pain to generate
-
- Our second attempt at the game interface. I really liked the “thermometer” progress bar in the upper right. Going through each “ring” would give you a bonus or an extra star at the end.
-
- First designs for the viruses. In fact, we got them pretty close the first time around!
-
- Each nucleotide color has it’s own inspiration. This provided multiple layers, that we were able animate later.
-
- CRISPR meets Fruit Ninja! In this idea, the player slashes through the virus sequence after finding the match.
-
- In this version, stars were related to objectives that the player had to achieve. But that system was very rigid compared to comparing point totals.
-
- Early splash screen. The idea of having the DNA come out to the player seemed cool, but it always looked off to me.
-
- We’ve always wanted to try multiple viruses at once, but it is hard to make work in practice
-
- Testing what the nucleotide surface should look like
But is it really Educational?
Though I love making games where we teach something true about the world. But there is often a balancing act between maximizing for truth and maximizing for other elements that make a game fun and easily understandable, or just easy to build.
For example, in our previous game Blockchain Battle, we took the explanation side pretty far- but the resulting design was not easily repeatable. Each level introduces new interfaces and new challenges. As a result, there’s little replay value, and adding new levels, which quite a few people have requested, would basically involve creating a whole new game.
On CRISPR Crunch, I think we erred on the side of game simplicity. The game only teaches about DNA matching, and doesn’t go into details about how genetic engineering uses CRISPR to modify DNA. Also, it might give the incorrect impression that DNA sequences are just a few nucleotides long, where in fact they are in the 500 thousand to 1 million range.
I do take comfort in the idea that it provides a jumping-off point to explain how viruses infect bacteria, and how bacteria recognize viral sequences. In addition, we include additional educational elements as TikTok-style short videos, created by (and starring) Jake.
