DABRA

A mobile app that helps undergraduate university students get the experience they need to be a successful graduate in their field.

 

 

 

 

Project Overview

This Capstone Project was one that came with a few notables in order to complete it within a 10-week timeframe.

Role

UX Designer

Tools

InVision, POP, Sketch, Figma
 

Time Frame

10- weeks
 

Constraints

  • Native app of choice, IOS

  •  Time frame of 10 weeks from discover + research to handoff

  • Fully Remote

The Design Process

The “Double Diamond” strategy helps bring structures to the problem-solution cycle, making it easier to define problem and identify solutions. I interviews some users and created user persona to understand understand the problem first and then create a problem statement to target the solution.

Screen%20Shot%202020-10-23%20at%208.22_e

Discovering the Problem Space

After conducting a thorough secondary research plan, the following areas of the problem space in Canada’s post secondary system were discovered.

Current State:

• Students are unprepared for post-graduation life, with record high debt, and a lack of job acquisition expertise (i.e. resume building)

Future State:

  • To have students be aware of their work placement opportunities and strengthen their job acquisition skills

Validation Through Research

Noted below are some key findings for this problem space

BANKRUPTCY

“Students from 2009/10 still  report at least 25% debt with  1 and 6 Canadians reporting  bankruptcy.”

-Statistics Canada

ACADEMIC STRESS

“More students are dropping  out annually due to feeling  academically unprepared along with

financial hardships”

-yearone.com

GENERATIONAL DEBT

“Most Americans with student debt are young. But  adults 60 and older — who either struggled to pay  off their own loans or took on debt for their children  or grandchildren — are the fastest-growing age  cohort among student loan borrowers”

-NBC News

Market Competitors

 

Market Current State

While elements of the proposed solution are  found in other applications, such as those  outlined to the side, there is no one  application that targets students and  streamlines all proposed services into one  solution.

Competitors

Mint App – Budgeting app, not specific for students/tuition

Banking Videos – Financial product (i.e.  school loans) explanation videos provided by  banks

University Apps – Directly correlates to the  school at hand, but rarely, if ever, offers  resume building, tuition breakdown,  budgeting

Resume Building Websites – Teaches resume  building and application skills

grantme.com – Informs students of  scholarship opportunities

Research

Research Objectives

  • To prove my assumptions  to be true or untrue

  • To understand a student’s  pain points and view  opportunities for a  potential solution

  • To view if my hypothesis  can be proven true or  untrue

Research Methods

•Virtual User Interviews
•Recruitment Method-  Network through  connections and phone call
•Schedule of Interviews:  Tuesday September 1, 2020; interviews 
from 7pm-11:45pm

 

Participant Criteria

•Undergraduate student;  ages 17-23
•Ontario, Canada
•Currently enrolled as a full
time student
•Has completed a minimum  of one full semester
•Can be interviewed via  zoom or phone call
•Able to schedule 20-30  minutes for interview

Interview Summary

All students interviewed met the research criteria and had  expressed explicit pain points  as a full time student  attending a post secondary  institution with feedback for  their experience outside the  classroom

There exist many areas of improvement for the student experience, ranging from unanswered finance questions to how to gain  experience in their field.

Despite all the lack of  knowledge, students still believe that university is the best way for them to achieve success.

How might we, help university students prepare for a career path after they graduate?

Screen Shot 2020-10-23 at 9.16.12 PM.png  

 

 

We can view the experience from touch points to emotions that our persona Zara would feel as she navigates through applying for a coop position with no additional resources from her institution.

Screen Shot 2020-10-23 at 9.20.15 PM.png

Establishing Epics from User Stories

 

In order to establish what tasks a user like Zara would find the most value in for this app, user stories of what she would hope to accomplish were created. Once all possible options were noted, they were then grouped into categories called “Epics” to decipher between which choices would add the best value to her.

Screen%20Shot%202020-10-23%20at%209.28_e

Identifying the Key Epic-  Obtaining Professional  Development  Resources

It was made clear in our secondary  research, interviews and user stories  that two pain points someone like Zara  were the frustration of understanding  how to be successful in her career and  what steps were available to her to help  get her there.

 

This became the focal point to adhere to  in the next phase of the design process  and provided direction when going into  the ideation phase.

Establishing A Core Task Flow

Now that the app had a task focus, the knowledge obtained from all research was then used to create a primary task flow. 

This task flow demonstrates two different user stories from the Epic “Professional Development”: getting Online Resume  resources, and Interview Feedback; the assumption that the student has already established a profile and has logged in to  land on the co-op board page is in effect.

 

 

Screen Shot 2020-10-23 at 9.32.55 PM.png

A Notable Pivot

 

The next step in the design process was to sketch out ideas and possible lo fi screens for the app. Techniques to quickly churn ideas were used to initiate the thought process such as “crazy eight’s” sketching. Once possible solutions were mapped out, a resume task flow was not going to be a sustainable task on an app. Therefore the task flow required an adjustment.

Sketches & Ideation

The next steps in the design process were to sketch out all possible ideas and to then create digital prototypes to test on users. After three rounds of testing and iterations after each round based on prioritized feedback with various users, the prototype was taken from a lo fi concept to a higher scaled mid fi in order to infuse branding with colors and illustrations.

Exceptional Achievement

Crazy 8 sketching for possible product ideas

crazy8spic.png

Perfect Execute

Primary task flow for selecting a co-op

taksflowpic.png

Version 1 to Version 2 Prototype

The most important take away from user testing  round one, was the pivot the design’s tasks and  identity of the app took.

The app was meant to educate students about  financial literacy whilst simultaneously

