We aimed to increase touchpoint between the instructor and students via the online platform, in order to provide better engagement with the class and support from experts


Recap, an online platform that empowers learning through community building and breakthrough mapping

Final Solution



Winchester Thurston Upper School


3 months (Sep - Dec 2019)


Contextual inquiry, focus group,

user journey mapping, contextual modeling, diagnostic mapping


Our client Winchester Thurston School(WTS) is a k-12 school in Pittsburgh. The CS Innovation course at WTS is a project-based learning course, open to grade 10-12 students who have taken CS prerequisites. In this course, students research and develop their own product to solve existing problems. 


PBL requires the instructor to take more efforts to track progress and identify problems

In such an open space class, students will gain hands-on experience in programming. However, they may also encounter different challenges throughout the journey.  Since class time is limited, how to allocate time and energy to check students’ progress, solve their problems, and assess their learning, becomes a big concern of the instructor.

Problem Space

How might we help the instructor identify students’ problems and assess learning efficiently?


Recap, an online platform that documents students’ progress through goal completion and problem breakthroughs.

Cannot access?

Interactive prototype

Click the following buttons to play with the prototypes.

Group 835.png
Demo video
Design Overview

Key feature 1: Online community

Promote peer collaboration to solve project challenges. Ask and discuss problems with peers after class. (Demo: Student's side)

Ask a question


Thanks the helper and

document your breakthrough

Browse other's problems and discuss


Key feature 2: Learning progress tracker

In each student's profile page, we digitalize goal check-in documentation, trying to make it easy for goal revision, updates and grading. Besides, use a journey map to visualize students' performance on the way. (Demo: Instructor's side)

Customized journey map

  1. Student:  Create phases based on their own schedules. 

  2. Instructor:  Track student performance through visualized maps. 


Goal check-in

Check, edit and confirm students' weekly project goals.


In the first month, we kept good communication with the course instructor to understand the class scenario and existing issues, and also experienced the class as a student. After figuring out our problem space, we brought design ideas back to them and collected feedback, which shaped our final solution.

User Research

Group 850.png

We interviewed the instructor and the technologist to understand the class logistics and current pain points. From educators' perspectives, the courses are in good structure, and students are performing well. However, the main problem laid in improving teaching and learning outcomes. The instructor noted three main challenges: assessing knowledge gain, knowing students' questions ahead, and setting check-in goals.


Then we got extra information from students' side during speed dating session. We surprisingly found out that things were told differently by students comparing with teacher's words. Students felt like the instructor was too busy to know everybody's progress and problems. They got trouble in setting check-in goals and solving problems without instructor's help.

Step 01: Understand the users.

In the first meeting, we talked with the instructor of course CS Innovation. We conducted two interviews with the instructor and the technologist.

Group 880.png
Group 881.png

Step 02: Understand the context.

During the interviews, we also asked the instructor about class size and teaching contents and reviewed the syllabus. A day-in-life model was created to communicate our research findings.

For this year-long course, it contains three stages of study: Launch Stage, Ongoing Stage, and Final Stage. Detailed descriptions are provided in the gray area.  In the green area, we mapped out the corresponding activities of students and the instructor for each of the stages.

Hover to check↓          problems   and          opportunities

We also tried to learn more about how the instructor and students interacted in this class. Though the class observation, we found it obvious that students didn't have much communication with their classmates and even didn't quite familiar with each other. This mainly because the course is an elective and students often take different classes.

Step 03: Finding analysis and synthesis

  • Primary problem probe

We first wrote down the surface problems(Facts)Then analyzed the underneath problems(Reasons) with the findings. The insight(Root) we got from those findings was that: informational communication between the instructor and students was not efficient enough ——

there was a lack of touchpoints between students and the instructor.

problem scoping.png
  • Diagnostic mapping

We also discussed further on these existing problems, analyzed their causes, consequences and potential ideas. These ideas guided us to shape our potential solutions in the ideation phase.

Group 875.png

Design Goal

We started to think about increasing touchpoints between the instructor and students, in order to ​let the instructor learn more about students' status and let students learn more about their classmates. 

How might we help students create a space to discuss questions, share feedback and reflect upon periodic learning progress? `


In this stage, our team came up with as many ideas  as we can, referring to the preliminary ideas from the diagnostic map.

Example Storyboards 
  • Speed Dating

To validate our ideas, we printed out 10 storyboards and conducted a focus group among 5 students. After reading each of the ideas, we encouraged them to share their feelings and opinions either by conversation or post-its. The questions included "What do you like and what you dislike", "What's your further expectation on this idea" and "Anything can be improved". In the end, we asked them to select one favorite idea. It was very successful that students tended to talk more in such an open discussion with peers.

Group 882.png
  • User Feedback

We moved the students' comments and votes to a Miro board. New findings from the student side was added to our information collection, allowing us to consider the solution from two perspectives.

Group 892.png
Group 894.png
Group 893.png

Upon their feedback and the instructor's comments, we found that Community Board, Celebrate Breakthroughs got the highest votes.

  • Customer Journey Mapping

Group 887.png

Highlighted Features

01. Student Profile

A page that includes all information that can better assess learning and track progress.

Group 904.png

02. Breakthrough Moments

Encourage students to document their breakthroughs. For students, it increases their sense of achievement and enhances reflection. This provides extra evidence for instructor to assess students' efforts.

Group 901.png

03. Motivators

It's important to keep students' motivation on using this platform. We created positive feedback as incentives. The more they use, the more they can benefit from the platform.

Group 903.png