Invitation and Roster Redesign
Lacrosse Labs is a play designer and administrative tool for lacrosse teams. I redesigned the invitation and roster experience so coaches can efficiently manage their teams.
Role
UX/Product designer in
team of 4
Timeline
6 months
Tools
Figma
FigJam
Sketching
Miro
Trello
Zeplin
Problem
Coaches require backend support due to the confusing invitation process
Coaches play a critical role in shaping their team's performance, but are increasingly burdened with administrative tasks. The existing design for inviting team members and managing the team roster was was confusing and led to inefficiencies that reduced productivity and left coaches feeling frustrated.
Solution
Streamline team registration and management
Multiple invitation methods
Manage team roster
Add, remove, or edit member details
Define and assign roles within the team
View member registration status
Status tracking
Sort and filter based on registration status
Monitor and follow up on pending registrations
Send personalized reminders to team members
Discover
Finding improvement opportunities
After speaking with the client, we learned the current invitation methods are causing confusion among coaches and leading to an increase in troubleshooting emails. Additionally, once players are added to the roster and invited, coaches are having difficulty keeping track of their registration status.
Research
Coaches want to spend time coaching, not doing administrative tasks
Lacrosse coaches typically have 20-50 players (depending on the program) that they need to onboard to the platform. The process of uploading the roster is time-consuming, and coaches frequently encounter registration issues. Once players are invited, coaches turn to other tools to keep track of registration.
5
user interviews
4
1
stakeholder interview
🫨 Surprising Find
The "Import Roster" feature was already a feature offered by Lacrosse Labs, but most coaches did not know the feature existed.
Main Takeaways:
01
Bulk invitations and bulk roster uploads would make onboarding and invitation more efficient
02
Coaches want a quick, easy, at-a-glance method to check registration statuses of players
03
Current invitation methods are confusing and convuluted
Pain Points
1
Uploading team roster to platform
2
Tracking registration status
3
Reminding players to register
Define
Our vision
Project Objective
Create a seamless and intuitive experience for coaches to invite team players based on their team type, understand the status of and manage invitations, manage the list of invited players and their roles.
Goals
Coach: Get all team members registered on the platform
Business: Reduce troubleshooting tickets and convert visitors into paying customers
Ideation
Transitioning from problem space to design phase
How Might We simplify building rosters and managing team invitations for lacrosse coaches so that they spend less time on administrative tasks?
Crazy 8s
My concepts during Crazy 8 exercise and votes from the team on Miro
"Inviting members is essentially a one-time thing, so make it as simple, painless, & intuitive as possible."
Chris T., Lacrosse Coach
Design
Bringing our ideas to life
Improved User Flows
Early Sketches
LoFi Wireframes
Build Your Team shows three clear options for inviting team members. Coaches are guided through each step of adding their members and coaches.
Add Players/Coaches/Review include a progress indicator so coaches know how far along they are with completing the roster upload and invitation process.
Invite is redesigned to include a text field so coaches can send personalized invitation messages to their team members.
Roster includes registration status column so coaches can easily tell which players are registered.
High Fidelity Wireframes
Testing
Making some changes
We conducted moderated remote usability tests with 5 participants on the V1 and V2 clickable prototypes.
Build Your Team
From user interviews, 100% of participants preferred to import their roster, so the import roster option was made more prominent and options were vertically aligned from most used to least used.
Adding Team Members
We separated the form from the roster table to make it easier to add members. “Skip” button allows coaches to skip sections while saving their progress. Progress bars were added as some participants did not know which step they were in the process
Roster Table
A more robust table was designed for the roster to allow for more information, as well as sort and filter functions. A scroll hint was added as some participants did not know they were able to scroll. Lastly, alternating row colors were added to aid with readability.
Final Solution
Improved hierarchy and typography
Increased spacing between elements and increased font and button size to increase legibility and chunking. In addition to making the design feel more modern, this provides greater visibility of information.
Clear invitation methods
Pain point #1
Redesigned invitation process so options for inviting players are more clear for coaches, including highlighting preferred method of invitation, and descriptions for each method of invitation.
Redesigned user flow
To provide guidance to coaches, progressive disclosure was used to reduce decision fatigue. The new "Build Your Team" page clearly lays out the three paths coaches can take to invite their players.
Improved manual roster input
Pain point 1
Manually adding players is the least preferred method of invitation. This option requires coaches to input five or more fields of information for each member to add them to the roster. Having to do this for a team of 20 players requires serious patience and a keen eye for detail.
Breaking down the task
Each step (add coaches, add players, review, invite) now has a separate page to make each step feel more manageable.
Restructuring the page organization
In the existing design, when the list of members reached certain length, the "Invite" button would be scrolled out of view become difficult to access. I solved this by:
Moving the input form to the top of the page for easy access
Creating a table below to populate data and provide feedback
Adding bottom bar to house the CTA buttons for discoverability and visibility
Adding member interaction
Optimized roster management
Pain points 2 and 3
Coaches had trouble organizing their roster and resorted to other tools to monitor the status of their players' registration status. Table formatting with a dedicated registration status column, filtering, and bulk actions were implemented to make the roster easier to navigate.
Clear registration status view
Table formatting with horizontal scrolling to accommodate larger font sizes and more information
Registration status column to enable coaches to easily view the status of each member's invitation
Microinteraction to provide a clear indication to users that the table can be scrolled
Table scroll interaction
Reminding pending players to register
Filtering was added to make it easier to remind pending members to join the team. Coaches can then send a reminder to pending players to register.
Filter and nudge invite interaction
Final Prototype
Mockups
Other Projects
Transizion
View Case Study
Streami
View Case Study
