š»āāļø Ice Breakers: iOS Game Mockup
Project: Fun side project working with a friend, mostly done as a learning exercise
Goal: Create a game on iOS with the objective of crushing same coloured blocks
Role: Designer
Process:
-
Research/Play Games: After considering design elements from similar games on Neopets, we went with āPolar Bears and Ice Blocksā as our theme.
-
Screen Flows: I started out with a screen flow to visualize how the user would navigate in the game. This was a simple game so I created a bare-bones screen flow based on popular games.
-
Wireframing: I created wireframes according to the screen flows. The orange buttons are interactive areas. While doing the wireframes for the Game screen, I realized that presenting the options to 'Pause', 'Play Again' or 'Selection' in-game was unnecessary. First, this increased the decision making during game play. Second, I thought, as a user, it would make more sense for 'Play Again' and 'Selection' to come up when the pause button was pressed. The solution to this is shown in the second wireframe where 'Play Again' and 'Selection' would come up as an overlay. Since there is an overlay, I added a 'Play' to enter the game again. I renamed 'Play Again' to 'Restart' and 'Selection' to 'Quit' to avoid confusion.
-
Hi-Fidelity Mockups: I then created a hi-fidelity mockup based on the wireframes. Some examples below.
Final Output: The app has been discontinued.
Learnings:
- Iāve never illustrated ice before, and I learned a lot about lighting.
- Even with the simple game, creating a screenflow can help you know exactly what you need to design for