'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
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
-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
Help from friends and family
Is unaware of whom to approach on campus in case of emergency
Hates people knowing about her issues
Can’t open up to people
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.
My cupcake focused on:
-Connect with students
-Help students with mental disabilities
'Handy' would be used by two types of users:
-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:
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?
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.
Following is the sitemap of the entire application. It is a combination of matrix and hierarchical map design:
To get a rough idea of how the application would look, I created wireframes for the following pages:
-Calendar and reminders
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:
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.
For the prototype of the applications, I used the following languages to code it out:
Google charts API