Prepsmith

My role

UI Visual Design, UX Design, User Research

Beginning at early 2014, I was the UI/UX Designer who helped create the Prepsmith platform. I worked with our project manager to define the initial feature set. Based on our findings from targeted users, I designed the UI of the platform and crafted experiences that fulfills users’ needs.

Overview

Prepsmith is an adaptive learning system in New Pathway Education that prepares student for standardized exams like SAT, ACT, TOEFL, and IELTS. The system helps students by specifically identify and target areas that can help them most improve, while serves as a helpful companion for teachers to engage with individual students.

Goal

In a traditional classroom environment, students often determines their performance by a single score. It is often difficult and time consuming for students to find out where they can improve their work. Prepsmith’s mission is to help students increase their test performance by finding their weaknesses.

Process

Phase 1: THINK

Research

I teamed up with product manager to understand students’ study behavior in New Pathway.

We started interviewing eight students each from different classes and we have summarized their most common pain points when studying. From the pain points, we found areas that could improve student’s experience:

1. Overall score progress over the course

2. Exam scores do not reflect how I can improve

3. Coursework sometimes are too easy (wasting time)

4. Want to know the scores right upon completing an exam (Typically takes 2-3 days to be graded)

5. Exam questions often have grading mistakes (exams were hand graded by teachers or TAs)

6. Carrying homework books and textbooks is a hassle

Define Solutions

From the interviews and surveys, we came up with a few core features for our initial release:

• A Dashboard to show progress and areas students need help on.

• Take and review mock exams.

• Adaptive quizzes

User Flow

I started mapping out what a student would go through on the system, this helps the team to understand what other features are needed and how are the core features come together as a product.

Different user journeys were created based on different use cases. Such as:

• I need to take a mock exam.

• I need to find my scores on the exam that I just finished

• I need more practice on my weakness areas…

 Phase 2: CREATE

Wireframes to Prototypes

I started with a sitemap to get a clear idea of the pages I needed to create wireframe. The sitemap also helped engineering team to plan building to back-end of the system.

I want to rapidly convert our solutions into prototype for testing. I used Balsamiq Mockups to create my wireframes, which are also detailed enough to use for prototype. I then exported my design to an interactive file with links to different pages.

Testing and Refine

We spent a weeks holding testing cycles, where in each cycle we invited small amount of students and stakeholders to try out the prototypes. We collected the suggestions and iterate the designs and test against a new group of test users.

Applying UI and Development

Once the prototype has been polished, product manager prepared specification for each user journey to development team to begin their work. Meanwhile, I designed the user interface and worked with a front-end developer to implement HTML and CSS that I coded.

Introducing Prepsmith

Tracking Student Progress

Users can catch a quick glance of the dashboard to tracks exam progress and a breakdown of areas user should improve.

Full Practice Exams

Students can take practice exams that are closely resemble the real exam taking experience.

Review Results

Upon completing a practice exam, students can instantly find out how they have done and review questions they have missed.

Strengthen Weaknesses

Adaptive Concept Quiz (ACQ) is a personalized tool that generates practice quizzes that targets the student’s weakness areas.

Phase 3: CHECK

Launching & Evaluation

In May 2014, we launched Prepsmith with a few pilot classes, then later gradually rolled out to all campuses across Shanghai and Beijing. Within the first two months of launching Prepsmith, students reflected positively on using Prepsmith to help them prepare for college entrance exams.

Discovery & Refinements

Although Prepsmith was successfully launched, my work on Prepsmith was just getting started. We continued to make improvements and new features to Prepsmith using the same design and development cycle every two weeks: collecting feedback > propose solutions > design > test > launch.

A few features we have introduced to address user feedback:

Improve Technical Help

Issue: Students often get stuck with a technical issue but they are unable to get help immediately.

Solutions:

• Added an Intercom chat system where users can communicate with our project managers to receive help or report issues.

• In areas where users encounter error messages, we have added links to our knowledge base articles to guide users with possible solutions.

Prevent lost of data during an exam

Issue: While taking an exam, students may end up losing their work when experiencing unreliable internet.

Solutions:

• Added a trigger where if internet connection is lost, the exam will be paused and exam data will be automatically saved in the browser.

• Exam will resume once internet connection has been restored.

NEXT: Increase Prepsmith User Base