Element Mash is an iOS game I worked on as part of a 3 person team with a developer and a motion designer. Together with Adrian Clyde and Josh Mortenson, we took a project that Adrian had been tinkering with and turned it into a full game. I created the branding and visual assets for this game as well as collaborating closely with Josh on the overall experience. Below, I outline the process from beginning to the launch of the app.
SKETCHES | WIREFRAMES | BRANDING | DESIGN COMPS | APP
The early version of the app Adrian had been working on had a neat concept and solid code, but needed a lot of help to bring it to life. It needed a brand, a story, visual interest, and some UX flow.
Starting with aN IDEA
This is the concept that Adrian was tinkering with when we started out. The main structure for the game was there, but we essentially started over in many ways due to the complete changes we made.
The concept was centered around the elements of the earth and we came up with the name "Element Mash". We also determined we wanted to represent the elements differently as well as capturing more of them. Of course we would need to be inspired by our favorite team of superheroes shouting "earth, fire, wind, water, heart," along the way. We chose life as a better representation for our purposes though.
After we had a name, I needed to design some branding for the app. I started sketching and came up with several ideas that were good, but weren't quite what we were going for. One day while I was working I had an idea inspired by the motion created when connecting elements. I sketched it on a sticky note and the idea stuck.
The branding we finished really helped to inform the look and feel of the rest of the app. Josh had taken a stab at redesigning the elements which turned out much better, but in the end we felt they were still too literal for the feel of the app. I worked on simplifying the elements down to basic shapes and creating visuals we could make a pattern with. I came up with a system of shapes to represent each element and how they would scale when used as a pattern in motion.
The first concept I sketched had a drawer concept where your element of choice was always in view and you could easily switch between them, but opening the drawer would reveal all the details about the level of the element, your top score, and how many gems you had acquired.
The drawer concept seemed great so I created the visuals for it and realized something was off. You can see the transition I made between the first and second image below. The game design was feeling too "product" like with the perfect grid and buttons aligned. I started loosening it up a bit and it felt much more fun, yet functional for what we needed. I realized though that even with the changes to the buttons, the drawer now didn't feel like it fit.
Josh and I worked together on redesigning the menu from the drawer we had before to creating a full menu page that we used as a starting point within the app. It felt more fun and fit within the design of the rest of the app much better.
After we launched the app, we talked to many users and got feedback for refinements. One of the things we heard over and over was the feeling that users needed a purpose. We realized the app needed a backstory so we went back and created the story shown above as an on-boarding for first time users. It gave the users a purpose for collecting the elements which powered earths shield generator. It really brought together the missing element.
We experimented with revenue models to see what worked best for the game. We started out with a flat $0.99 price and experimented with 1 week of free access to see how much traction it gave us. After this we debated between a "free with in-app purchase" model vs. a "freemium" model, where the app is playable for free to a certain limit that can be unlocked with a one time payment. We opted for the "free with in-app purchase" model and created opportunities within the app for purchases.
We had just under 10,000 downloads of the game and several great reviews to go with it.
What I Learned
I learned a lot of subtle specifics about designing for mobile. There were many things we designed and changed after feeling how it was to interact with it on the phone. After all the testing though, we landed in a good place. Another interesting learning was found at the intersection between design and sound. We had a lot of fun working on just the right selection for each part as well as selecting a great soundtrack for the game.