New2Van iOS App -
Helping newcomers to Vancouver

 

Download a short PDF version here.

This is a case study about an iOS app concept for newcomers to Vancouver called New2Van created as a capstone project during my 10-week UX Design program from Juuly to September 2016 at RED Academy in Vancouver, BC.
My process included conducting interviews and online surveys, creating a persona and user flow, low-fidelity wireframes and a paper prototype, and finally, a clickable mid-fidelity prototype. The deliverables were created using Sketch and InVision.

 

1. The Opportunity

The assignment was to create an app or website that touches on the topic:

How can we make Vancouver a better place?

Problem
Since I just came to Vancouver a few weeks before it was hard for me to know about any problems or pain points people might have here. But as someone new to this city, I felt a little lost when I was looking for information. Whether it was how to find a place to live, get a job or meet new people, I did not know where to start. That’s why I decided to create an iOS app for newcomers to Vancouver so that they can find all relevant information in one place to speed up their settlement process.

 

2. Project goals

  • Provide a seamless, elegant and easy-to-use app for newcomers to Vancouver
  • Provide users with information on housing, job search, and anything else they need to know about the city
  • Make settlement process easy for newcomers of all levels; from students to permanent residents
  • Allow people to connect to others that recently moved to Vancouver, as well as create a community within the platform

 

3. Research

Competitors analysis
I started my research by checking websites/applications already available on the market.
The most popular websites and apps include: Moving2Canada, WelcomeBC, Tourism Vancouver, Hello BC and Meetup.

Surveys and interviews
I conducted 5 in-person interviews and received 5 responses to my online survey. 

new2van survey

4. Persona

Based on the research data gathered, I created the following persona:

new2van persona

5. Planning

5.1 Use cases

“As someone new to this city, I feel lost when looking for information on how to get started here, how to find a place to live, get a job or meet new people.”

“As a user, I want to easily browse available information in a central repository so that it takes less time.”

“As someone who values efficiency, I want the options to be easy to read and browse, so that I can review on the go.”


5.2 MVP and Feature List

First step: affinity diagram of features sorted into Quick wins, Major projects, Fill-ins & Reconsider.

Second step: sorting each pile into Must have, Nice to have & Not needed for now.

new2van-mvp-feature-list

6. User Flow

I developed the user flow to improve the understanding of my users’ needs and to create a user-centered application.

new2van_user_flow

7. Design


7.1 Design strategy
  • Simple and fast navigation
  • Clean UI
  • Straightforward visuals and recognizable icons
  • The process of inputting the necessary data as simple and user-friendly as possible

7.2 Design Goals

Create an app that accomplishes the following:

  • Easy browsing of information and resources
  • Guidelines on what to do first to get started and get settled
  • Provide a platform where they can connect with fellow newcomers

7.3 Wireframes and Paper Prototypes

To develop one cohesive vision of how New2Van was going to look, I created wireframes and tested them as paper prototypes on my fellow students.

Below are the quick sketches of my first concept development. The screens show the user onboarding process of the app.

My prototype from paper to hi-fidelity

new2van-wireframes-main
new2van-prototype-v1
new2van-prototype-v2



7.4 Invision Prototype

Experience the live prototype here: invis.io/WX8CZBWY3

 
8. Usability Testing

8.1 Scope

I was testing one specific user flow for the New2Van app. The “Resources” feature allows the user to find different sources to relevant information on a specific topic.

8.2 Goals

The key point is that the user understands the navigation since the app has a minimalist design.


8.3 Scenario

The user is looking for job. She is using the New2Van app trying to find a website or app where she can find job listings.

Tasks

  • Access the app
  • Sign into your profile
  • Find a job listing website or app

8.4 Findings

After testing the prototype with several people I realized that there were a few spots in the app that needed optimizing.

Log In Screen
I decided to put less emphasis on the “Sign In” option since the goal was to get users to create a profile and go through the onboarding process. 

Info screen after profile creation
immediate feedback
used iOS HUD system elements for personalisation

Start screen of guide section
changed segmented control on top to navigation at the bottom
used iOS system elements for steps

During the user research process, I was genuinely surprised to see how many users completely ignored the hamburger menu. It was not as obvious of an affordance as I thought, so I converted it to text-based icons. This tested to be much more effective with users.
Some users wanted to click on screens that are only meant to display information for a short period of time to give the user feedback, like “You've successfully signed in”. 

 
9. Summary and Reflection on the process / The Recap

Research and usability testing are in my opinion the most important parts of creating an awesome user experience.
While the whole project was a huge learning experience, I especially loved doing research, iterating on designs and testing those new designs on users. This tight feedback loop helped take ambiguity out of my designs, and it felt good to produce designs with the confidence that users would enjoy and understand it.

"Some students stand out amongst their peers for their immediate aptitude and understanding of a medium. Christina fits into that category.
She has an Intrinsic understanding of how people interact with technology that was clearly represented through the project she undertook at RED Academy.
The thinking behind her design decisions was well rationalized, and feedback was taken enthusiastically, with ego removed, with the understanding that it was towards building a better end product.

I'm looking forward to seeing her grow within this industry, and I hope we get the chance to build something together in the future."

Stefan Rauch - UX Instructor at RED Academy

Selected Work

InstaJamUX Design

New2VanUX Design

Lotto BerlinUX / Interaction / Visual Design

QiagenUX / Visual Design

Contact me