This game is an active work in progress.

I've been playtesting with friends and family, getting feedback and working on polishing the game. Ideas for the future include more sound options & controls, global leaderboards, more animations, and adjustments to the layout.

Most importantly, I'm really excited about creating a mobile-native version of the game to release on the app store, taking advantage of unique mobil effects like haptic feedback and generally making the game more publicly accessible.

At this point I had taken the game and recreating it effectively in p5.js, adding some exciting mods that made it meaningfully different than the original. I was feeling really excited about the potential of the game, and decided it was time to graduate it off of p5.js onto something more accessible.

I started recreating what I already had in p5 in React, taking advantage of all the benefits of responsive design. At the same time, I was also thinking about what else could be added to the game to make it more of a complete experience

The first simple change was to add a landing page, a place to ground the player before they dive into the game.

I wanted to make the game feel more like a complete experience, so I added a landing page that would give the player a simple place to sit before diving into the game.

Most importantly, I needed the game to have a title. I had been calling the circles tiles in my head, so I decided to roll with that and call the game mosaic, embracing the idea of a grid of tiles in bright colors and patterns.

Creating a higher-level gameplay goal: maintaining a streak

At this point, the goal of the game was to undo a pattern in a certain number of moves. While this was interesting, the challenge related only to a single puzzle: there was no arching gameplay or progress over the course of multiple puzzles.

My first idea was to add a score counter, giving players points for completing a puzzle. They could earn more points by completing more difficult puzzles or by completing a puzzle within the target number of moves.

While this worked, it was still a little bit arbitrary. Players could earn an equivalent number of points completing a ton of easy puzzles as they could by completing a few hard ones, which didn't really incentivize them to try to improve or take on a more difficult puzzle.

Instead, I decided to add a streak mechanic: players would add to their streak by completing a puzzle within the target number of moves, and lose their streak if they took too many moves. There would be a different streak for each difficulty level, making it more clear how they fared at the different difficulty levels.

Now, there was a motivation to play not only a single puzzle but multiple puzzles in a row, to continue getting better so you could get longer and longer streaks on each difficulty level.

Next, I added a freestyle mode, where players could just play around endlessly flipping tiles with the same logic as the original game, but with no goal or limitations.

One friend that playtested my game was completely and wholeheartedly uninterested in matching a target pattern. I told him what the goal of the game was, and he expressed that he just didn't care to do that.

Instead, when given the board, he was most interested in just playing around with the tiles, flipping them to try to make an aesthetically pleasing pattern.

I was excited about the idea that the simple premise could give way to a bunch of different play styles, and this was a straightforward way to make that happen.

The next step was adding instructions and settings to control colors and sounds

In a world where people encounter this game without me looking over their shoulder, I wanted to make sure it still made sense. I added a simple set of instructions, explaining how the toggling mechanic worked and the rules around streaks.

At the same time, I added a settings menu to let players have strict control over the colors and sounds of the game.

Having the colors change at random was a fun idea but a little too jarring, and some players that I showed it to were confused by whether or not the colors changing meant something. I wanted to keep the same fun color palettes, so I moved them into the settings menu. Similarly, I added a mute toggle so players could turn the sound effects on and off.

These originally were two separate pages, but I decided to merge them into one since they were both simple. This way, new players clicking on "help" would also discover that they could control the colors

Adding animations

The final stage at this point was adding in some animations. I was interested in how motion could help create transitions between puzzles and create a greater sense of satisfaction upon finishing a puzzle, and one of the unique capabilities of migrating from p5.js to React was that I could now use CSS transitions to improve the experience.

I put this first version of the game in front of my roommates and asked them to play, getting some initial feedback. It was generally good, the game wasn't for everyone but my most likeminded friends caught the same addictive energy that I had.

I wasn't going to be satisfied with just recreating the original game, and now that I had a solid functional foundation I could start to really explore how to improve the game.

The first, most visible change was to change the grid from a square grid to a hexgonal grid.

This changed was prompted by none other than a game of Catan, because who doesn't love a hexagonal grid?

