Design a digital goal-setting tool for competency-based education system

Competency-based education is an innovative educational system that emphasizes on personalized learning and requires students to self-design their own learning experience based on their personal values. However, it is challenging for students to come up with their own learning plan from scratch and manage their learning progress. Moreover, the current remote learning modality has made this process even more challenging and unmanageable by both teachers and students.

Since the remote learning is still continuing amid the endless pandemic, it bolsters the need to create an easy-to-manage digital goal-setting tool as part of students' learning under the competency-based system.

Solution

GoalGo is a one-stop goal management web-app that helps students in competency-based education system decompose the goal-setting process into segments and provides step-by-step guidance for them to brainstorm, evaluate and manage their personal learning goal.

Type: Web app design
Duration: 3 months
Client: City of Bridges High School, Pittsburgh, PA
Role in project: UI/UX designer in an interdisciplinary team of 4
Collaborators: Yinru Sun, Zijing Lu, Claire Yoon

Design brief

How do new students get onboard to the competency-based education system remotely?

Background Research

An innovative learning landscape: Competency-based education

The educational industry is in the process of innovation. Nowadays, as the impact of emerging social structures and technologies will influence the kinds of jobs available and the skills needed to be successful for the younger generation, the educational goals and methods should also respond to such changes. Competency-based education (CBE), in favor of a structure that creates flexibility, allows students to progress as they demonstrate mastery of academic content, regardless of time, place, or pace of learning. It is a new educational system that focuses on learners' personalized learning opportunities and celebrates their achievement toward their goals.

The features of competency-based education:

• Refined learning curriculum
• Flipped relationship between learners and teachers
• Revolutionarily different grading system

However, how do students from traditional backgrounds get into this innovative learning environment? How do they succeed under this new educational system and bridge the CBE experience to their future development?

Collaborating with our client: City of Bridges High School, a local competency-based school in Pittsburgh

Our design challenge is to focus on learners' "onboarding process" in a competency-based education environment. "Onboarding" in our design refers to the mechanism through which new students adapt to the new educational system. We try to dig into it and find the potential opportunities to form a better future version of the onboarding experience to the competency-based education.

This time, we collaborate with City of Bridges High School (CoBHS), a young and vigorous competency-based high school in Pittsburgh, to discover the challenges for students from diverse backgrounds to get into this community, and envision a more smooth and enjoyable onboarding experience for students and teachers in CoBHS.

Background research

The goal-setting and management process is hard, and the pandemic has made it even more challenging

Contextual inquiry: we participated in the actual onboarding activities at the school

During the research phase, our team worked closely together to dig into the problem space and identify design opportunities from the holistic process. While the teammates with background in education primarily focused on literature review, interviews, and data collection, I led the overall design process and develop the format of personas, models and journey maps for all team members to input and synthesize the data collected.

Current onboarding process mostly relies on in-person guidances and paper-based documentation

To understand how City of Bridges is guiding students get onboard, we organize the contextual inquiry data, including the interviews, artifacts, schedules, and so on, into the following models:

Pain point

Students struggles the most during the self-discovery and goal-setting process, while teachers have trouble manage the process

Through the contextual research, we learned that students enjoy very much learning in this innovative system, but they sometimes feel anxious about the future: they are not sure if they have found the right learning goal, and if the goals can lead them to success. On the other hand, since the current process rely mostly on paper-based documentation, it provides low flexibility for students and teachers to track, manage and modify the learning process.

Pain point

The current process is hard to adapt to the post-pandemic remote learning settings

The goal setting and management journey has become even more challenging in the remote learning setting. Since the current process highly depends on paper-based documentation and in-person guidance, if the learning environment is moved online, it is very challenging for students to find instant feedback and for teachers to track students' progress.

User need 1

Scaffold the metacognition

Students struggle the most while designing learning goal form scratch. They need some step-by-step guidance to discover themself and set up suitable goals for their learning journey.

