an inclusive online platform to help people connect, genuinely.
Project Beyond is a platform where students and professionals can authentically connect during the abrupt transition to digital communication. Responding to the surging demand for networking opportunities during Covid-19, we hope to help individuals foster nurturing mentoring relationships. The first MVP was launched in June 2020 and is currently in use with over 250 active users.
For this project, I am part of the founding team of 6 designers, PMs, and engineers. I led the ideation and the prototyping cycles for the landing page, and currently, direct the social media strategy for the Project Beyond brand.
March 2020 - Present
Cherry Wu, Nicole Kim,
Victoria Peng, Hwanghah Jeong
User Research, UI/UX Design,
Rapid Prototyping, Usability Testing, Brand Identity, Design Systems, Social Media Strategy
Since Covid-19, we watched meetings and gatherings move online in creative ways. People were willing to volunteer their time to mentor others and share their experiences in various virtual capacities. This generosity of spirit inspired our team at Beyond to spread compassion further and create a space for students and professionals to meet. As a team consisting of locals and internationals, we want to help the next generation connect with today's professionals in every field in a genuine manner.
As a designer, I am also pushed to contemplate the good of technology in this new era of opportunity:
1. How can socially-minded technologies provide people with an avenue to foster
deep, sincere connections?
2. How might we remind our community to make relationships and mindfulness
a little more tangible?
Many students and new grads early in their careers are lost and facing unprecedented challenges during the season of Covid-19. After preliminary chats with college students, we realized that many are feeling unmotivated and uncertain about the future. We also noticed that students often turn to established platforms like Linked-in and cold-emailing to connect with professionals, however, are easily discouraged due to the lack of response or authentic conversations they experience.
Students in need of desperate help
Connecting those who need help, and those willing to help through a seamless experience.
Creating authentic moments where students can enjoy insightful and motivational conversations to reset their mindset.
In June 2020, we launched our first MVP after rounds of testing and receiving feedback from our users. We reimagined the mentor and mentee matching experience and created a platform in which students and professionals can connect genuinely. Highlighted below are the key screens.
View All Mentors
We interviewed over 50 new graduates in the U.S and asked them to describe their current experiences with career preparation during Covid-19. We then focused on identifying factors that encourage or deter them from seeking support.
Our findings indicate that many students are jobless or had their offers rescinded, and are actively seeking help from a senior, mentor, or career counselor. That being said, we also identified a gap between students seeking help and professionals willing to help.
To our surprise, there was a growing trend of individuals offering office-hour sessions to help those who are job searching and/or have been laid off. We also noticed that individuals preferred a less structured way of connecting–an experience that resonates with a coffee chat–where they can get to know their mentees/ mentors on a more personal level.
65% 86% 32%
Are currently jobless or had their offers rescinded.
Feels anxious about the prospects of their future.
Are actively seeking help from a senior, mentor, or a career counselor.
Cold emailing and Linked-in messaging are not personable.
I need advice on specific topics, e.g. international status, work visa, career pivots, etc.
Best mentorship experiences are authentic, genuine, and not overly professional!
Refined design questions
To better understand our stakeholders, we identified the key call to action for mentors and mentees. This allowed us to pinpoint where Beyond's service would serve its best purpose.
We wanted to pinpoint the bigger questions that would better inform our design decisions and help differentiate us from other mentorship or recruitment platforms.
HMW transform and redefine the existing notion of "mentorship"?
HMW story-tell the magical connection between a matched mentor and mentee?
Low/ Mid-Fidelity Sketches
Based on the key insights from user research, we ideated on the Landing Page and the Mentorship Profiles which we believe consisted of key functions that are important for our first MVP launch. We also ensured that our designs accommodated the user needs of both the mentees and mentors.
For the Landing Page, we came up with two approaches and decided on the Action Approach that introduces the call to action 'Browse Mentors' and 'Offer Mentorship' in one glance. While most mentorship platforms tend to prioritize the 'Browse the Mentors' experience, we wanted to give equal leverage to both stakeholders (mentors and mentees) as we believe that both parties have meaningful experiences to share.
Narrative Approach – Separate Pages for Mission + Landing Page
Action Approach – Combining Brand Mission + Call to Action
Mentors are people with stories to tell. We wanted to allow mentors to tailor their unique journeys beyond just professional credentials on their profiles. Users are also able to browse through a wider range of mentors through the randomized card-sorting view.
View All Mentors
Refined Design Objectives
1. HMW utilize the real estate of the landing page to communicate the Beyond brand mission?
2. HMW accommodate the user needs of both mentors and mentees?
3. HMW create an intuitive and non-intimidating networking experience?
We conducted several usability testing sessions with our mock-ups and asked groups of students to walk us through how they would use the platform. The findings were then synthesized into a comprehensive user journey to deduce the pain-points and design opportunities more clearly.
Iteration + User Testing
Digital prototyping (Figma)
Remote user testing
The user testing informed changes we needed to make for a more intuitive user flow.
We needed to educate the user of the goal and the purpose of the platform
We would accomplish this by adding illustrated step-by-step instructions on the landing page to help guide the user through the Beyond experience.
Users preferred having more specific filters to find suitable mentors
Users should be able to find mentors by searching specific 'Knowledge Tags' related to their specific areas of expertise or life journeys (e.g international status, UI/UX, languages).
These insights allowed us to refine our product goals and informed a more detailed user journey encompassing pain-points and design opportunities covering the pre-during-and-post Project Beyond experience. Click to zoom in!
High Fidelity Deliverables
Working with developers
Core flow experience framework
Project Beyond MVP
To set the right expectations, we worked closely with the developers on the team using a detailed UI space and met bi-weekly for sprint reviews and planning. We shared bug fixes/ improvement ideas on slack channels #bugsnfeedback, standardized spacing, text size, UI components, made detailed annotations for frontend engineers, and experimented with Playground and high-fidelity prototypes.
The Beyond platform intends to reimagine what a genuine mentorship experience should look like. The current MVP consists of: signing up as a mentee/ mentor, creating a mentor profile, browsing all mentors, Q&A, and our mission. We also revisited our design objectives to make sure our product responds to the needs addressed in user research and testing.
Core Flow Experience Framework
1. Learn, inspire, and be empowered
Empowered and encouraged to help and seek help
2. Search & find
Personalized mentor search using 'Knowledge Tags’
3. Create & share
Narrative-like mentor profiles showcasing unique personas
4. Interact & motivate
Connecting and scheduling made easy through Beyond!
Beyond Landing Page
Mentee vs. Mentor Call to Actions
Guiding Instructions + Illustrations
Mentor Network Overview + Testimonial
The Beyond landing page is designed to offer both options of sign up as a mentor or mentee with equal priority. After several design iterations, we wanted to craft an onboarding experience with a clear and immediate call to action relevant to the user's needs, and one that reflects our brand mission
– kindness and genuine connection. The landing page is followed by instructions and educational content that illustrates the Beyond process with corresponding graphics.
Browse Mentors + Schedule a Beyond Session
View All Mentors
The updated View All Mentors page also features the respective mentors in an interactive card view. The cards are sorted in random order with the intent to underline our diverse cohort on our platform. Each mentor can customize their own set of ‘Knowledge Tags’ that connote their areas of specialty. Mentees can then conduct a more accurate search based on the relevant fields.
Scheduling a Beyond Session
The user will be prompted to schedule a Beyond session in two simple steps – they are given the agency to select a preferred time and to share any questions, specific topics, and meeting goals that would help facilitate the conversation.
The Q&A page allows users to find answers to any questions in mind while being able to read through others’ perspectives as well. Ultimately, our goal is to foster a sense of community and offer help to those who seek it in a structured and efficient manner.
Answer a Question
Ask a Question
Brand Identity & Tone
Brand personality spectrum
Illustrations and visuals
We aligned our visions for the product by conducting blind testing sessions using a Brand Personality Spectrum. The indicators informed the tone and voice of our design and prompted us to discuss how our expectations met or differed.
Graphics and Visual Personality
We intend to create an enlightening experience that is visually engaging and fun to navigate through. As such, I crafted a series of scalable illustrations and motion graphics recreating the 'wow' moment that occurs when two individuals connect and interact – the beginning of a relationship! I also tactfully planned out social media content on FB and Instagram to help spread the word.
Leading the brand direction of Beyond, my goal is to ensure all graphics and illustrations are cohesive across the different platforms including the website UI/UX, social media, and email newsletters. The overall use of playful colors and organic rhythmic shapes aligns with the Beyond mission to spark curiosity, joy, and inspiration.
The main goal of the graphics is to highlight the cross-disciplinary network of Beyond mentors coming from all walks of life, and subsequently, reinforce our value proposition of authentic mentorship.
Mentor spotlights featured on the Beyond Instagram and Facebook platforms.
My main focus for this project
Crafting a growth-oriented brand personality for Beyond and translating it across the user interfaces and marketing strategies.
My biggest takeaways
Coordinating and launching a platform with a remote team of designers, developers, and brand strategists from scratch. We had to be intentional with sprint planning and reviews to meet project goals. I also learned how to conduct Beta Testing sessions with users to pinpoint areas of improvement for our MVP.
The next steps
Our long term goal is to cultivate an online network of knowledge and support exchange by focusing on the user experience of community-building. As such, we set up product roadmaps to plan for future features and iterations, including video system integration, mentor appreciations, and mobile view. We also intend to expand and diversify our mentor base by reaching out to senior professionals, academic practitioners, and international graduate students!
Meet the Project Beyond Team!
Our team consists of students and professionals from all around the world in U.S, Seoul, and Hong Kong. We are a group of creatives passionate about inspiring the next generation to keep the meaningful conversations going!