Hello, everyone!
For the last months, I’ve been working on a browser multiplayer strategy game called
picswars.io. In this game, you select an image and capture territories for it so that everyone can see your picture. Imagine a fight for dominance between a selfie pic and a country flag or a battle between McDonald's and BurgerKing logos? Another cool thing is that you can make only 10 captures every day, so every action counts and everybody has the same chances: the busy people and the gamers.
This is my first devlog, so I will add a bit of background for the whole picture. Initially, the game was called Squardak, which is a mix of square + kavardak (means a ‘mess’ in Russian). The funny thing, the game really was a mess at the start!
This is a first screenshot of the game:
At that point, I’ve just drawn the squares and was very happy with the result. This was my first time with a Phaser.js framework, so it took some time to get it working!
Next, I’ve added an ability to capture squares:
As you can see, there is more UI there. The page looks colorful with all those squares! Note the numbers on the top. Can you guess what they mean without reading a tutorial? Spoiler: nobody could so don’t worry
Finally, the game was ready to be playable. It didn’t have any images yet (because it was hard to add), so I’ve decided to add an ability to draw pixel art, by changing each square’s color.
People started drawing something, so it looked promising! But then the reality hit me hard in the face: almost nobody understood how to play it. There was no tutorial, just some helpful tooltips. The game was full of UX problems and there was no point in playing it! Only a couple people were really interested in drawing pixel art, but with the low number of players, the interest quickly faded away.
It was a disaster.
I was expecting something great! Turned out I was very naive and made a terrible mistake of not speaking with the players while building the game. I didn’t have any ways to measure the effectiveness of my features, I didn’t collect feedback.
Luckily, I realized the issues and started organizing feedback. You can see it here:
https://docs.google.com/spreadsheets/d/1FaEH9uGHclU7EP48r5yh0g0kDvDJJVGwatis7qzoBsc/edit?ts=59788122#gid=0 Next, I’ve added metrics to measure what % of visitors actually capture something, make 1/2/5/8/10 turns and so on. This should help me to understand if people are understanding the game and having fun.
I’ve realized the game is too complicated. Previously, there was a complex logic so that there is a global 30 sec turn. While the timer is going, you can select squares and click GO to submit your ‘capture plan’. Then you needed to wait until those 30 secs pass, after which all submitted capture plans are processed and applied. For some weird reason, I thought that having this timer is a required thing for a game to function and never questioned that.
The funny thing is that I’ve had a bug which made the capture plans apply immediately without waiting for a global turn to finish… and it just worked. Next thing I did was removing 900 lines of code associated with this timer and everyone was happy about it.
Previously, there was also a capture chance. It was super complicated too. Each of your captures had a capture chance, determining if you capture succeeded or not. If not - the turn (out of 10) is lost; else - you get the squares. The chance was calculated depending on which squares you were trying to capture: the neutral ones had 100% capture chance, while the players’ ones had 50%. The resulting chance was an average of those chances.
I thought that having that chance will add strategic depth, but all it did was complicating the game, so I removed it. Maybe in the future, I will add more depth, but for now, I should focus on the core of the game, removing all distractions.
That all resulted in a cleaner interface:
Then, finally, I understood why people will play the game (of course this is still a theory to be tested, but anyway). If I provide them a tool to not only post an image on their territory but to capture territories together as a community, then people will play for their friends. Thus, my next task was to add images and add a basic community feature: an ability to set an image based on other player’s nick. That way, for instance, TIGSource supporting players can write down a main TIGSource’s player’s nick and copy an image from them. This will result in a TIGSource image (a logo for example) to dominate the shared field. What’s more, every player will be able to add a link with some text to their territory. This will be really useful for the communities and companies to promote them in this game.
Thinking about that, I renamed the game to Picswars.io, so that people will quickly understand that it’s a browser multiplayer game about pictures. The old name made sense only to me, so this was a logical decision as well.
Finally, we’ve reached this week.
Devlog 11.08.17 - 18.08.17:
This week, I’ve added a quick tutorial when a player first visits the game:
It’s something, but not as good as a guided tutorial through the game, which I will add soon.
Next, the most important: I added an ability to upload your pictures (note: the picture isn’t yet applied to squares!). At first, I’ve struggled with implementing the upload and resize with Node, S3 and Mongoose, but then I’ve picked a tool Uploadcare. They have a free tier and some of my friends work there and they’re far more feature rich than I wanted to implement, so why not? Here is the result:
Looks cool!
Next week, my goals are:
Attach uploaded images to the players’ territories
Allow copying other player’s image
Get more feedback
Thank you for reading so far! I will keep writing devlog every Friday, so stay tuned! I will be very grateful for any feedback too! Check out the game at
picswars.io!
P.S. I am open about my development, so here are some links: