Boys and Girls Clubs of Metro Atlanta Attendance Tracker Dashboard

USER RESEARCH · DATA VISUALIZATION

Overview

During my semester working with Bits of Good, a non-profit organization at Georgia Tech, I collaborated with product managers and developers to design and build an attendance tracker dashboard for Boys and Girls Clubs of Metro Atlanta. From this project, I learned how to align a product with the goals of multiple stakeholders in an organization.

The BGCMA leadership reached out to us with a need to collect data from multiple clubs across the US to keep track of safety incidents, however through interviews with club-level managers we found that safety wasn't necessarily the core issue. By working closely with club managers during the process, we found that they valued the ability to automate important tasks that often fall behind on their priority list.

Project Timeline
Jan - Apr 2020
15 weeks

Collaborating Department(s)
Bits of Good
Boys and Girls Clubs of Metro Atlanta

Supervisor
Huan Deng

Role
UX Designer

Special Thanks to
Teammates - Stephanie Yang, Vadini Agrawal, George Jacob, Samyak Kumar, the BGC Safety Dev Team
Clients - Natasha Rice, Robin Kamara, Bobby Dunn, Kimberly Lucas, Tyquan Johnson

THE PROBLEM

BGCMA is having trouble utilizing buses at max capacity.

THE SOLUTION

Help club managers quickly identify students that aren't utilizing the bus service enough and give their spot to waitlisted students.

Simple Overall View of Attendance Data
Attendance count is shown in a bar graph and color-coded in a RAG (Red Amber Green) status for easy viewing.

Attendance Data Per Student
Covers all important information about the student with a primary action button to contact the student. Calendar is marked every time the student checks in the bus.

Active
Student is using the bus normally.

Low Attendance
Student's bus attendance is low and compromising their spot on the bus. The club manager needs to contact them.

Inactive
Student is put as temporary inactive member and lost their spot.

Design Process

ABOUT THE CLIENT

Boys and Girls Clubs of Metro Atlanta (BGCMA)

Boys & Girls Clubs of Metro Atlanta works to provide safe, positive, and engaging environment and programs that prepare and inspire children and teens to achieve great futures. With different clubs spread across Atlanta, each location provides space for learning and enjoyment.

Their goal by 2020 is for 90% of kids coming to their clubs 3 or more days a week are on track to graduate on time, live healthy, and give back to their community.

BGCMA currently does not have a standardized way across all clubs to identify and record students who use the BGCMA bus service.

For the BGCMA club directors
Lack the ability to easily keep track of which of their student members are actually using the bus service regularly.

This makes it difficult to have buses be utilized at max capacity, especially when buses usually have waiting lists for students needing to use them.

For the BGCMA executive team
Lack the ability to use bus attendance data to optimize bus routes and keep track of safety incidents across all clubs.

USER INTERVIEWS

Learned About BGCMA's Bus Roster and System

On the first day, we talked to our clients:
- IT Director
- Sr. Dir. of Risk, Safety, & Facility Ops
- Vice President of Field Ops

We later went to Harland Boys and Girls Club to interview club director and 2 bus drivers. From here, we found out that there was a disconnect between the executive team and club-level directors.

While the executive team believed untracked safety incidents were the main issue, the club director and bus drivers told us that in reality, these safety incidents are a rare occurrence.

The real issue is the lack of a standardized system across all clubs, only paper and CSVs, and the difficulty of optimizing bus capacity when students are under-utilizing their spots and bus drivers are spread thin.

Bus Check-In

Bus Check-In - Bus Driver Side
The bus driver is responsible for picking up students from schools and checking them in the bus using some sort of ID. Bus drivers typically remember the students' faces so they'll just mark their attendance on the bus roster print out.

Club Check-In

Club Check-In - Club Director Side
The club director is responsible for creating and printing the roster itself, based on student registraton data. The club director is also in charge of moving students from the bus service waitlist should there be any vacant spots and contacting students who have not been using the bus service.

Wireframes

We decided to focus on club directors when making our wireframes because they play a role in every part of the bus and club attendance system.

Their responsibilities range from creation of roster, managing bus routes, adding and dropping students from the roster, managing the waitlist, and more.

Barcodes for Club Attendance Identity Check

Since the younger children often forget their IDs, the club director has barcodes associated with each children in a booklet. The club director would scan the barcodes to check children in the club.

In our wireframes, the barcodes would turn yellow if they checked in the club without the bus and green if they checked in both club and bus.

Narrowing Down the Scope to Only Bus Attendance

Along the way we decided to narrow down the scope and focus solely on bus attendance.

Our Goal
Show the club directors a high level view of how much the students are actually using the bus.

Main Idea
If a student is not using the bus enough, they would risk losing their spot to someone in the long waitlist.

The Club Director as Our Main Target User

The Disconnect
Contacting students who aren't using the bus and revisiting the waitlist is typically not on the club director's priority list

Tasks & Priorities
Club directors have many more immediate tasks at hand revolving around running the club on a daily basis.

The Need
Our club director needs the process of redistributing bus capacity to be automated so she can save time and effort for more demanding tasks.

User Feedback

Our expectations
Our idea was that the 5 squares represented 5 days of the week (Monday to Friday).

Squares aren't intuitive
It took a while for the club director to understand that the squares were supposed to be days.

Filters not fully thought out
There was also the lack of clarity for filter / sort.

Round 3

So, naturally we added letters to show days more clearly and fixed sort and filtering, for example, drop-down menus for school and grade, toggle to only show low attendance.

Scrapping the Squares

There's still many issues with the squares. What if there's 5 weeks in a month? What if the first week of January starts on a Friday or Saturday?

We took a step back and decided to re-evaluate the squares format.

Showing how many days instead of what days
Thinking about what information club directors actually need, at a high-level, it does not matter what days the student uses the bus. Instead, the club director only needs to see how much they are using their spot on the bus.

Zooming into details only if needed
Same thing goes with month, it does not need to be shown at a high-level, which was why we decided to put this information in a modal when a student name is clicked on with a more familiar calendar layout.

Final Product

Demo-ed to our clients and got some really good feedback! :)