Camplus

Building community and connection for college students through a university specific social application with features like Gatherings, Discussions, and Live Chats

Timeline

April - May 2023

Tools

Figma

Role

Product Designer

Context

This project was my solo final project for DESN 450: BA Design Senior Project, which required researching, designing, and addressing a problem that resonated with me. I focused on exploring the ongoing challenges university students face as a result of the COVID-19 pandemic.

Problem

Social Disconnect in College

Social Disconnect in College

The pandemic has left a lasting impact on social connections for college students, disrupting natural opportunities to form friendships during online classes. Even with in-person classes resuming, building meaningful relationships remains challenging, especially for new students struggling to integrate into a community where bonds were never fully established, leaving many feeling disconnected and searching for belonging.

Goal

Building a Connection for Students

Building a Connection for Students

Create a sense of belonging and community among college students by encouraging meaningful social connections and friendships.

Research

Market Research

Market Research

College students rely on social media platforms such as Snapchat, Reddit, Discord, and Bumble as vital tools for connecting and socializing with peers.
These apps lack an inclusive environment where students can freely socialize and express themselves while remaining within the university setting.

Interviews

Interviews

To better understand the impact of the pandemic on college students' social experiences and sense of community, I conducted a series of user interviews. The goal was to empathize with the challenges students face in navigating university life during these unprecedented times.

I reached out to a diverse group of students from various university and college programs to ensure a comprehensive understanding of the issue. These were the insights gathered:

Insights

Insights

Challenges in Forming New Friendships

Challenges in Forming New Friendships

"Being in online classes, it's tricky to have those casual chats we used to have before or after class. Chatting online just isn't the same as talking face-to-face, you know? It's like something's missing, making it hard to really connect."
"Being in online classes, it's tricky to have those casual chats we used to have before or after class. Chatting online just isn't the same as talking face-to-face, you know? It's like something's missing, making it hard to really connect."

Disconnected From Campus Life

Disconnected From Campus Life

"It's lonely being just a face on a screen in online classes. But, staying active in online clubs and groups has helped me feel like I belong somewhere. Working with classmates on projects and studying together has also made me feel more connected, even though things are tough right now."
"It's lonely being just a face on a screen in online classes. But, staying active in online clubs and groups has helped me feel like I belong somewhere. Working with classmates on projects and studying together has also made me feel more connected, even though things are tough right now."

Connected Through Online Platforms

Connected Through Online Platforms

"Whether it's hopping on a Zoom call or playing games online together, these virtual hangouts have been my saving grace. Plus, joining online groups with people who share my interests has been a great way to meet new friends."
"Whether it's hopping on a Zoom call or playing games online together, these virtual hangouts have been my saving grace. Plus, joining online groups with people who share my interests has been a great way to meet new friends."

Ideation

Translating Insights to Solutions

Translating Insights to Solutions

After carefully analyzing the research findings and insights, I identified key challenges and needs specific to college students. With these in mind, I brainstormed and developed a set of features designed to address these issues effectively and enhance the overall student experience. Here are the core features I conceptualized:

🏠

HUB

A centralized hub to seamlessly access all platform pages, featuring a customizable interface that allows users to prioritize and personalize features based on their individual preferences and needs.
A centralized hub to seamlessly access all platform pages, featuring a customizable interface that allows users to prioritize and personalize features based on their individual preferences and needs.

🤝

COMMUNITY

A dedicated space for students to discover and join various communities, actively engage with peers through discussions and shared interests, and maintain a strong sense of connection.
A dedicated space for students to discover and join various communities, actively engage with peers through discussions and shared interests, and maintain a strong sense of connection.

🙆

HANGOUT

A dynamic space designed to help students connect with one another, build meaningful friendships, and effortlessly plan and organize social gatherings or meetups
A dynamic space designed to help students connect with one another, build meaningful friendships, and effortlessly plan and organize social gatherings or meetups

Information Architecture

Information Architecture

After finalizing the core features, I developed a clearer understanding of the essential app pages and content required. This enabled me to organize and structure my insights into a cohesive information architecture.

Design

Early Design Explorations

Early Design Explorations

Once I outlined my initial concepts for the product, I transformed them into wireframes to provide a more concrete visualization of the design. These low-fidelity wireframes were then utilized as a foundation for testing the design during concept testing sessions.

Hub

Campus

Gather

Message

You

Testing

User Feedback

User Feedback

