'Handy' is an accessibility application that I designed for students studying at Thomas Jefferson University- east falls campus. The application aimed at designing a seamless connection between the students and the accessibility office on campus. 

Handy: Accessibility application

User Persona - Emily James, Student

Motivations

Research phase

The application is designed for students with mental disabilities such as anxiety, depression, stress .etc. to connect with the accessibility office, talk to advisors in case of emergencies and also track their daily mood. 

We conducted interviews with:

-The Office of Accessibility 

-University Dean 

-Academic Success Center 

-Undergraduate and graduate students

 

Emily is a kind, determined and intelligent student studying architecture design at TJU. She loves to make friends, socialise and get to learn from different people. 

Due to this, Emily gets pulled back not only while socialising but also while studying. Emily
The only thing holding Emily back is stress and panic attacks
 and needs some help from the office of accessibility, but she is too shy to visit the office 
struggles.

  • To feel less moody and study better. 

  • To talk to someone about her issues 

  • To get help and guidance on how to deal with her problems

  • Collaborative communication 

  • Help from friends and family 

  • Privacy 

  • Is unaware of whom to approach on campus in case of emergency  

  • Hates people knowing about her issues 

  • Can’t open up to people

Goals

Frustrations

Sorting our ideas:

Based on our interviews, my team and I noted down all the information we gathered to decide what we issue did we want to address individually. 

We were making 'cupcakes': a small but 'to the point' application catering to the needs of one segment of our users amongst all the students on campus. 

-Collaborative communication

-Personal assistance

My cupcake focused on:

-Connect with students

-Help students with mental disabilities

'Handy' would be used by two types of users:

-Students

-Office of Accessibility

 

In order to understand the needs of our target audience i.e students, it is also necessary to know the expectations of the advisors at the accessibility office. To exemplify this, we built an empathy map for the advisors at the office of accessibility.

The empathy map focuses on what the user feels, sees, hears, says & does as well as the pains and gains he/she goes through. The main concern of the advisors was a communication gap between the students and the office; due to which students were unaware of the facilities available and the help that can be offered to them. 

Meet Jen Lewis, an advisor at the office of accessibility:

Empathy map:

Storyboard:

The following storyboard aims at convincing the need of the 'Handy' application. The story revolves around Emily, a student at TJU who suffers from panic attacks. 

How can we help her?

The HOOK's model:

In order to make the application more engaging, I incorporated the HOOK's model - Trigger- Action- Reward- Investment.

HOOK's model helps you understand what triggers a user to perform a specific activity and how he/she can be rewarded and invested in the application.  

Emily fills out her daily mood chart

User flow: How would the HOOK's model work?

TRIGGER

ACTION

REWARD

INVESTMENT

Emily gains coins every time she fills a mood chart
 

Emily feels she had a bad day and needs to let her advisor know

Emily logs in to her profile

Emily shares the mood chart with her advisor and requests an appointment 

Emily checks the number of coins she has gained till now

Emily visits the book store, scans the QR code in the app and checks how much of a discount can she avail.

The Reward factor:

So how would the reward factor work for 'Handy'? 

The application consists of 'daily mood charts' that a user needs to fill out to notify the accessibility office of their mood.

In order to motivate the student to do so, I decided to gamify this experience. Every time a student submits a mood chart, he/she would gain 'x' amount of points on their campus card which can be availed as discounts while purchasing items at the university bookstore. 

Site-map

Following is the sitemap of the entire application. It is a combination of matrix and hierarchical map design: 

Low-fidelity wireframes:

To get a rough idea of how the application would look, I created wireframes for the following pages:

-Log in 

-My profile 

-Mood boards

-Calendar and reminders 

-Rewards 

High-fidelity wireframes:

Before starting with the development of the application, I created a few mockups- high fidelity wireframes, to get a better idea of how my screens would look.

To create appealing visuals, I created a mood board comprising of colour palettes and images that I could relate to the most while designing this application. 

For an inspiration, I chose five words.

A student at TJU should be: 

-Peaceful

-Focused 

-Energetic

-Active 

-Positive 

 

 

Mood board design:

The app logo depicts a 'handshake'. I designed this logo to portray that the accessibility office is available and ready to help the students with any and every problem that they struggle with. 

Development:

For the prototype of the applications, I used the following languages to code it out:

-Html

-CSS

-Bootstrap

-Javascript

Jquery UI 

Google charts API

Here's a video of the prototype coded using the above languages:

This site was designed with the
.com
website builder. Create your website today.
Start Now