Team Formation
A Virtual Platform for Hackathon Team Building
Designed to help students seamlessly form teams in a virtual hackathon setting, ensuring meaningful collaboration despite remote constraints.
Role
Lead Designer
Duration
4 Months
Tools
Figma, Adobe Suite, React
Team
HexLabs
Project Overview
🌍 The Challenge: Hackathons in a Virtual World
Hackathons thrive on collaboration, but when the COVID-19 pandemic forced HackGT7: Reimagine Reality to go fully virtual, a major challenge arose:
No structured way to form teams online
Difficult to connect with like-minded participants
Lack of engagement, leading to lower project success rates
This presented an opportunity to reimagine the way students connect and form teams virtually.
🎯 Goal
Design an intuitive, engaging platform that enables students to find teammates efficiently, fostering meaningful collaboration despite the remote setting.
Research & Insights
👤 Understanding the Users
To build a seamless experience, I interviewed past hackathon participants and identified two primary user types:
Solo hackers – Looking to join an existing team.
Team builders – Creating a team from scratch or expanding an existing group.
💡 Key Insights
Team formation criteria matter – Participants prioritize filters like skills, major, and experience.
Pre-team communication is crucial – Students want a way to chat before committing to a team.
Team stability is a concern – Users need clear notifications to avoid flakiness.
📊 Success Metrics
To measure success, we tracked:
Number of teams successfully formed
Time taken to form a team
Student engagement and satisfaction
Frequency of users reaching out for assistance
Ideation & User Flow
To quickly explore ideas, I started with low-fidelity sketches and concept mapping.
💭 How Might We…
Enable students to find compatible teammates effortlessly?
Make the team formation process intuitive?
Ensure engagement and stability in virtual teams?
📌 User Flow…
I structured the platform into a clear and intuitive user journey:
For solo hackers – Browsing teams → Sending requests → Chatting → Joining a team.
For team builders – Creating a team → Setting filters → Approving members → Forming a stable team.
Wireframing & Prototyping
🔁 Low-Fidelity Wireframes
After refining my sketches, I translated them into wireframes in Figma.
Focused on clarity and ease of use.
Prioritized team visibility and filtering options.
High-Fidelity Designs
I designed an interactive prototype that showcased the final experience, including:
Feed Page – Grid layout for browsing teams and individuals.
Join Requests & Team Invites – Seamless request system.
Pre-Team Chat – Allowing users to message potential teammates.
Notification System – Ensuring clear updates for team formation.
BROWSING AND DISCOVERY
Find Compatible Teammates
Quickly
Users can search for teammates based on skills, school, or graduation year, making it easier to find the right fit.
ONBOARDING
Simple Profile Setup for Better Matches
A streamlined onboarding process ensures users provide key details like skills, school, and bio to improve team formation.
TEAM-UP REQUEST
Seamless Collaboration
Kickoff
When users find a potential teammate, they can send a structured team-up request. The form encourages clear communication by prompting users to introduce themselves and share their project idea, ensuring alignment before committing to a team.
TEAM MANAGEMENT
Stay Organized & Connected
Users can track team formation in real time—sending and receiving requests, managing notifications, and viewing team details. The dashboard displays team members, project ideas, and skill gaps, ensuring teams are aligned before the hackathon begins.
From Design to Development
With only a few months before the hackathon, I worked closely with developers, ensuring:
Clear design documentation – Guidelines for UI interactions, states, and responsiveness.
Smooth cross-functional collaboration – Weekly developer syncs to address constraints.
Iterative feedback – Regular check-ins to refine functionality.
We primarily used Slack and Figma to ensure efficient communication.
Impact & Results
300+ participants used Team Formation to successfully find teammates.
High engagement – Notifications and chat features enabled seamless interactions.
Continued adoption – The platform became a foundational tool for future HackGT events, including HealthTech and following Hackathons.
Next Steps
If given more time, I would:
Conduct more usability tests for additional refinements.
Enhance team page UI to improve clarity and engagement.
Improve the notification system for better awareness of team updates.
Explore AI-powered team recommendations based on user skills.