Once I outlined my initial concepts for the product, I transformed them into wireframes to provide a more concrete visualization of the design. These low-fidelity wireframes were then utilized as a foundation for testing the design during concept testing sessions.
Campus — Unclear Post Creation and Limited Content Filtering
Creating a post wasn't visibly obvious
  • Cluttered with "trending" tab
  • Hesitated about where the create post button was
No where to filter post
  • only "trending" was available
  • couldn't access "newest" post
  • couldn't access "most liked" post
Solution:
  • Create a separate tab for "newest" and "most liked" posts
  • Create a clear separate button for post creation
Gather — Unclear Gathering Selection and Identification Issues
Uncertain which gathering was selected
  • have to close tab and click again to confirm
Solution:
  • Highlight currently viewing gathering
  • Include information to make it easily identifiable

Iteration

Creating iterations based on feedback

Creating iterations based on feedback

Iteration #1

Enhanced Post Creation Visibility and Expanded Content Filtering Options

Users struggled with unclear post creation and limited content filtering, as the "Trending" tab dominated the interface without options for "Newest" or "Most Liked" posts.
To fix this, a clear post-creation button was added, and separate tabs for "Newest" and "Most Liked" posts were introduced to improve navigation and content discoverability.
Iteration #2

Highlighting the Active Gathering for Better Gathering Idntification

Users faced confusion when identifying which gathering they were viewing, as there was no visual indication or clear feedback. This led to unnecessary steps, such as closing tabs and re-clicking, to confirm their selection, disrupting the user experience.
To resolve this, the currently viewed gathering is now highlighted, and additional identifying information is displayed. This ensures users can easily recognize and confirm their selection without extra effort, improving usability and clarity.

Final Design

Camplus ── More than just a campus

Camplus ── More than just a campus

Camplus is designed with the idea that a university is more than just a physical campus—it’s a community. It's designed to help students reconnect and rebuild the social bonds that may have weakened during the pandemic, Camplus serves as an easy tool for creating meaningful connections. The goal is to make socializing effortless, enabling students to meet like-minded peers, engage in campus life, and create the vibrant, memorable university experience they deserve.
Onboarding

Join Your University Community

Join Your University Community

1. Select your university
2. Sign up using your official university email
3. Verify that you are a student of that university
4. Customize your profile
Hub

Customizable Homepage

Customizable Homepage

Users have the flexibility to customize their hub according to their preferences and priorities. For example, if users wish to prioritize Discussions, they can easily move that section to the top of the page. Additionally, users can quickly share their contacts via QR code
Campus

Staying Connected with Peers

Staying Connected with Peers

The Community tab includes three pages: Discussions, Groups, and Live Chat. This feature enables users to seamlessly engage with the university community, whether through diverse topics, specialized groups and clubs, or even class-related discussions.
Discussions: Explore topics shared by fellow students or start your own conversation!

Groups: Explore various communities or groups and join those that interest you!

Live Chat: Interactive live chat for students to connect with peers in real-time. A dynamic space to ask questions and receive immediate responses from fellow students who are online.
Gather

Effortless Socializing: Find, Join & Create Gatherings

Effortless Socializing: Find, Join & Create Gatherings

Students have the option to initiate spontaneous gatherings or participate in ongoing ones. The aim is to facilitate face-to-face interactions, enabling students to connect and network with their peers. This feature encourages students to socialize and forge new friendships during their free time between classes.

Gather Information: Click on the icon for a detailed description of the gathering, including clickable options to request to join, check the distance, and message the host.

Location: Control your location settings to manage which friends can see your current whereabouts.

Create a Gathering: Create your gathering based on activity, location, time frame, and attendees!

Reflection

Reflection

I'm amazed at how much I learned while creating this mobile app from scratch. From coming up with the brand identity to perfecting the final product, this project was incredibly rewarding.

One thing that really stands out is how much I improved at using Figma. Prior to this project, I possessed only fundamental knowledge of Figma, having acquired basic skills from previous UI/UX projects. But diving into Figma's advanced features like auto layout, constraints, and components during this project was eye-opening.

This experience showed me how important it is to keep learning and adapting as a designer. Trying out new tools and techniques not only makes you better at what you do but also sparks new ideas. Looking back on this project, I see the value in always being open to learning and growing as a designer.
Let's chat... about design, gaming, and traveling!

Let's chat...
about design, gaming, and traveling!

designed with love by alvin hu ©