UI and UX design

Paris Saint- Germain

Sports Betting App

More Videos

Location

Paris, France

Brief

Create a UI/UX design sequence from provided interface layouts, visual assets, and platform requirements to map complete user flows, screen interactions, and navigation paths. Develop wireframes and interactive prototypes to define key journeys, decision points, and task sequences, ensuring a seamless, intuitive, and engaging experience for users across the On-Sport platform for Paris Saint-Germain.

Tools

Adobe Illustrator, Photoshop Photoshop & Adobe XD, Figma

Five mobile screens showing PSG betting app journey mapping with structured user flow, navigation logic and interaction design system

This UI/UX design project explores a high-performance mobile betting experience built for Paris Saint-Germain supporters, combining intuitive interface design with real-time match interaction. The app focuses on seamless navigation, clear user flows, and responsive micro-interactions, ensuring users can engage with betting features quickly and efficiently across a mobile-first environment.

The experience is enhanced through data-driven features such as score prediction, player insights, and live match tracking, creating a more immersive and strategic betting journey. By integrating usability principles with engaging visual design, the app delivers a streamlined, interactive platform that strengthens user engagement while elevating the overall sports betting experience.

...Paris Saint-Germain is a symbol of sporting excellence, boldness, and elegance...

Kylian Mbappé wearing Paris Saint-Germain kit, smiling for a high-resolution football portrait used for branding and promotion

Snack Bar

The Snack Bar in your PSG betting app provides a sleek and intuitive navigation experience. With clear, easy-to-recognize icons, users can quickly access bets, match stats, live scores, and other essential features without leaving the main screen. Designed specifically for mobile UI, it keeps everything organized and just a tap away.

Beyond convenience, the Snack Bar enhances user engagement by making the betting journey seamless. Fans of Paris Saint-Germain can effortlessly switch between features, ensuring they never miss an opportunity to place a wager or track their favorite players during live matches.

Navigation bar featuring PSG branding with icons for home, match stats, live scores, predictions, and mobile app interaction

Score Bet

The Score Bet feature allows users to place wagers on the final score of Paris Saint-Germain matches with precision and confidence. It provides real-time match updates, odds, and predictive insights, giving bettors a smarter and more informed betting experience. The interface is optimized for mobile use, making score predictions fast and intuitive.

Score Bet also enhances engagement by catering to fans who enjoy strategic betting. By combining PSG match data, player stats, and historical results, users can make well-informed predictions, track outcomes instantly, and experience the excitement of betting in a responsive and visually appealing app environment.

Interactive score prediction interface with adjustable goal inputs, allowing users to submit match outcome bets quickly on mobile
Team analysis screen showing PSG preview data, performance metrics and head to head statistics within sports betting platform
Opponent stats screen featuring Club Brugge metrics, comparison data and structured match insights within betting application
Preset score options displayed in clean interface enabling rapid betting decisions with simplified selection and minimal interaction steps

Golden Goal

Golden Goal gives users the thrill of predicting the decisive moment in Paris Saint-Germain matches. Players can bet on which team will score the match-winning goal, adding an exciting layer to live betting. The feature is designed for quick, intuitive interaction, allowing users to place bets in real-time without interrupting their match experience.

Beyond fast-paced betting, Golden Goal keeps fans engaged by combining PSG match data, player stats, and live updates. Users can track who is most likely to score, analyse trends, and make strategic bets, making every goal opportunity an exciting chance to win. This feature enhances the mobile app experience by merging the intensity of live soccer with interactive betting.

Live betting screen showing match details, kickoff time and competition info with prompt to predict first goal event and timing
Scrollable player selection interface with circular percentage graph visualising popularity for first goal scorer prediction choices
Mobile slider control allowing users to select exact goal minute with half selection toggle for accurate betting interaction design
Confirmation interface showing selected bet details with edit option, notification toggle and access to rules and terms links

Ultimate Team Player

The Ultimate Team Player tool identifies Paris Saint-Germain’s top-performing players, highlighting stats, key moments, and contributions on the pitch. Users can analyize player performance trends to make informed decisions when placing bets, giving them an edge in both fantasy and live betting scenarios. The feature is fully integrated into the mobile app, ensuring a smooth, interactive experience.

