SportsX - Toronto Maple Leafs
1.3M
The app design captivated an estimated 1.3 million passionate Maple Leafs fans, delivering an engaging and seamless experience.
Overview
MLSE partnered with IBM to redesign its mobile platform, focusing on two key user groups: Equipment Managers and Fans, enhancing both operational efficiency and fan engagement.
My Role
UI/UX Lead
Team
IBM Agile team
(25 Team members)
Software
Figma, Mural
Platform
Mobile
Project Timeline
9 Months
MVP1, MVP2, MVP3
About the project
A dedicated team of 20 professionals - including developers, designers, business analysts, and content writers was assembled to drive the project forward. Designed as a nine-month initiative, the project required rapid delivery of initial wireframes and prototypes within a short timeframe. Upon proposal approval, the scope would expand over several months, necessitating additional full-time team members to support the development of MVP1, MVP2, and MVP3.
Research and Iteration Process
Conducted in-depth research on the company, identifying key user groups and defining the primary problem to solve.
Engaged directly with Directors, Equipment Managers, and Fans at the Maple Leafs’ headquarters in downtown, using open-ended questions to understand their daily tasks, pain points, and desired improvements.
Collected valuable insights and data to inform user personas, journey maps, and workflow designs.
Analyzed the NFC tag scanning process to understand how products were categorized and managed within inventories.
Collaborated with the Creative Team to gather Sport X branding assets for seamless integration into the design.
With a well-defined problem and a clear understanding of user needs, we established a structured roadmap to guide the design process effectively.
The Design Thinking Process
Problem Statement
The existing app struggled with performance issues, plagued by slow load times and an overly complex user flow, leading to frustration and inefficiencies.
Authentication was unreliable, making the integration of an NFT tag system crucial for secure and seamless verification.
Equipment Managers faced bottlenecks, with slow scanning and categorization processes hindering inventory management and operational efficiency.
The overall user experience felt outdated, demanding a modern, intuitive, and streamlined redesign to meet user expectations.
Goal
Craft a sleek, intuitive interface that enhances usability and streamlines daily workflows for both user groups, ensuring a frictionless experience.
Seamlessly integrate an advanced NFT tag system to accelerate scanning and authentication, boosting efficiency and transforming the way users interact with digital assets.
Impact
Optimized scanning efficiency for Equipment Managers, cutting processing time and streamlining operations.
Revolutionized the fan experience with an intuitive, frictionless design that enhances engagement.
Connected with 1.3 million passionate Maple Leafs fans, amplifying brand reach and loyalty.
Elevated in-store engagement, turning products into interactive, immersive experiences that captivated fans.
NFC Tags
Here’s a real NFC tag-embedded in the jersey’s neckline, ready to be scanned for instant access to its unique history and authentication data.
I collaborated closely with developers to design and refine the NFC scanning experience, crafting intuitive screens that seamlessly read and process tag data. Through rigorous iteration, trial, and error, we cracked the technology, fine-tuned the process, and built a powerful yet effortless scanning system that ensures a smooth, reliable experience for users.
Wireframing and Prototype process in Figma
Starting with sticky note brainstorming, I mapped out the user journey and transformed ideas into digital wireframes. From there, I brought the vision to life in high-fidelity Figma prototypes, designing a sleek, seamless experience enriched with motion design and micro-animations for added engagement. This iterative process evolved through multiple redesigns, shaped by stakeholder feedback, ensuring the final prototype closely mirrored the real product—both in functionality and visual polish.
Equipment Manager Flow
Fan Experience Flow
Sign In and Account flow
Asset validated and Jersey details screens
(Shown in the image on the right)
The jerseys featured interactive colored hotspots that brought their history to life. When clicked, these hotspots revealed compelling stories about the players who wore them—highlighting battle scars like stains, rips, dents, and scratches from intense gameplay. Every mark became a testament to the game, transforming each jersey into a one-of-a-kind collectible with a rich, authentic story.
New / Share asset and video highlights flow
NFC scan prototyping
App isn’t installed on the phone. (Video of interaction prototype)
App is already installed on the phone. (Video of interaction prototype)
Jersey Details Screen (Video of interaction prototype)
• Price displayed
• Game-Worn badge
• Favorite Item
• Verified and Authentication Badge
• Feature & Transaction History
• Exclusive Content / Video
• Interactive spotlights unveil text boxes with fascinating stories about the players who wore the jerseys. Each spotlight highlights unique details—stains, rips, dents, and scratches—every mark of wear and tear that adds character and authenticity. These imperfections transform each jersey into a one-of-a-kind collectible with a rich history.