At first I was excited mostly because the new grid represented a clear visual departure from the original game, a very classic way of modding the existing game with a clear twist.

Upon playing with this new grid and showing it to my friends, I realized it offered a really compelling improvement to the game: It was much more clear how the neighboring tiles related to the center tile.

One of the most confusing parts of the original game was what exactly was happening when you clicked a tile: it was hard to tell which other tiles were going to be changed until you got used to it. The neighbors on the square grid exist at different distances from the center tile, making it a little strange and awkward to see the connection.

Because the hexagonal grid has more regular distances between tiles, it was much more clear and intuitive to see which tiles were "connected" to the center one.

The next change I made was a similarly large departure from the original: having players "undo" a pattern rather than match a target one.

This change was inspired by a mini game I play with one of my roommates: take a solved Rubik's cube, take a set number of random moves on it (normally 3-5), then try to solve it again.

It gets progressively harder with every move you add, but there's a strange and satisfying mechanic where each move you take feels like it's getting you closer to the solution.

This helps clean up the UI since I no longer have to show a target pattern, and also makes the game more satisfying to complete: Instead of succeeding when you match a random pattern (often asymmetric), you now succeed when the puzzle board is completely empty, a visual that feels more "complete".

My first goal was simple: recreating the premise of the original games in p5.js. I took inspiration from the dense grid of the Mario game and the satisfying circles of the Zenses game, creating a grid of circles with the same core mechanic of clicking to toggle a circle and all its neighbors.

Every game needs a goal, and I kept the same goal of trying to match a target pattern. I was less certain about the aspect of a time limit or lives, so I focused first on just recreating the core mechanic.

I kept the same idea that the target pattern should be dictated by a certain difficulty number, reflected in the number of steps that were taken to create it. I added a difficulty control, accessible via arrow keys, to let players experiment with different levels of difficulty.

In the spirit of an infinite game, players could also restart the puzzle or generate a new one at any time.

I was really interested in creating a minimalist aesthetic that matched the simplicity of the game. Each tile could fundamentally be only one of two colors, so I extended that pattern to the whole interface, making everything duochromatic.

Driven by my own indecision for what those two colors should be, the minimalist aesthetic gave way a little to a set of color palettes that the game would randomly cycle through whenever the user changed the difficulty or generated a new puzzle.

I also included some simple sound effects to make the game experience fill out a little more, a set of short marimba sounds that play when a tile is flipped and a longer sound that plays when the puzzle is solved.

Over Christmas, back in my hometown, I found myself engaging in a familiar pattern. When I'm at home I tend to get really nostalgic, digging up old toys and games and playing with them with my siblings.

This time around I was especially fixated on my old Nintendo DS. We visited a used games store, I picked up a copy of "Zenses" for $5. I had never played it before but picked it up to meet the $15 card minimum.

It's basically a series of short minigames, one of them being a beach with small tutrle shells that you can tap to flip over, toggling it between a light side and a dark side. The catch is every time you flip a shell, all of its neighbors flip as well. The goal is to match the pattern on the top of the screen as quickly as possible, completing as many puzzles as you can before time runs out.

It reminded me a lot of another game that I used to play back when I was playing with my DS the first time around, a minigame in the Super Mario Bros that I was honestly a little obsessive about. It was the exact same premise, but in this version you had a limited number of moves to complete the pattern, and taking too many moves cost you a life. The levels got progressively harder, requiring progressively more moves to complete, until you finally failed and lost the game.

I have no clue which game came first, but all I know is that I LOVE this kind of game. It's simple, it's infinite, familiar yet never repeating. It's the kind of game that gets stuck in my head, where I'm seeing visions of tiles flipping and unflipping in my sleep.

I knew I'd been wanting to make a game for a while, and this was a perfect candidate for an easy game that honestly, if no one else liked it, I could at least enjoy it myself.

This is a solo project that I've been working on on and off for a few months. I was interested in creating an infinite puzzle game with a simple premise as a test of my development skills