assist with helping students track and manage  coop experiences. This was identified as too  broad and diluted the solution that the app could  have focused on.

Crucial elements such as confusion with icons and the

navigation bar were the first symbols to be redesigned

 

 

Screen Shot 2020-10-23 at 9.51.01 PM.png

Version 2 to Version 3 Prototype

As demonstrated in the images, a visual  familiarity and a refined UI by Apple  standards was taken into account for the  next iteration.

 

Since the concept of the app with its  tasks was now well received, with a 100%  success rate, the next focus for this  prototype was then to refine the UI  elements.

All pages were grid aligned, all  icons were resized to appropriately fitthe  pages and cards they were placed on and  upon request, all hotspots or navigation  prompts were made larger, and clickable.

 

 

Screen Shot 2020-10-23 at 9.51.18 PM.png

 

 

Visual Identity & Brand

Our first step was to gain inspiration for the  feeling of this app. What did we want a user to  experience? What did we want our app to say?

We took some out of the box methods in  creating some inspiration and finding key  areas of excitement and encouragement to  draw from. If you look closely, some of the  main areas of inspiration were taken from  some childhood classics.

We want our app to be described as:

•Inspiring

•Encouraging

•Helpful

•And mostly, useful

Iteration to branding

Once the concept and direction had been decieded,  it was time to start building a brand. The first step  was to think of what was important within the  communication of this app.
•What did we want this app to say?
•How did we want to ensure user’s felt when  exploring it?
•What value can we add to an undergraduate  student?
•What DON’T we want to include?

Defining the brand-more A than B

At this point of the iteration process, we did not want to be like any other app experience. We brainstormed the brand’s best values

WE WANT OUR APP TO BE

•More creative
•More personalized
•More inviting
•More helpful

WE DON’T WANT OUR APP TO BE

•More formal
•Less encouraging of  individuality
•Less focused on current  students
•Less seniority focused  for jobs

Word Mark and Brand Naming

 
 
With all the inspiration and hues of purples and reds, we wanted to ensure our app brought a little  magic to our students. Toying with names like “Abra-Cadabra”, “Cadabra”, “Abra”, “Pocus”, we finally  found a name that would be simple, striking and carrying out our message to always have inspiration

The emerge of DABRA

Here from left to right, from initial sketches to iterations of a word mark, we ran  with our new name.

Screen Shot 2020-10-23 at 10.48.38 PM.pn

UI Inspiration board

 

We also took to other apps with minimalistic  layouts, such as wealth simple for an ease of  onboarding in their process, as well as various  card component designs from dribble to  enhance our prototype to ideate a modern,  minimalistic and inviting experience for a busy  student.

 

 

UI Elements

Here we are going to start with app specific features that would ideally be great sources of inspiration and components to use within the app. The colors chosen are to strategically be placed throughout various components of the app. Ideally, accents of red and texts of purple will be demonstrated to continue the values of excitement.

 

 

Screen Shot 2020-10-23 at 10.51.50 PM.pn

 

Here is the continuation of the mood we are going for with Dabra, instead of a corporate blue, we want to take inspiration with an accent of red and purples, to continue the theme of creativity and whimsy.

Student struggles

Here, a huge inspiration for me was the foundational gaps students in their undergraduate degree face. Sometimes, they feel abandoned, like Zara, when she realizes she will need to gain experience on her own before she graduates

Screen Shot 2020-10-23 at 10.54.12 PM.pn

HiFi Prototype

Now with a color palette, brand, and minimalistic  focus in mind, we set out to create our hi fi  prototype.
We designed it specifically for students like Zara  in mind, who are frustrated and we wanted to be  a great difference in a student’s experience  compared to a platform like LinkedIn. Our aim is  to be engaging, not corporate.

 

Responsive Marketing

 

 

 

Once versions one and two of the marketing site for both mobile and desktop were sketched, they were tested on three users and iterated on each time from prioritized feedback received.

 

see the full screen here

 

Our first step in creating brand awareness with our product was extracting inspiration from our product, what elements we wanted to still communicate, and further challenging ourselves to find additional inspiration.

 

 

see Dabra marketing mood and UI board here

 

 

dabramarketingsitedesktop.png

 

Next Steps

 

I don’t think this app would cause anyone to lose their job. If anything I think this digital solution would be an avenue for recruiters to focus on undergraduate candidates who are not treated as their own category.

I believe this product would replace LinkedIn for students searching for coop positions as this would be a tool that they can have personalized to them in order to tailor their job results to further develop their desired career path. 

In a longer term of this product’s existence, I believe that this would be an industry disruptor for companies to create separate hiring policies and procedures specific to handling candidates in an undergraduate program

Tarrot Cards of Tech

Screen Shot 2020-10-23 at 11.13.27 PM.pn

Multidevice Investigation

Since an electronic ecosystem is a standard for users like Zara, the next design step would be to create Dabra’s experience on an iPad for her to be able to use during her commute to university or otherwise on the go.

Tablet

Key Learning

 

Over a 10 week experience, I was able to learn and apply design principles from ideation to completed hi fidelity design prototyping. There were many key takeaways and lessons, along with the vast amount of knowledge and understandings I can reflect on. A few notable ones would be ;

“Embrace the ambiguity of the design process.”- Sometimes when there are assumptions and biases that are not discarded immediately, a viable solution won’t be able to emerge throughout the design process. 

I also learned that design is about rationale, strategies and tools to help a creator navigate through steps so that they are able to better create for their users in mind. This has definitely expanded my way of thinking as well as inspired me to take the initiative to design and continue to iterate solutions that can help problem spaces I am passionate about.