
NBA G League voting allows fans to select their favorite players to participate in the NBA G League Next Up Game. Each ballot allows fans to choose up to five players, including a first guard, second guard, second forward, and center. After voting closes, the top 10 players with the most total votes are invited to participate in the Next Up Game, which takes place during All-Star Weekend.
Led the design process from inception to completion, ensuring a user-centered approach.
Conducted research, analyzed user interviews, and developed user journeys to inform design decisions.
Presented design concepts to clients, incorporating feedback to refine the experience.
Oversaw design implementation, ensuring seamless asset export for developers and smooth execution.
MY ROLE AS A UX/UI DESIGNER
TEAM
Product manager, Developers, Creative Director & NBA G-League marketing team
TIMELINE
OCT 2023 - JAN 2024
Challenges & Requirements
Streamline the voting procedure
Strategize effective display of 28 players' profiles and stats
Implement intuitive player selection based on roles and positions
Enhance fan engagement through lead capture integration
Ensure compatibility across both mobile and desktop platforms
Journey Map & Insights
To create a seamless and engaging voting experience, I mapped out the user journey to identify friction points that emerged in the previous event. As Jebbit had previously collaborated with the NBA G League, this analysis provided valuable insights into recurring challenges. Understanding how users navigated the voting process allowed me to pinpoint areas of frustration and uncover opportunities for improvement.
Excessive Scrolling & List View Navigation
Excessive scrolling and a repetitive selection process made voting cumbersome, leading to user fatigue.
Lack of Visual Feedback
Users have no clear, persistent way to see which players they chose for each position.
Each time a player is chosen, the row simply changes color, but once users scroll away or move to the next position, they lose sight of their previous selections.
Too Many Clicks & Disjointed Process
Users can’t go back to previous screens to revise selections because of the platform constraints. If they want to reselect, they have to restart the voting experience.
After going through tedious steps, users may abandon the process at the lead capture stage, unwilling to provide their information to complete the vote.
Brainstorming
To improve the voting experience, I explored several approaches. I first considered enhancing the list view with a selection panel for better visibility. A card-based layout was another option to create a more interactive feel. While drag-and-drop functionality seemed intuitive, platform limitations and tight timelines made it unfeasible. Instead, I drew inspiration from sports games and designed a basketball court graphic to visually map player positions, making selection more intuitive and engaging.
Design Iterations
To refine the voting experience, I made several key iterations based on usability testing and feedback. These improvements focused on enhancing interaction efficiency, visibility, and engagement, ensuring a seamless and intuitive process for users. Below are the major design enhancements implemented.
I conducted A/B testing to compare a card view and a list view, using internal basketball fans as the test group. The results showed that the card view was more intuitive and engaging, reducing cognitive load and increasing interaction time. Based on both qualitative and quantitative feedback, we moved forward with the card view to enhance the fan experience.
List View VS Card View
To improve usability, we replaced the sort dropdown with sort buttons, allowing users to quickly filter players by Alphabetical order, APG, PPG, and RPG. This change reduced clicks, improved visibility, and made sorting more intuitive and efficient.
Sorting Optimization
To create a cleaner interface, we made the player selection panel hidden by default, reducing visual clutter. The panel appears only when users start selecting players, and a ‘hide’ button was added for better control, ensuring a more focused and flexible experience.
Player Selection Visibility
Solution
1. ENHANCING USER CONTROL: ENABLING SELECTIVE PLAYER CHOICES
To prevent inadvertent selections, users should have the option to both select and deselect players, particularly on mobile devices where touch interactions are prevalent. This feature enhances usability and minimizes errors when navigating through a large player list.
2. STREAMLINING SELECTIONS: VISUALIZING CHOICES FOR EFFORTLESS REVIEW
To alleviate the burden of extensive scrolling, users can now effortlessly review their selections directly on a basketball court graphic. This intuitive visualization eliminates the need for users to navigate lengthy scrolls, providing immediate visibility of chosen players and enhancing the overall efficiency and enjoyment of the voting process.
3. CONSOLIDATED PLAYER SELECTION PROCESS
Due to limitations within the Jebbit builder platform, integrating a conventional back button is challenging, especially when custom CSS is involved. In response, we optimized the user experience by consolidating the player selection process. Users no longer need to select backcourt and frontcourt players separately, streamlining the process.
EXPERIENCE LINK (VOTING CLOSED)
Outcome & Takeaway
By implementing these enhancements, we not only optimized the user experience but also enabled our clients to achieve their goal of increasing engagement rates. With an impressive engagement rate of 81% and a completion rate of 77%, our solution surpassed expectations, marking a 5% increase compared to the previous event.
Amidst growing interest in engaging gamified experiences, businesses are seeing the benefits of gamification in boosting engagement. While developing solutions for the NBA G League voting event, we explored using drag-and-drop for player selection. Unfortunately, limitations of the Jebbit platform made implementation infeasible at that time. However, we are actively improving our capabilities to incorporate more gamified features, aiming to provide richer, more interactive experiences in future events and drive higher engagement and participation.