Pinnacle Casino
TL;DR / Summary.
As a Senior UI Designer at Pinnacle, I led the UI redesign of the Pinnacle Casino product; a complex, multi-screen project spanning desktop and mobile. The redesign embodied a dark-mode aesthetic to establish a distinct product identity, moving away from the existing light-mode design, and encompassed a component library, personalised carousel-driven content discovery inspired by the Netflix pattern, promotional game tiles featuring a new "break out of the container" character artwork style, and a mobile "shake to randomise" gesture, all of which was designed to enrich the gaming experience.
Working in close collaboration with the UX Team, who conducted competitor analysis, defined Casino-specific user personas, and produced the wireframes and user flows, I translated their foundations into a polished, accessible, and engaging visual experience. A UI style guide was developed to ensure consistency across the many screens required, with game tiles, banners, navigation elements, interaction states, and micro-animations all produced to support a thorough development handover.
The redesign received full stakeholder approval and progressed into development, where CMS constraints required some design adjustments. The project was subsequently paused following the unexpected departure of the Casino Manager before reaching launch. The design work completed represents a fully validated, stakeholder-approved redesign that demonstrates end-to-end UI leadership on one of Pinnacle's most prominent products.
The Brief.
Pinnacle's Casino product is a well-established and highly reputable gaming experience, hosting a wide range of titles across slots, roulette, blackjack, and table games, alongside numerous third-party gaming software providers. Despite its strong user base, the product's design had become outdated and was in need of a significant refresh.
With the arrival of a new Casino Manager, a full UI redesign became a primary objective. The goals were clear; drive more players to the product, create a more engaging and immersive experience, optimise the mobile experience to reduce drop-off rates amongst players who predominantly game on their devices, and introduce a dedicated area for promotional content to encourage opt-ins and increase engagement with offers.
Once the project plan, timelines, and expected outcomes were defined, all relevant teams were briefed on their respective involvement. The project was then handed to the UX Team to begin their analysis and establish the foundations upon which the redesign would be built.
Previous Pinnacle Casino UI
UX Research and Wireframing.
The UX Team began by evaluating the existing Casino product, testing interactions, and analysing user behaviour data to identify weaknesses and opportunities for improvement. Drawing on the existing Sportsbook personas as a foundation, Casino-specific personas were developed to reflect the slightly different motivations and behaviours of Casino players. Competitor analysis was undertaken to explore what additional content and features could enrich the experience, inspiring the introduction of game tags (such as "New" and "Exclusive"), the ability to favourite a game, contextual game information including recent player winnings, and a short video animation within the game tile, on hover, to give users a preview of the gameplay before committing to a title. The Netflix design pattern was identified as the most appropriate approach for surfacing the large volume of game content available.
Ideally, a combination of ethnographic field research, focus group sessions, and one-to-one interviews would have been conducted at this stage to more accurately define user motivations, pain points, and goals. Due to time and resource constraints this was not possible, however the team progressed with confidence based on the data and analysis gathered. Mobile and desktop wireframes were produced alongside their respective user flows, with close collaboration between the UX and UI teams throughout; ideas, questions, and alternative approaches were exchanged and considered, with amendments made where improvements could be identified. Following internal reviews and a rigorous stakeholder presentation and Q&A session, approval was granted and the project moved into the UI phase.
UI Design.
After analysing the finalised wireframes, I began shaping the visual direction using Pinnacle's core brand elements; colour palettes, typography, iconography, and CTAs. The dark-mode aesthetic was the primary focus, establishing a distinct product identity that moved away from the existing light-mode design and created an engaging contrast between the interface components and the rich game imagery. Accessibility was considered throughout; colour contrast was validated against web standards, font sizes were confirmed as legible across desktop and mobile resolutions, and form fields and icons were clearly labelled.
The desktop homepage hero featured a large promotional game tile with layered character artwork that broke out of the container boundaries, adding depth and visual dynamism, establishing it as the defining visual treatment for promotional tiles throughout the redesign. An internal carousel of related game tiles sat within the promotional tile, allowing users quick access to games within the same category. Beneath the hero, a range of game categories were presented using horizontal carousels, including the personalised "Continue Playing" category, bringing relevance to the experience and supporting the objective of reducing drop-off rates. On mobile, the promotional tiles were removed to prioritise visible game content above the fold, with a carousel indicator applied to aid navigation through each category.
Game tiles were designed using the 16:9 aspect ratio, displaying game titles, category tags, a favouriting option, and contextual information such as recent player winnings. Hovering over a tile revealed a short video animation previewing the gameplay, creating a more engaging experience than the existing static grid. For the All Games page, a "shake to randomise" mobile gesture was designed to utilise the device's capabilities, with a grid-based layout serving as the desktop equivalent.
Beyond the homepage and game-specific pages, the redesign extended across several key sections of the product. The Promotions page showcased the full range of promotional tiles in a list format on desktop, whilst mobile adopted a grid structure of varying tile sizes to make efficient use of the available screen space. The Game Preview page provided users with a deeper look at a specific title before committing to play; featuring a promotional tile at the top, a game tile carousel component beneath it, and game-related content including terms and conditions below. On mobile, the promotional tile was omitted in favour of surfacing the carousel and relevant content above the fold, providing a consistent treatment with the home page. The Search page introduced predictive search functionality, surfacing relevant games asynchronously as users typed, with a set of filterable game tags accompanying the results to help users narrow their choices and find content of interest more efficiently.
For game-specific pages, background colours and imagery were drawn directly from each game's own assets, creating a thematically relevant environment that added depth and coherence. Where components needed to function across both light and dark contexts, such as the balance transfer component, both modes were designed to ensure visual consistency across the different colour palettes attributed to different games.
Throughout the process, I collaborated with internal teams to ensure feasibility and managed revised timelines transparently. The finalised designs were presented to the Casino Manager and senior stakeholders, and following a thorough Q&A session, the redesign received unanimous approval and the green light was given to move into development. A UI style guide was developed to ensure consistency across the many screens required, forming the foundation from which all components, game tiles, banners, and navigation elements were built, and served as a key reference for the Development Team during the build phase.
Development.
All assets including icons and imagery were prepared and uploaded to Zeplin, allowing the Development Team to inspect front-end properties, extract specifications, and reference assets directly from the finalised designs. Micro-animations were produced to communicate the intended behaviour of key interactions to the Development Team. As development progressed, technical limitations of the CMS presented challenges with the Netflix-style carousel system; remaining flexible and solution-focused, I worked closely with the Development Team to find a feasible alternative approach that preserved the intent of the original design whilst staying within the technical constraints of the platform.
During this phase, the Casino Manager unexpectedly left the company, resulting in the project being paused before reaching launch. The design work had been fully completed and signed off by stakeholders prior to the departure, representing a thoroughly validated and production-ready redesign.
Had the project continued through to launch, the next phase would have focused on:
-
Usability testing with real Casino players prior to launch to validate interactions and identify any remaining issues
-
A/B testing post-launch to measure the impact of the redesign on engagement, drop-off rates, and user sign-ups compared to the existing product
-
Ongoing usability testing and iterative refinement to continually improve the Casino experience over time
​
Nonetheless, the redesign stands as one of the most ambitious and visually distinctive projects of my time at Pinnacle; a fully realised and stakeholder-approved vision for a modern, personalised Casino experience that pushed the boundaries of the existing brand.
Micro-animation of UI interaction
Micro-animation of game tile hover effect