User need 2

Digitalize the documentation

Students and teachers have trouble documenting and tracking their learning process on paper. The post-pandemic remote learning setting has make the paper-based, in-person method even more challenging. They need a digital media to track and manage the learning pathway easily.

Ideation

We decided to design a digital goal-setting tool to satisfy users' need and the educational trend

Following the insights and design opportunities from our research, we generated 10+ storyboards and arranged a speed dating session to test our idea with 20+ students and 5 teachers at City of Bridges High School.

Identify the intersection of students' and teachers' preferences -- a digital goal setting kit

From the speed dating session, we found an interesting insight that teachers and students have different preferences on the ideas. Therefore, we decided to use a coordinate map to visualize the difference between teachers’ and students’ preferences and try to find the overlapping parts as our most favored ideas.

Evaluation metric of students' and teachers' preferences

Defining MVP

Clarify the core features, users' roles and actions in the system by service blueprinting

Following our targeted direction, we utilized the service blueprint method to specify students' and teachers' roles, experiences and touch points in the digital system. We started with recreating a journey map that focus on our targeted direction, the goal setting process, and develop the overall function based on the journey.

Our map is a triple-layer diagram. The first layer is the journey map that maps out the experience and mood for the current situation. Then, moving to the second layer, we started to brainstorm our vision state: what is the overall service pattern? How would our design idea fit the overall system? And then, in the third layer, we tried to narrow down our design scope, and zoom into the part that students struggle the most to start our design concept.

Beyond UX: Learning experience design

Apply learning science theories to the interaction process

Learning experience design (LXD) is somehow different from the traditional UX design. UX design focus more on the experience right when the user is moving through the interface, and the more simple interaction process usually leads to better UX.

On the other hand, the time scale for LX design is much longer than UX. The indicator of LX design contains how well students can "take away" from the interaction. To be more specific, LX puts more emphasize on how much students learned and retain the knowledge after the interaction.

Therefore, different from traditional UX design, there might be some "desired difficulty" in LX design, such as some mandatory steps, inflexible user flow, etc. We also took this into consideration while developing our design concept.

Segmenting principle* of e-learning and unskippable navigation

We broke down the whole task into reasonable segments and distribute them into pages to reduce cognitive load. The step bar on the top of the interface helps students to master the whole picture, and more easily digest and engage in each part. To avoid students skipping any steps, we only provide "next" and "previous" navigation buttons and provide no option to directly jump into any section.

*Clark, R. C., & Mayer, R. E. (2016). E-learning and the science of instruction (Ruth Colvin Clark & R. E. Mayer, Eds.; 4th ed.). John Wiley & Sons.

*Clark, R. C., & Mayer, R. E. (2016). E-learning and the science of instruction (Ruth Colvin Clark & R. E. Mayer, Eds.; 4th ed.). John Wiley & Sons.

Use authentic whole-task* to improve students' procedural skills

Our objectives include helping students to master the ability of goal-setting which benefits them in the long term, so in our solution, we use some scaffolding to guide students learn by doing -- learn goal-setting methodologies by actually doing goal-setting activities, instead of direct instruction.

*Clark, R. C., & Mayer, R. E. (2016). E-learning and the science of instruction (Ruth Colvin Clark & R. E. Mayer, Eds.; 4th ed.). John Wiley & Sons.

Solution

A digital learning media that helps competency-based education students set goals, track progress and share information with the community

Step-by-step guidance to help students set goals based on their own interests and values

GoalGo is a one-stop goal management web-based platform, helping students to direct and track their learning goals in the competency-based education system. The platform guides students to discover their own interests, skills, and values, prioritize goals by evaluation methodologies, and define practical milestones. The platform aims to equip students with self-directed goal-setting skills that enact long-term benefits.

Empowered by learning science theories

Whole-task learning and unskippable navigation provide a deliberate practice for students

