Vibe: Enhancing connectivity and engagement between students and universities
A platform that helps students connect, find clubs, network, form study groups, and build community—while also supporting university administrators.
EE
TOOLS
UX Researcher
UI Designer
ROLE
Figma
After Effects
Google Slides
3 Weeks
TIMELINE
THE PROBLEM
Students have a hard time finding their people, and staff juggling with too many tools
Students struggle to connect with peers, find relevant clubs, network with professors, form study groups, and feel a sense of community. On the other side, universities manage these needs through multiple, disparate tools, making the process cumbersome for administrators and reducing overall student engagement.
The Solution
To create a seamless digital product that enhances student connectivity, promotes campus engagement, and eases the administrative burden for staff members in charge of the university.
RESEARCH AND DISCOVERY
Right now, neither students or staff have the right tools to make connecting easy
Our approach followed a structured design thinking process to ensure our solution was user-centric and effective.
Interviewing
Market Research
User Research
Empathy Map
Customer Journey
Userflow
Wireframe
Branding
Final UI
Research
Define
Ideate
Design
We began by interviewing the key players within our existing market (our university) to gather direct insights. Our participants included:
4
UNIVERSITY STAFF
2
STUDENT
COMITTEE
MEMBERS
6
STUDENTS
Both students and staff are in need of a bridge between them so they can tackle challenges such as the inability to communicate effectively due to social anxiety, which club to join, and for staff to manage and measure student profiles and engagement.
MARKET RESEARCH
Existing platforms cover parts of the problem, but none offer a seamless, all-in-one solution
An analysis of existing platforms helped us identify market gaps and opportunities.
Lacks advanced functionalities compared to broader solutions, requires integration with existing systems for optimal effectiveness.
Focus on direct communication, flexible tools for various educational environments, encourages student-faculty collaboration.
User-friendly interface that encourages participation, comprehensive tools for students and administrators, strong focus on community building.
Struggles with seamless integration into existing university systems, requires continuous updates
STRENGTHS
WEAKNESSES
USER RESEARCH
The Community Builder & The New Journey Student
Based on our research, we developed two primary personas to guide our design decisions.
Dedicated to creating a cohesive and vibrant campus community, looking for new ways to strengthen the connection between students.
CORE BELIEVE
CHALLENGES
Regularly uses communication platforms and management software on the school website to enhance campus operations and student experience.
Enhance student engagement in communities on campus, foster a supportive and inclusive environment, ability to accurately track data, and maintain high levels of retention rates.
Limited student engagement, difficulty building a cohesive campus culture, difficulty in managing diverse student needs, no student insights beyond basic data.
DIGITAL BEHAVIOUR
GOALS/NEEDS
DIGITAL BEHAVIOUR
GOALS/NEEDS
Dedicated to creating a cohesive and vibrant campus community, looking for new ways to strengthen the connection between students.
CORE BELIEVE
CHALLENGES
Regularly uses communication platforms and management software on the school website to enhance campus operations and student experience.
Enhance student engagement in communities on campus, foster a supportive and inclusive environment, ability to accurately track data, and maintain high levels of retention rates.
Limited student engagement, difficulty building a cohesive campus culture, difficulty in managing diverse student needs, no student insights beyond basic data.
DIGITAL BEHAVIOUR
GOALS/NEEDS
DIGITAL BEHAVIOUR
GOALS/NEEDS
PERSONA 2
Student
USERFLOW
From Curiosity to Connection: Navigating the Vibe Experience
We mapped the user's journey to identify key pain points and opportunities for intervention.
Start
Onboarding
Account?
New Register
Home Page
Event (recommended)
Choose Event
see event details
see event details
see event details
Join event
Personalized Suggestion
Check vibes of person
Find people in the event
Sign In
Match Vibes!
BRANDING
The rules behind the Look
Colors
Vibe's color palette balances energy and trust. Pale orange reflects fun and vibrant connections, soft yellow adds positivity and warmth, while blue ensures calm and reliability, aligning with Vibe’s mission to foster supportive school communities.
The font that brands connection
General Sans pairs well with Nohemi. Nohemi was chosen to align with Vibe’s youthful and tech-forward branding. The font’s sharp yet approachable aesthetics reflect the app’s mission to foster connections among students and staff, keeping things engaging yet accessible.
General Sans - Medium
Primary Fonts
Nohemi - Medium
ABCDEFGHIJKLMNOPQRSTUV
WXYZ 0123456789 !@#$
%^&*()_+{}|:"<>?-=[];',./`~
ABCDEFGHIJKLMNOPQRSTUV
WXYZ 0123456789 !@#$
%^&*()_+{}|:"<>?-=[];',./`~
Shapes we use to represent diversity
OUTCOME
How might we get Marky to Match with other Students and Engage in Activities?
Marky is brought into the personal vibe creation
in the beginning
He then goes into his application to look at his profile and tries using the search.
After meeting up and connecting with the person the vibe shows the match rate of the other person.
Eventually, deciding on going onto one of the trips shown from the university! Leaving feedback
Finally, the feedback from the application is transfered towards the faculty members dashboard.
KEY LEARNING
The Synergy of Design: A Collaborative Leap in My UX/UI Journey
This UX design project offered an incredibly insightful and transformative learning experience. The opportunity to collaborate directly with digital marketing and a range of UX/UI designers was invaluable, exposing me to diverse thought processes and problem-solving approaches. We meticulously explored numerous user flows, each iteration refining our understanding. What genuinely surprised and delighted me was discovering fresh, unconsidered nuances about the student persona, even as a student myself. This highlighted the continuous depth of user empathy. Beyond that, meticulously adhering to a Branded Guideline to maintain a consistent UX/UI style was a practical lesson in professional execution. This project stands as a pivotal and truly foundational stepping stone in my burgeoning UX/UI career.
Contact me!
Behance