City Explorer is designed in partnership with Translink, the transit authority for the Greater Vancouver area in Canada. We gamified the everyday commute to make it more engaging and delightful for daily riders. Transit riders can now earn points while traveling. They take new challenges based on their location and by collaborating with old/new friends they earn more points. Leading transit riders to earn prizes based on their points. In addition, transit riders can also post news similar to Facebook, Foursquare about traffic or happenings in their community- making it useful for other riders who are traveling the same route. I collaborated with the UX designer and designed the user flow and user interface for the mobile application.

My contributions were in:

• Interaction Design, Wireframing, Prototyping
• UI Design
• Visual Design Guideline

Ideation

Sketching Initial Ideas

Prototyping and Visual Design

I built the prototype using Adobe XD and the final design was created in Adobe Illustrator.


Strategy
The challenge with this game was we wanted to have a lot of features, more like a one-stop application. It was important to understand how the challenges tied to the location, the number of points generated and how these created the prizes at the end. Later by working on different ideation. I designed the user flow to focus on the main game features: Map, Friends, Challenges, Posts, and Leaderboard.






Interactive wireframe
I followed a rapid prototyping process and created the wireframe in Adobe XD. Check it out!

UI Components and Visual Design

I designed the application to follow a minimalist design with sub-due colours. The reason behind this choice was to make it easy for readers to continuously interact with the interface without having eye strain. The first row displays the actual colours, the rows that follows display the UI for development with additional changes.