Study Buddy

Dedicated mobile app and responsive web app design
February - March 2022
‍
Figma, pen and paper

Objective

Design an app that is engaging, useful, and easy to use that helps adult learners maintain a positive outlook on achieving their goals.

Solution

Study Buddy is a tool to help adult learners stay motivated in their academic studies. Study Buddy's primary target users are those working towards their GED who want to stay focused, engaged, and encouraged during the process.

My role

This is a student project for my Google UX Design Specialization program. As the sole UX designer, I conducted user research, created paper and digital wireframes, created low and high fidelity prototypes, conducted usability studies, iterated on designs, determined information architecture, and created a responsive design.

I conducted user interviews with active GED students at an adult education program in our community and created empathy maps to better understand the users and their needs. Research showed that users would benefit most from a tool that helps them stay motivated in their studies.

Research also revealed that users saw pursuing their GEDs as an opportunity to improve their self-confidence, to develop their independence and sense of belonging in their society, and to identify a strong support system while they were enrolled in their program (whether on or off campus).

Research

Research summary
Research interview questions
Pain points
Personas
User journeys
Competitive audit
Crazy Eights

Research interview questions and participant quotes

1. Can you describe your current schedule and how you balance your responsibilities with recreational events?

2. Why did you choose to continue your education when you did?

3. How did you learn about the program you are attending currently?
- Why did you choose to come to this specific program?
‍
4. How often do you attend class at the center, whether in person or virtually?
- When you do, what is your motivation for doing so?

5. Walk me through an early memory at the center, starting from when you made the decision to go.
- How did the experience from being on campus affect you after you left campus?

6. How do you access information about school or your classes?

7. What challenges do you face when maintaining your class or study schedule?

8. Is there any way in which you feel these challenges could be resolved?

"Balancing out going to school, going to work, taking care of family, it's rough...you're working your mind all the time...Sometimes we want to take on all that responsibility and everything, and sometimes we need that support, that release."

- Participant

"It took me a couple of months to get the courage to sign up and take the test because I had done it before."

- Participant

"I don't want to feel like I let anybody down."

- Participant

Support

Users want support on and off campus having recognized their physical and mental drain from being an adult learner.

Focus

Users want to be able to stay on track with their studies and finish their program with minimal interruptions.

Self-motivation

Users want help staying intrinsically motivated and in a positive mindset while striving to obtain their goals.

Competitive audit

I reviewed four competitors' products for guidance and to identify opportunities.

Click below to view my audit spreadsheet notes and my audit report.

Audit spreadsheet Audit report

Image of page from Providers' mobile app

Image of the homepage for Careeronestop's mobile app

Image of a page for UNICEF's Learning Passport's app

Image of part of Crazy Eights exercise for Lora's problem statement

Image of part of Crazy Eights exercise for Leo's problem statement

For Lora, I wanted a minimal layout that'd be easy to use for a low/no-tech user and considered a goal-setting feature and a study-rest interval feature with a timer.

For Leo, I considered incorporating regular positive affirmations, a daily check-in feature, and a brain-break library with meditation resources.

Starting the design

Information architecture
Paper wireframes
Digital wireframes
Low-fidelity prototype
Usability study

I completed a card-sorting activity for two rounds with a user to organize features for the dedicated mobile app in a hierarchical layout. The final IA is a result of blending our two visions of the app. More adjustments were made, and the elements highlighted in blue below were included in the low-fidelity and high-fidelity prototypes.
‍
I sketched paper wireframes for a homepage, a goals page, and a check-in feature.

I then made digital wireframes for Study Buddy and conducted a moderated usability study with five users from the adult education program. I focused on guiding a user through a check-in process and reviewing information on the homepage and on the goals page.

Low-fidelity prototype

The low-fidelity prototype connected the primary user flows of completing a daily check-in and reviewing/adding to the user's goals.

Low-fidelity prototype

Affinity map

Affinity map from first usability study

Usability study insights

Users felt like it was important to have their goals prominent and easy to access. They also appreciated the use of notifications for daily check-ins and alarms. Some users didn't feel that the look was their style. Some felt bombarded by the number of elements in the layout. A user who is an intermediate English language user had an overall difficult and unpleasant experience with the app. They were frustrated with the lack of navigational cues/instructions.

Refining the design

Mockups
High-fidelity prototype

Based on the insights from the usability study, I adjusted the designs.

Initially when considering accessibility, I limited the number of features and included a welcome tutorial to help those who are low-/no-tech users. I also included text labels with icons to clarify their functions, and I included multimedia options to record one's responses in the check-in feature.

Color adjustment

I originally tried a bolder color scheme. However, the tone didn't give some users a calming effect, so I softened the colors and have since received positive feedback.

Image of color scheme adjustment in mockups

Homepage

I simplified the layout and added a footer icon to more easily access the teacher.

Check-in feature

I moved the navigation cues beneath the responses of the current question for better visibility. I also added an icon in the footer so that the user always had access to check-in no matter where in the app.

Goals page

I removed the "Favorite Brain Breaks" due to a lack of relevance. I moved the month section next to the day's section per users' suggestion, and to emphasize short- and long-term goal-setting.

Image of comparison of check-in feature's wireframe and mockup

Image of comparison of goal page's wireframe and mockup

High-fidelity prototype

The high-fidelity prototype followed the same user flow as the low-fidelity prototype, including design changes made after the usability study.

High-fidelity prototype

I started work on designing the responsive website. I used a sitemap to guide the organizational structure of each screen's design to ensure a cohesive and consistent experience across devices.

The designs for screen size variation included mobile, tablet, and desktop versions. I adjusted the designs to fit specific user needs of each device and screen size.

Responsive design

Sitemap
Responsive design

Low-fidelity protoypes

Click below to view each of low-fidelity prototypes for Study Buddy's mobile, tablet, and desktop web app designs.

Mobile web app lo-fi prototype Tablet web app lo-fi prototype Desktop web app lo-fi prototype

Image of the low-fidelity prototype of the responsive web app for a tablet

Responsive web app mockups

I designed the pages for the homepage and check-in feature across three devices (mobile, tablet, and desktop).

High-fidelity prototypes

Click below to view each of high-fidelity prototypes for Study Buddy's mobile, tablet, and desktop web app designs.

Mobile web app hi-fi prototype Tablet web app hi-fi prototype Desktop web app hi-fi prototype

Image of high-fidelity prototype of the desktop web app

Moving forward, I plan to edit all features across all devices to be easier to use for users whose primary language isn't English and for those new to using technology. I also will incorporate additional notifications (such as positive affirmations and alarms for upcoming events) and gamification into the Achievements feature. I will then conduct another round of usability studies with new research questions that focus on the appeal of the app's features to users.

Going forward

Next steps
Takeaways

Takeaways

Thank you for reviewing my work on this mobile app design!
‍
Despite how private one's self-empowerment journey can be, adult learners exhibit a need for a social connection to share their successes and hardships while working towards a long-term goal. They also exhibit a need for continuous positive encouragement reminding them of their capabilities.

During this project, I've considered how a design can make an adult user feel like their input is valid. I've reflected on the use of copy and how the tone and word choice can make a user feel welcome to the app's space and capable of utilizing its features with minimal prior knowledge.

I've learned how to adjust the ultimate purpose of the app if necessary to better fit the users' needs and how the research questions are directly connected with identifying the aim of the tool I'm designing. I've also recognized when I'm thinking about the end user and their primary use of the app and when I'm thinking about the secondary gain for the stakeholder (such as program retention and subsequent funding for an adult education program). When I kept the end user's potential gains exclusively in mind, the design came out more consistent, clearer in tone, and more approachable.