Beyond stats, Ultimate Team Player encourages fan engagement by spotlighting PSG stars and their impact on matches. Whether tracking goals, assists, or defensive plays, users can stay connected with player performance, enhancing both betting strategy and their overall enjoyment of the app.

Interactive pitch layout with eleven player slots and match fixture display enabling users to build custom team lineup visually
Formation selection interface offering multiple tactical layouts with role filters for goalkeeper, defence, midfield, and forward positions
Team review interface allowing users to confirm selected players and formation before proceeding to gameplay or betting stage
Final team overview screen presenting completed lineup with clear call to action for match start and interactive engagement

Similar Projects

© MMXXVI  Rory J. Murphy | All rights reserved.

Rory J. Murphy Logo - Click to go back home
Envelope icon linking to an email address for quick and easy contact.
Vimeo logo - click to watch Rory's video projects and portfolio on Vimeo
LinkedIn logo - Rory's LinkedIn page and connect with us
Dribbble icon - click to view Rory's design work and portfolio on Dribbble

Hire Rory

Five mobile screens showing PSG betting app journey mapping with structured user flow, navigation logic and interaction design system
Kylian Mbappé wearing Paris Saint-Germain kit, smiling for a high-resolution football portrait used for branding and promotion
Navigation bar featuring PSG branding with icons for home, match stats, live scores, predictions, and mobile app interaction
Interactive score prediction interface with adjustable goal inputs, allowing users to submit match outcome bets quickly on mobile
Team analysis screen showing PSG preview data, performance metrics and head to head statistics within sports betting platform
Opponent stats screen featuring Club Brugge metrics, comparison data and structured match insights within betting application
Preset score options displayed in clean interface enabling rapid betting decisions with simplified selection and minimal interaction steps
Live betting screen showing match details, kickoff time and competition info with prompt to predict first goal event and timing
Scrollable player selection interface with circular percentage graph visualising popularity for first goal scorer prediction choices
Mobile slider control allowing users to select exact goal minute with half selection toggle for accurate betting interaction design
Confirmation interface showing selected bet details with edit option, notification toggle and access to rules and terms links
Interactive pitch layout with eleven player slots and match fixture display enabling users to build custom team lineup visually
Formation selection interface offering multiple tactical layouts with role filters for goalkeeper, defence, midfield, and forward positions
Team review interface allowing users to confirm selected players and formation before proceeding to gameplay or betting stage
Final team overview screen presenting completed lineup with clear call to action for match start and interactive engagement
Envelope icon linking to an email address for quick and easy contact.
Clickable home icon to inicate to the user that tapping this will take them to the homepage
"Product icon (active) – Currently browsing our print-on-demand store.
Product icon linking to our print-on-demand store page for browsing and purchasing items.
Highlighted Praise icon in navigation showing you are currently on the Testimonials page
Testimonials icon showcasing customer reviews.
Active contact icon indicating you are on the Contact page
Contact icon directing to the social and contact page.

Five mobile screens showing PSG betting app journey mapping with structured user flow, navigation logic and interaction design system
Kylian Mbappé wearing Paris Saint-Germain kit, smiling for a high-resolution football portrait used for branding and promotion
Navigation bar featuring PSG branding with icons for home, match stats, live scores, predictions, and mobile app interaction
Interactive score prediction interface with adjustable goal inputs, allowing users to submit match outcome bets quickly on mobile
Team analysis screen showing PSG preview data, performance metrics and head to head statistics within sports betting platform
Opponent stats screen featuring Club Brugge metrics, comparison data and structured match insights within betting application
Preset score options displayed in clean interface enabling rapid betting decisions with simplified selection and minimal interaction steps
Live betting screen showing match details, kickoff time and competition info with prompt to predict first goal event and timing
Scrollable player selection interface with circular percentage graph visualising popularity for first goal scorer prediction choices
Mobile slider control allowing users to select exact goal minute with half selection toggle for accurate betting interaction design
Confirmation interface showing selected bet details with edit option, notification toggle and access to rules and terms links
Interactive pitch layout with eleven player slots and match fixture display enabling users to build custom team lineup visually
Formation selection interface offering multiple tactical layouts with role filters for goalkeeper, defence, midfield, and forward positions
Team review interface allowing users to confirm selected players and formation before proceeding to gameplay or betting stage
Final team overview screen presenting completed lineup with clear call to action for match start and interactive engagement
Tablet displaying Adobe marketing brochure with structured typography, campaign visuals and polished editorial layout system
Travel booking mobile app shown in hand featuring destination browsing, booking flow and user friendly navigation experience
Clickable home icon to inicate to the user that tapping this will take them to the homepage
Arrow icon; click to go back to the previous page you were on
Mail icon providing a direct link for users to contact the website via email.

