City of Toronto

Toronto devices
The City of Toronto was in need of a new look.

City websites are often not the best examples of what interaction design should look like, so as a side project I made both a website and iPad app based on Toronto, the city where I spent the first 5 years of my life. The website was more of a general website redesign while the app, called Toronto @ Nite, was an app to help residents and visitors find something cool to do.

Toronto website
Toronto ipad 1 Toronto ipad 2
Before doing any design, I started with research, focusing primarily on residents and visitors.

After doing a survey, the primary results were that participants were frustrated with how hard city websites were to navigate and how small images were. Plus, visitors needed a list of big things to visit while they were up there. Utilizing the survey, user personas and a moodboard, I was able to continue onto the website design.

After the research phase, I moved onto wireframes and testing to see how my design decisions worked.

Now I could dive into wireframes, now that I knew how to move forward. For the iPad app, this helped me decide where to move my elements on each screen to make more sense.

Toronto wire 1 Toronto wire 2
Then I could dive deep into visual design and motion prototyping.

Since this was the app that took you places, I used a metaphor of a taxi. I decided on using a yellow highlight with a primary black background to evoke this feeling on Toronto @ Nite. For the main website, I picked 5 very different colors that looked even better together that reflected the vast diversity of the city. Motion prototyping helped me visualize what would happen when a user touched certain elements in Toronto @ Nite.

High-Level Processes

Experience Design, Visual Design, Motion Design

Next Project

Stealth Trip