How might we show that messaging is useful outside the world of chat?
Magnet Message is an in-app messaging application. We faced a big problem in the form of people's perception of messaging. Most people think of messaging as being only useful in chat applications. We needed to come up with something to illustrate a different way to use messaging. The answer was to make a game.
Role
UX Design
UI Design
Visual Design
Product design
Goal
Developer centered
Only native UI
Minimal UI components
Clean simple code
I created the user flows, screen layouts, and all the graphical assets.
Planning Phase
Building a game with messaging is probably the last thing people would think of when they think "messaging". At its core a game is just sending one player's move to another via a message.
We needed a fun yet simple game. Viable game options include tic-tac-toe, checkers, chess, and connect-four. We chose Rock Paper Scissors, and if we could do Rock Paper Scissors, we might as well make the more popular variation: Rock Paper Scissors Lizard Spock (RPSLS). This would be a fun game with cool visuals, and we are all geeky people, so we knew we would have fun making it and it seemed right for our users.
Research
I looked up the rules and made a win/loss matrix.
This helped the developers with programming the logic of the messages and for me to design the images.
Design Phase
I started with screen flows by breaking down the different interfaces the developers would need to create. From there I made wireframes for the developers to work from.
Then came the biggest chunk of work - the 16 win-loss condition graphics. I started with black and white, but it soon became clear that these need to be in color, to do the app justice.
Implementation Phase
I delivered all the graphical assets to the developers, and directed tweaks for the implementation. I tested builds to assess the UI and functionality. I also coded a webpage (also for github.io) explaining the sample app and our process.
Here are the screens for leaderboard, player list and in play:
Deployment Phase
RSPLS was made available as a zip file for download that contains both Android and iOS compatible projects on Magnet Message's product page.