U-Plan, UX Design Case Study

What is U-Plan?

My main reason for creating this app mock-up was mainly out of frustration, of not being aware of events around town and finding out about them long after they were over, or on the same day the event is scheduled to take place. Toronto is an extremely busy city, with several regions outside the GTA (Greater Toronto Area), therefore it can be difficult to travel to various locations without notice, planning, and accurate information.

Several factors are considered by most, if not all residents of this city when they are deciding whether or not to attend an event, including commute time (via public transport, or driving), parking, ticket cost/if there is a ticket, and believe it or not, the weather too.

This App is your one-stop portal to all events in your city (my city is Toronto, of course).

Features included:

Auto detect location

Select date/multiple dates

Apply category filters- Sports, Music, Family, Kids etc.

View event information- where to purchase ticket (website address), location, parking information, date, time, other miscellaneous information

Color-coded calendar, where each color represents a category

Research Findings:

Luckily, I discovered at a very early stage of planning that I wasn’t the only one who dealt with the frustration of having little to no information on events beforehand.

Several people that I interviewed felt the same way, and also noted that when they see pages, infographics, and advertisements on Social Media, they tend to ignore them and not pay attention.

Others admitted to not being able to find the information later when they look for it using the scroll option on their various Social Media apps.

Finally, many people expressed their frustration and disappointment in other websites that showed outdated information and after visiting multiple websites, would they find what details they were searching for.

— Results below are obtained from 11 people that took the Survey —

[ Snippets of the Survey, created using Typeform ]

When it comes to being aware about events in the city, where do you stand?
I would like to know more about what’s going on in the city beforehand rather than finding out much later
I would be interested in…

How do you keep yourself up to date?

Does it take effort to constantly keep track of what is coming up and when?
Moving On…

STATISTICS

Out of 15 in-person interviews…

87% said they visit multiple websites and apps to figure out what to do

73% said they ignored events and ads they saw in their email or social media

87% would prefer a platform that would act as a News App, but with Events instead, and would list multiple categories

20% appeared uninterested

80% admitted to being disappointed and irritated upon hearing of things when they have already occurred. (missed Color Runs, etc)

Personas

The next step of the design process was to develop personas, or ideal individuals that would be likely to use an app like U-Plan. The results of the survey, both on typeform and via interview and casual conversation, are used to curate these personas.

Shay
Shay Smith

Her story in a nutshell: Loves to stay active and enjoys the outdoors but unfortunately cannot find much to do and finds it difficult to coordinate meetups with people.

Andrew
Andrew John

His story in a nutshell: Andrew has more commitments than time. He wants to make time for both friends and family on the weekends, and being an Elementary School teacher, he doesn’t want to be in locations where he only sees kids on the weekend. Also a big foodie.

User Flow

Initially when mapping out the App and figuring out what steps the user should take, lead me to a complicated user flow. Although this chart above does not look complex, it involves additional steps that can and should easily be eliminated. Only after completing a few usability testing cycles was I able to determine what steps to avoid, or simplify.

For example, the location option could be simplified to allowing the user to input their location, and disqualifying options such as ‘switch on location services’. Instead, the user, assuming they are familiar with an iPhone would know how to type, and be aware enough to know where they want to attend an event(s).

Wireframes

These wireframes represent the foundation, or the infrastructure of the App. They can also be referred to as ‘Low-Fidelity Prototypes’ as they can be turned into a clickable prototype using a tool such as Invision.

Naturally, when working up the fidelity scale and slowly introducing color and images into the app design, changes can occur. Some designs won’t appear as being very visually appealing if the graphics and buttons look too close together, or maybe just a little tweak in color will fix the appearance.

Mid-Fidelity Prototype A:

When I submitted this prototype to usability testing, the recurring critique that I received was that my app doesn’t have an option to jump back to the beginning (search page) from what ever page the user is on. I am basically forcing the user down one path. A quick fix for this would be to enter a home button, or a menu such as a hamburger menu with a few options, Home being one of them.

Other comments I received:

change color scheme, opt away from using vivid colors.

Photos on the home page appear to be clickable, but are not

Add in more navigation buttons

Add labels and text to guide user

Mid-Fidelity Prototype B:

Results

Although this prototype was identified as being more visually appealing and not a strain to look at, there were obviously major faults and missing pieces, all that are vital to include in this app, any app.

Options to add in the future:

●Add a Share feature

●Sign in option

●Integrate ticket provider websites, eg. Ticketmaster, Stubhub

●Push notifications for reminders/change of info notices

Click link below to view Invision prototype:

A single golf clap? Or a long standing ovation?

By clapping more or less, you can signal to us which stories really stand out.