Keep It Up

keep it up website mockup

Role

UX/UI designer leading the Keep It Up website design

Responsibilities

Conducting research, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs, and responsive design.

Timeline

Feb 2022

Tool

Adobe XD

Overview

Keep It Up is an innovative online tutoring platform that caters to the learning needs of individuals aged 14 to 45. Our website offers a unique opportunity for learners to connect with study partners, form study groups, and participate in live tutoring sessions.

The Problem

Users are looking for an improved study partner search experience and want to minimize distractions during video conferencing sessions.

The Goal

To address these concerns, we have developed a system that allows users to find study partners based on their interests and preferences. Additionally, users can create personalized study rooms with desired features.

User Research Summary

During our competitor audit for online tutoring services, we observed that traditional platforms offer a wide range of resources, while popular live tutoring platforms have a larger user base. Through usability testing and user feedback, we discovered that studying with a study partner enhances productivity. However, the online environment often becomes a social platform, forcing users to leave and find alternative solutions. To distinguish our study rooms from social platforms, we have implemented certain features and limitations. These include access to tutoring services, ample resources, and the availability of productive study partners.

Pain Points

1.

It is challenging to maintain focus on my studies because I constantly find myself looking at the screen to check on other users' behavior.

2.

The users in the same online study room are receiving different levels of education, which can create disparities in learning experiences.

3.

I often wait endlessly for a response after sending a request to find a study partner.

keep it up persona

Problem Statement

Travis is a high school student who needs an online study partner who can help each other in studying because he needs to reduce procrastination and focus on his academic goals.

Empathy Map

An empathy map to help identify the thoughts and feelings of Travis when using an online study partner website.

Thinks

I have to focus on studying since everyone on the same server can watch what I'm doing.

Too many people on the server sometimes makes it difficult to stay focused.

Says

It’s good that you can create a study group or invite friends to join you.

The public server has too many users online which is quite distracting.

Does

Choose and join a server, write down my goal, set a timer, and start learning.

Take a look at the screen occasionally to see how others are doing.

Feels

Feel productive when you study for hours.

Need to be careful about showing something private on the camera.

Frustrated at no one can help you with the academic questions.

keep it up user journey map

Affinity Map

keep it up affinity map
keep it up competitive audit
keep it up competitive audit

Sitemap

To create a site map, I analyzed the users' needs and categorized them accordingly. The main navigation consists of five links, each with a dropdown menu for subcategories.

keep it up website site map
keep it up paper wireframe
keep it up paper wireframe

Paper Wireframes

I have designed multiple versions of the home page and marked the relevant elements with a star. The final version of the home page is displayed on the right.

Digital Wireframe

keep it up digital wireframe

My main focus in this stage is the size of the elements. I'm using negative space to reduce visual overload. Above the fold, I have included a brief description, a call-to-action button, and a screenshot of the user dashboard.

Usability Study: Parameters & Findings

Study Type:

Unmoderated Usability Study

Location:

Online

Participants:

5 Participants

Length:

30-60 Minutes

1 // Motivation

To keep users motivated in their studies, I have included badges, leaderboards, and awards.

2 // Privacy

Users also have the option to create a password-protected room.

3 // User Behavior

If a user is behaving inappropriately, other users can report this to the server.

Mockups

keep it up mockup

Based on the insights from the usability study, I decided to remove the navigation and footer, and instead added a leaderboard feature to encourage users to spend more time studying.

keep it up mockup

Based on the insights from the usability study, I have emphasized the subtitle feature to assist users with hearing impairment. I also renamed the chat box as the Question Board to encourage users to ask questions related to the subject.

Screen Size Variations

To ensure a smooth user experience across different devices, I have optimized the website layout for tablet and mobile views to ensure responsiveness.

keep it up mockup

Users can now easily discover the most suitable study partners by providing their preferences through a form. Once they sign in, they can send invitations to connect with these potential study partners. This process significantly simplifies the user experience in finding and establishing connections with study partners.

keep it up high fidelity screenshot

Style Guide

keep it up style guide

Accessibility

1

All users have access to audio, video, and chat features.

2

I have implemented landmarks to facilitate easy navigation on the website.

3

Users can find accessibility adjustment settings in their account settings.

Impact

I understand that studying alone can lead to procrastination, but seeing others study hard can be a great source of motivation. That's why it is crucial to create a distraction-free online environment for users who are committed to continuous learning.

Having study partners can be beneficial for setting goals, addressing challenges, and making informed decisions about future careers. It is especially important to ensure inclusivity for users who rely on assistive technology while studying online.