RivalryBet
Esports + Sports Betting
Year
2025
Type of Project
Case Study
My Role
UX/UI Designer
Project Overview
RivalryBet is a desktop app designed for esports and sports enthusiasts, offering a seamless and engaging experience. The goal was to create an all-in-one platform with a diverse selection of games, community features, and game insights. Its intuitive design ensures smooth navigation, allowing users to place bets and interact with ease.
Challenge
The challenge was to design a comprehensive desktop betting app that catered to both esports and sports enthusiasts, ensuring ease of use, seamless navigation, and a data-rich experience for highly active bettors.
User Interviews
To better understand how bettors engage with their platforms of choice, what challenges they face, and what features they value most, user interviews were conducted with experienced sports bettors and esports enthusiasts, analyzing their behaviours, frustrations, and needs.
Journey Mapping
To gain more insight into the user journey, we mapped out how bettors navigate their betting platforms, identifying key decision points, frustrations, and opportunities for improvement. This step provided a clearer understanding of user behaviours at each stage, from browsing matches to placing bets and staying engaged over time.
Competitor Analysis
The most popular betting platforms were evaluated using a competitor analysis chart to identify features, usability, and engagement gaps. The availability of esports, analytics tools, rewards, and community features were assessed to determine areas for improvement.
User Personas
User personas were created to represent the needs, behaviours, and frustrations of different types of bettors. These personas helped identify key pain points such as confusing odds systems, lack of esports options, and difficulty researching past matches and statistics.
Concept Development
During the concept development phase, three main areas were focused on: betting experience, user engagement, and rewards. Ideas were explored across these areas, including expanded esports coverage, community chat features, and a rewards system.
Information Architecture
The information architecture was designed to create a structured and intuitive navigation system, ensuring users could easily access key features such as betting options, promotions, news, results, and community engagement.
Style Guide
The style guide was created to establish a unified and visually consistent UI while maintaining usability and accessibility. A structured colour palette, typography system, and grid layout were developed to ensure consistency across the platform.
Sketches
During the sketching phase, the focus was on exploring layout ideas and structuring the user experience across different devices. Sketches were used to test navigation, feature placement, and overall usability before refinement.
Low-Fidelity Wireframes
Low-fidelity wireframes were created to define user flows and structure layouts before introducing detailed design elements. These wireframes prioritized usability, information organization, and navigation clarity.
High-Fidelity Wireframes
High-fidelity wireframes refined the visual design, interactive elements, and overall user experience. Built on the low-fidelity structure, these designs incorporated the style guide, typography, and layout system to ensure a visually cohesive and functional interface.
Prototyping
The prototyping stage focused on creating an interactive experience that simulates real user interactions. Elements such as clickable buttons, hover states, overlays, and transitions were added to refine user flows and validate usability.
User Testing
User testing was conducted using heatmaps to evaluate usability, engagement, and navigation patterns. Key findings included unused space on the right side of the header and betting content, underused chatbox space, and a linear scanning pattern on the navigation panel.
Iterations
Based on testing results, several improvements were made to enhance usability and engagement. The header layout was improved by spacing out key sections and adding search functionality. A “View” button was added to betting content, and navigation spacing was refined for better content separation.
Final UI
The final UI design features refined layouts, improved navigation, and interactive elements that enhance the overall user experience. The design focuses on clear content hierarchy, smooth interactions, and engaging community features.
Animated Walkthrough
The walkthrough showcases the completed RivalryBet Desktop App, highlighting content, overlays, and overall visual design. It provides a realistic representation of the user experience across the platform.
Mockups
The mockups present the final UI design in realistic scenarios across desktop, mobile, and tablet platforms.
Conclusive
RivalryBet improved the online betting experience by bringing new features and focusing on key user pain points. The final design created a more engaging, accessible, and intuitive platform for both beginners and experienced users.