Five mobile screens showing PSG betting app journey mapping with structured user flow, navigation logic and interaction design system
Kylian Mbappé wearing Paris Saint-Germain kit, smiling for a high-resolution football portrait used for branding and promotion
Navigation bar featuring PSG branding with icons for home, match stats, live scores, predictions, and mobile app interaction
Interactive score prediction interface with adjustable goal inputs, allowing users to submit match outcome bets quickly on mobile
Team analysis screen showing PSG preview data, performance metrics and head to head statistics within sports betting platform
Opponent stats screen featuring Club Brugge metrics, comparison data and structured match insights within betting application
Preset score options displayed in clean interface enabling rapid betting decisions with simplified selection and minimal interaction steps
Live betting screen showing match details, kickoff time and competition info with prompt to predict first goal event and timing
Scrollable player selection interface with circular percentage graph visualising popularity for first goal scorer prediction choices
Mobile slider control allowing users to select exact goal minute with half selection toggle for accurate betting interaction design
Confirmation interface showing selected bet details with edit option, notification toggle and access to rules and terms links
Interactive pitch layout with eleven player slots and match fixture display enabling users to build custom team lineup visually
Formation selection interface offering multiple tactical layouts with role filters for goalkeeper, defence, midfield, and forward positions
Team review interface allowing users to confirm selected players and formation before proceeding to gameplay or betting stage
Final team overview screen presenting completed lineup with clear call to action for match start and interactive engagement
Tablet displaying Adobe marketing brochure with structured typography, campaign visuals and polished editorial layout system
Travel booking mobile app shown in hand featuring destination browsing, booking flow and user friendly navigation experience

Five mobile screens showing PSG betting app journey mapping with structured user flow, navigation logic and interaction design system
Kylian Mbappé wearing Paris Saint-Germain kit, smiling for a high-resolution football portrait used for branding and promotion
Navigation bar featuring PSG branding with icons for home, match stats, live scores, predictions, and mobile app interaction
Interactive score prediction interface with adjustable goal inputs, allowing users to submit match outcome bets quickly on mobile
Team analysis screen showing PSG preview data, performance metrics and head to head statistics within sports betting platform
Opponent stats screen featuring Club Brugge metrics, comparison data and structured match insights within betting application
Preset score options displayed in clean interface enabling rapid betting decisions with simplified selection and minimal interaction steps
Live betting screen showing match details, kickoff time and competition info with prompt to predict first goal event and timing
Scrollable player selection interface with circular percentage graph visualising popularity for first goal scorer prediction choices
Mobile slider control allowing users to select exact goal minute with half selection toggle for accurate betting interaction design
Confirmation interface showing selected bet details with edit option, notification toggle and access to rules and terms links
Interactive pitch layout with eleven player slots and match fixture display enabling users to build custom team lineup visually
Formation selection interface offering multiple tactical layouts with role filters for goalkeeper, defence, midfield, and forward positions
Team review interface allowing users to confirm selected players and formation before proceeding to gameplay or betting stage
Final team overview screen presenting completed lineup with clear call to action for match start and interactive engagement
Clickable home icon to inicate to the user that tapping this will take them to the homepage
Arrow icon; click to go back to the previous page you were on