As mentioned above, we applied some learning science theories to make the goal-setting process become a "deliberate practice" for students. Instead of direct instruction, the system leaves many blank spaces for students to actually think about the question prompts and input organized thoughts throughout a linear, unskippable navigation. This deliberate practice will benefit students in the long term learning performances.

Step I: Brainstorm

Guide students to design and develop their learning goals through design thinking methods

The nature of goal-setting and curriculum planning is also a "design" process. Therefore, to inspire students reflect on themselves, we applied the design thinking methods for students to brainstorm. We designed a jam-board where teachers can input prompting questions and students can brainstorm based on the prompts. After students have come up with rough inspirations, the system will guide students to dig deeper into their inspirations, find out why it is important and thus develop the inspirations into more concrete goals. Through the organization and development of rough, complex inspirations, students are able to form a clearer picture of themselves, and express their values and goals more confidently.

Step II: Evaluation

Skill inventory quadrant helps students evaluate and prioritize their learning goals

After students have come up with some initial learning goals, the next step is to evaluate whether the goals are suitable and scalable for the high school learning journey.

In the evaluation step, the "skill inventory quadrant" helps students evaluate their initial goals from two aspects: motivation (whether they want to improve) and ability (whether they have the potential). Students will map the draft goals on the quadrant, and see which goals are more possible to lead them to success. Also, as for the behavior prompts, we used nudges and encouraged wording for students to direct and achieve goals.

Step III: Definition

Integrating existing instructional materials to help students specify each goals with actionable milestones

After evaluating and prioritizing the goals, the next step is to make the high-level goals into more specific, actionable tasks. To achieve that, we integrated some existing instructional materials of City of Bridges High School, such as the "six chapters" and SMART criteria into the interface and adapt them into the overall user flow in our product. Teachers can input the instruction, and students will follow the instruction to consolidate their goals.

Progress management

Students and teachers can check their learning progress on the dashboard

The goal management dashboard helps students and teachers check the schedules and track the progress of milestones. The goal list and version history archive all your goal-setting progress, and provide the best support for students to revisit and modify the goals if needed.

Power of the community

Students have the option to share their personal progress with the community as future references

Worked examples are very important learning materials for students especially when the learners are getting into a new field. In this case, while students are required to self-design their learning journey, some examples of previous students are extremely valuable for them as references.

Based on this need, we add a feature for students to share their learning journey with the school community. Considering the privacy, the students still have the option not to share their information, but we encourage students to share info by providing rewards such as more access to the reference resources and so on.

While sharing the learner profiles, students can add related tags to their information such as their backgrounds, interests, directions, etc. Once students have share their learner profile, other students might search the profile by the tags, allowing them to find out more relevant learner profiles as references.

UI style guide

The core value for our UI design is to make our product become a friendly and supportive sidekick that accompanies the learners during their learning journey. Therefore, we used some illustration and game-like design elements to deliver our visual design in a delightful design language that expresses the joy of learning. Here are our 4 core design principles:

Inviting but not overwhelming
Casual but not rash
Joyful but not entertaining
Supportive but not icy

Measuring success

Received positive feedback from both teachers and students

To seek feedback from the target users, we arranged a presentation session with teachers and students at City of Bridges High School to let them try our hi-fi prototype. However, due to the sudden surge in COVID cases, we had to move this event online and can only present the demo to the users without letting them actually try the prototype.

To make the best use of this demo session under such constrain, we have designed a series of questions to invite reviewers to give feedback on every aspect of our current solution, and collect their verbal feedback to measure their desirability to use this tool. Here are some of the comments we received:

"...Love the breakdown into brainstorm, organization, evaluation..."
"...I like how it takes a difficult task and breaks it down into manageable sub-tasks..."
"...Love the sense of user control and the prompts for ideation..."
"...These are intuitive, useful tools..."
"...The ability to revisit this tool and its content later is fantastic..."

Our remote demo session with stakeholders from CoBHS