by Silver

Checkmate on Your Wrist: Zepp Launches World’s First Chess Game for Watches

Take this bold title with a grain of salt. While there are other wearable chess, they are either simple GUI client wrappers for an online site like chess.com where its AI part runs somewhere in the cloud or are built for Android / iOS watches, which can’t be considered a low-powered device as their batteries last for a day or so.

You may find other variants but they probably have a clunky user interface to the point where nobody wants to play it. Or they don’t have a built-in AI to play against, because that’s the trickiest part in making a chess game. You can’t just grab some open-source engine written in JavaScript and run it here, it won’t even be able to make the first move. Nowadays engines are too complex for a device with a limited amount of compute power and RAM, so it has to be written from scratch.

Table of Contents

🚀 How It All Started

Our journey in creating this game began with a small mistake. We accidentally put a chess logo on the package of the Bip 5 watch, even though we didn’t have a chess game included. As a result, we had to promptly find a solution to this problem.

The most direct solution was to build the bare minimum, working version of the game quickly. Release it, and keep on patching. So we started to work on it ASAP.

🔧 Deep Dive into the Development

After evaluation of what should be done, and how to target this problem, the prototype was ready in a couple of hours. Just the basic grid movement and collision detection. But it was enough to see that it was viable for a small device. A bit rough on the edges (no pun intended), but suitable. Mini Chess it is.

Yep, you could have teleported your own and your opponent's pieces. That was the most fun version of chess.
Photo taken by Myoung XUE

In about 4 days we had a first demo that showed a little bit of intelligence. This was the birth of AI.

We got a debug a1-d5 grid to better visualize where our pieces are positioned.

By this time the Queen was removed from the board as it appeared to be too powerful of a piece to have especially in the beginning. It was replaced with a knight, which ended up being the AI‘s favorite piece.

As in usual chess, the pawns can be promoted to Queen in ranks 1 and 5. 

A few additional rules were introduced to cater for a small board:

  1. The major pieces are shuffled at the beginning of each game. This adds up to the game’s variety and makes it more interesting.
  2. The Rook can never spawn in front of a King. This led to the accidental checkmates on the first moves.
  3. The position of White and Black pieces is then mirrored.
Then we found good-looking open-source chess pieces, photoshopped a little board, and it started looking like a game. The looks were still far from being considered a commercial product.
The pieces are shuffled and mirrored. Making sure that the Rooks are never facing the enemy Kings.

⏳ The Long Hiatus

On Monday business decided to simply replace the packaging icon and it was the most reasonable solution.

This meant that the project was put on low-priority and we switched to working on more important things while returning to this one occasionally. 

🎨 Getting The Game Art

I got assigned a very talented designer Dandan GUO and she started working on the art.

She wasn’t familiar with the restrictions and that I was working on a Mini Chess variant, so the first version of the art was not suitable.

There were a couple of issues with these pieces and the board. 

The first one was that the art was pretty weak. Single White / Black color. The pieces did not have any volume so they didn’t “pop”, or properly separate from the board. They were basically glued into it.

The next issues were the Zoom and the full-size board. This was a big no-go as it goes against the proper user experience (UX). Having the full-size board means your pieces are super small and hard to differentiate.

Having the Zoom means you can’t see the whole board at any given time, and this is chess, the mind game, and when you don’t see the whole field it becomes difficult to move pieces, because you have to move them in your head. Which is tricky for people who don’t dedicate much time to chess.  

The last issue is that canvas swipe-scroll requires too much computational power and we are trying to bring this game to super low-power devices.

Here is the feedback that was provided to the designer:

  • The pawns look like they haven’t eaten for weeks and are on a strict diet!
  • There are no shadows/lightings to separate pieces from the board

Then I have provided a few examples where the chess art is done right. 

Our board had too much contrast compared to chess.com
Piece borders, lights and shadows that make the piece pop
Great example. Not so great parts were the border around the board and the coordinates notation. They both take space which we don't have.
This picture shows that we don't want the notation as they overlap with pieces.
Impressive render look.
This was the last example that shown that the gradient was uneven around the whole board, and we don't want that.

The feedback was submitted and it was time to wait.

✨ Getting Amazing Game Art

