Club Collective
My Role: UX Design Date: Fall 2020
Project Team: Ines Acosta, Sean Perryman, Ting Yu, Brandon Kim
The initial months of a freshman’s college experience should usher in an exciting new phase of life. The COVID-19 pandemic, however, presented several barriers to students’ abilities to meet potential new friends and form new connections. We wanted to design a system that helped students overcome this. Thus, Club Collective came to be.
Club Collective is a tool designed to help students categorize, disseminate, and organize information related to their clubs and school organizations.
Project Overview.
Club Collective started with a group of teammates starting their first semester of graduate school… online. Thanks to the COVID-19 pandemic, the classes we had planned on attending had been shifted to a virtual format.
So, once we were tasked with finding a user group to design a tool for, students were our first choice.
Problem
Due to COVID-19, first-year undergraduate students didn’t have the in-person environments or resources that traditionally allow them to to find a community.
Solution
A tool that helps students find clubs to join and allows them to meet others and plan and participate in events.
Project Timeline
Research.
August - September 2020
Understanding our users and the problem. In this phase, we determined our users’ characteristics to design the right tool.
Design.
September - October 2020
Brainstorming, wireframing, and prototyping. We used the information we gathered in the past month and designed things right.
Testing.
November - December 2020
Interviewing, iterating, and adapting. This phase was all about listening to our users and making our design work for them.
Research.
Research Activities
01. Semi-Structured Interviews
We focused on the students’ expectations for the school year, their impromptu interactions, experiences with group interactions, and involvement in organizations. In total, we interviewed 7 students and 1 organizational leader.
02. Observations
Along with the interviews, we also conducted two observations on virtual events hosted by a local university. This helped us collect preliminary data, which we used to orient the interviews, and grounded us in the problem space.
03. Hierarchical Task Analysis
We constructed an analysis of a of the vastly complicated task of warming up event participants. Since students expressed feeling disengaged during virtual meetings, this activity detailed the pain points those meetings.
Hierarchical Task Analysis: A meeting host warming up event participants
Data Analysis
Our data interpreted into over 450 notes, which were sorted in an affinity map. In total, we came out with 8 high-level “green” notes:
Effects of virtual meetings
COVID fears
Club information mismanagement
Successful social distancing events
Online communication and social media
Challenges with club events
Community finding and recruitment
Positive effects of in-person interactions
COVID effects on college experience
Screenshot of our Affinity Map
Design.
01. Design Requirements
Our research efforts helped us determine 3 functional requirements and 4 non-functional requirements to guide the design process:
Non-Functional Requirements
The system organizes information and makes it easily and quickly accessible.
The system must accommodate users who are both physically on campus and who are remote students.
The system must be multi-modal, and accessible with a variety of hardware.
The system should be easily learnable.
Functional Requirements
The design concept must facilitate interactions between students that builds lasting relationships
The design concept should help users find organizations that meet their interests.
The design concept should be mentally engaging and emotionally satisfying.
02. Brainstorming
With each requirement in mind, we brainstormed 10 different ideas on how to help students find a community during the pandemic. To come up with the ideas, we first split up and reviewed the affinity map individually. We each placed a purple note next to the affinity map when we had an idea, and then consolidated them all in this map and discussed the ideas that came the initial review.
The idea we picked is the one we thought best met our requirements and satisfied our users’ goals.
Brainstorming notes and ideas
03. Mockups and Storyboards
After identifying the general purpose of our system, I created mockups and storyboards to simulate the experience our users would have. These two activities were especially useful in helping the team stay on the same page.
04. Visual Language + Identity
With the Club Collective, we wanted students to feel welcome, comfortable, and motivated when they interacted with the system. Because of this, I decided to use sans-serif fonts, with Quicksand, a softer rounder font, as the main typeface.
While the colors listed below are those of the Club Collective brand, they are not the colors the students interact with. Because Club Collective is representative of the university the student belongs to, each university would have the option to update the Club Collective interface with their own colors. In our prototype, the interface’s colors are representative to that of Georgia Tech’s colors.
05. Wireframing and Prototyping
The first concept design was useful in helping make sure the team was on the same page on the app’s features and overall look. After this, I led the team through a wireframing session, where we created baseline designs of our tool’s concept. These wireframes were then turned into a high-fidelity prototype.
05. High-Fidelity Prototype
Testing.
To test the prototype, we devised a series of tests that helped us gather qualitative and quantitative data on our users’ experience with Club Collective. In the end, we concluded future iterations of our design needed to address these changes:
Make the overall experience (communicating with others, staying in a club) more fun and engaging
Make information more obvious (e.g. which parts are clickable)
Use the UI to communicate results and functions with users
Identify club members and their positions in the hierarchy, any including necessary privileges
Expand emphasis and functionality on exploring clubs and events
Allow for outside contact / integration
Reflection.
What first drew me to this project was how similar the problem was to our own – we were first-year graduate students studying amid the COVID-19 pandemic. Honing our user group specifically to first-year undergraduate students, however, was key in helping us stay focused and keep our personal feelings out of the way.
Through this project, I learned a lot about the type of workload that goes into UX projects and how difficult it can be to manage them under tight deadlines. I’m infinitely grateful to my project team and advisors for guiding us through the process.
Team Sperry and the B.I.T.s