Goal go

UI/UX Design, Research

City of Bridges High School
An interactive web based goal-setting and management tool for mastery based education

GoalGo helps new students at City of Bridges High School direct and track learning goals based on their underlying interests, curiosities, and values.

It is designed to address one of the most challenging difficulties, goal-setting, which students face in adjusting to the new school life by connecting students' past to their future and helping them discover what kind of personal background leads to their future.
Shang-Yuan Wang,
Yinru Sun,
Zijing Lu
10 weeks

Problem space

Our design challenge is to focus on the 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.

Design Concept

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.

Feature 01

Navigate your direction from confusion

GoalGo helps you to discover, prioritize, and define learning goals step by step, which helps you to navigate your pathway based on your interests, skills, and values.

Feature 02

Track your progress towards goals

The goal management dashboard helps you to check your schedules and track the progress of milestones

Feature 03

Build your goal library

Your goal list and version history archive all your goal-setting inspiration, and provide the best support for every time you need to re-direct your future. You can also visit each goalsetting stage and update your ideas anytime.

Design System

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:
but not overwhelming
Casual but not rash
Joyful but not entertaining
Supportive but not icy


For a more indepth process documentation
Click to view our notion 

Concept Generation

Our map is a triple-layer diagram. The first layer is a 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.


We decomposed the whole process into specific user flows and mapped the flows into the interface pages, which leads to our product structure and page-level interaction design.


For this project, I have walked through a solid research process including contextual inquiry, user profile analysis, portfolio synthesis models, service blueprinting, and so on to understand the users, stakeholders, and their interrelationship within the system.

I think this is definitely a valuable process before our design since we are not designing for a single problem in this project. Instead, we are trying to deal with a complex systemic experience that involves multiple users, stakeholders, contexts, and limitations. Without solid and comprehensive research and understanding of the topic, the ideas could always be single-faceted or biased that does not fit the overall system. 

© Claire Yoon 2024