In about two weeks, we got this:

And it was simply stunning! I did not at all expect such great results from Dandan in one try. It was truly impressive, she heard every single bit of my feedback and acted on it.

The board is not dirty, it’s light. It has a nice texture to it. Piece borders, lights, shadows. Everything is in such harmony.

And even more, she added a great-looking move, select and capture sub-backgrounds that are put below the pieces.

But we were not done here, one last piece of the puzzle was still on the weaker side – the game icon.

It was pretty well made, but it had too many details, and while it’s easy to tell what’s happening on it while it’s large, it wasn’t so much when we put it on the small screen. This is where you want to avoid details as much as possible as they are not visible, and basically, your additional work is lost. So it’s good practice to zoom out. Here I’ve added more additional feedback:

Here you can see that a single object, Knight in this case, looks better and is easier to understand. Zoomed-in is even better.

A few more good-looking examples were brought in, for the designer to find something in between.

Nowadays, single unit + zoomed in + relatable expression is considered a most performing aka "clickable". This is proven by numerous AB tests that top developers or rather publishers in this industry run daily.

Literally, in two days, while being busy doing other things, Dandan made this:

And that just clicked. Again, in one shot she’s made history. It looked really good when zoomed out. Pure perfection.

She also finished the Win, Draw, and Loss screens. Those looked great as well.

This was all the art we needed.

⚙️ Game Mechanics

We are not going to get into details and bore you with numbers and algorithms, we’ll just scratch the surface of the most important parts.

And the first one will be the autosave feature. During the game, you can swipe away, especially by accident, and lose your game progress. This goes against the good UX so it was on top of the priority to have this feature built-in.

You can simply press CONTINUE and move on from where you left off. And if you don’t need it, you can start a new game. The game enables autosaving only after the first 4 moves, to make sure that the game is ongoing.

Another UX improvement that needed to be done was the loading indication. You don’t want your players to double-guess if the game is even ongoing or the watch has crashed. As we’re speaking low power devices, each turn takes some time to process.

Lastly, after playing this game for a while and debugging it, I realized that a user might benefit from having a simple stats window. To see the time you spent playing, and the win rate to encourage you to improve or keep your streak up.

While the AI is pretty basic, it can win occasionally, even if you have some experience in chess. Figured that making an AI a real savage that tries to checkmate you in every possible way, compared to a defensive one, works best for it, bringing a fun experience.

Overall I’m pretty happy with how the AI came out. It’s not too difficult to beat but still should provide a chess enthusiast enough challenge to feel entertained. At least for a few games now and then.

Unbeatable AI is pretty boring to play against anyway.

🔊 Did someone say sounds?

I can’t imagine a proper game without sounds, so we had to do something here. While the Bip 5 doesn’t support playing MP3 files as it’s a feature from ZeppOS 3.0, it does have a speaker to play the built-in sounds and that was the solution I was looking for.

Here I’d like to give a shout-out to our whole ZeppOS team for bringing this feature to life because without it the game would be 50% more boring. 

You’ll be able to experience it on an actual watch.

♟️ Supported Chess Rules

The game has move validation that makes sure that both players can’t do anything against the chess rules. The AI simulates its move before applying it, making sure that the move:

  1. Doesn’t put the King under a check
  2. Removes the check from the King (if it’s under it)
  3. Searches for the best move that scores the most points, based on predefined weights and strategy

The game supports basic rules for draw condition detection:

  1. 3-fold repetition, when there are no good moves and nobody wants to lose
  2. 50-move draw (25 per each player). For the games that were prolonged for some reason (maybe a bug).
  3. Stale-mate, for when the King is not under a check but also the player doesn’t have any valid moves.
  4. Insufficient material. For when there are not enough pieces on the board to checkmate any of the kings.

And this concludes our little development story. We hope you enjoyed it and learned something new. See you in the next one 👋

⌚ What Device Can I Play The Game On?

Currently, the game is available on these smartwatches:

  1. Amazfit Bip 5
  2. Amazfit Bip 5 Unity
  3. Amazfit Bip 5 Core
  4. Amazfit GTS 4
  5. Amazfit Active
  6. Amazfit Cheetah (Square)