Five mobile screens showing PSG betting app journey mapping with structured user flow, navigation logic and interaction design system
Kylian Mbappé wearing Paris Saint-Germain kit, smiling for a high-resolution football portrait used for branding and promotion
Navigation bar featuring PSG branding with icons for home, match stats, live scores, predictions, and mobile app interaction
Interactive score prediction interface with adjustable goal inputs, allowing users to submit match outcome bets quickly on mobile
Team analysis screen showing PSG preview data, performance metrics and head to head statistics within sports betting platform
Opponent stats screen featuring Club Brugge metrics, comparison data and structured match insights within betting application
Preset score options displayed in clean interface enabling rapid betting decisions with simplified selection and minimal interaction steps
Live betting screen showing match details, kickoff time and competition info with prompt to predict first goal event and timing
Scrollable player selection interface with circular percentage graph visualising popularity for first goal scorer prediction choices
Mobile slider control allowing users to select exact goal minute with half selection toggle for accurate betting interaction design
Confirmation interface showing selected bet details with edit option, notification toggle and access to rules and terms links
Interactive pitch layout with eleven player slots and match fixture display enabling users to build custom team lineup visually
Formation selection interface offering multiple tactical layouts with role filters for goalkeeper, defence, midfield, and forward positions
Team review interface allowing users to confirm selected players and formation before proceeding to gameplay or betting stage
Final team overview screen presenting completed lineup with clear call to action for match start and interactive engagement
Active contact icon indicating you are on the Contact page

Portrait layout of PSG betting app screens highlighting user navigation patterns, interface structure and mobile interaction design system
Kylian Mbappé wearing Paris Saint-Germain kit, smiling for a high-resolution football portrait used for branding and promotion
Compact interface using PSG colours and icons to access match updates, betting tools, player stats, and interactive features
Interactive score prediction interface with adjustable goal inputs, allowing users to submit match outcome bets quickly on mobile
Team analysis screen showing PSG preview data, performance metrics and head to head statistics within sports betting platform
Opponent stats screen featuring Club Brugge metrics, comparison data and structured match insights within betting application
Preset score options displayed in clean interface enabling rapid betting decisions with simplified selection and minimal interaction steps
Live betting screen showing match details, kickoff time and competition info with prompt to predict first goal event and timing
Confirmation interface showing selected bet details with edit option, notification toggle and access to rules and terms links
Mobile slider control allowing users to select exact goal minute with half selection toggle for accurate betting interaction design
Scrollable player selection interface with circular percentage graph visualising popularity for first goal scorer prediction choices
Interactive pitch layout with eleven player slots and match fixture display enabling users to build custom team lineup visually
Formation selection interface offering multiple tactical layouts with role filters for goalkeeper, defence, midfield, and forward positions
Team review interface allowing users to confirm selected players and formation before proceeding to gameplay or betting stage
Final team overview screen presenting completed lineup with clear call to action for match start and interactive engagement
Clickable home icon to inicate to the user that tapping this will take them to the homepage
"Product icon (active) – Currently browsing our print-on-demand store.
Product icon linking to our print-on-demand store page for browsing and purchasing items.
Highlighted Praise icon in navigation showing you are currently on the Testimonials page
Testimonials icon showcasing customer reviews.
Active contact icon indicating you are on the Contact page
Contact icon directing to the social and contact page.

Portrait layout of PSG betting app screens highlighting user navigation patterns, interface structure and mobile interaction design system
Kylian Mbappé wearing Paris Saint-Germain kit, smiling for a high-resolution football portrait used for branding and promotion
Compact interface using PSG colours and icons to access match updates, betting tools, player stats, and interactive features
Interactive score prediction interface with adjustable goal inputs, allowing users to submit match outcome bets quickly on mobile
Team analysis screen showing PSG preview data, performance metrics and head to head statistics within sports betting platform
Opponent stats screen featuring Club Brugge metrics, comparison data and structured match insights within betting application
Preset score options displayed in clean interface enabling rapid betting decisions with simplified selection and minimal interaction steps
Live betting screen showing match details, kickoff time and competition info with prompt to predict first goal event and timing
Confirmation interface showing selected bet details with edit option, notification toggle and access to rules and terms links
Mobile slider control allowing users to select exact goal minute with half selection toggle for accurate betting interaction design
Scrollable player selection interface with circular percentage graph visualising popularity for first goal scorer prediction choices
Interactive pitch layout with eleven player slots and match fixture display enabling users to build custom team lineup visually
Formation selection interface offering multiple tactical layouts with role filters for goalkeeper, defence, midfield, and forward positions
Team review interface allowing users to confirm selected players and formation before proceeding to gameplay or betting stage
Final team overview screen presenting completed lineup with clear call to action for match start and interactive engagement