🎨 Bingo Native App: UI Iterations Case Study (MVP)
UI Design Approach
The project began with the challenge of refreshing our Bingo product, with Sky Bingo eager to be the first to adopt the new app. This influenced the visual direction, pushing us towards a palette of violets and purples, allowing Sky to visualize their brand seamlessly integrating into the new product.
Design Process
Mood Board 1 Softer edge
I put together two mood boards with possible colours, we had some constraints as we had potential customer Sky so we knew we have to go with shades of violet and purple so that they can easily visualise their brand being part of a new client.
Playtech Branded Option A
Once all wireframes for Lobby, Ticket Purchaser and In-Game were done I experimented with some UI styles I knew we were going for fun, gamified app with sense of community and achievements. Knowing our persona it should be appealing primary to our female part of clientele.
Sky Branded Option B
Option B built on the first mood board, but with adjustments for a softer aesthetic. We incorporated different color swatches, the Sky Bingo logo, and symbols for the lobby tiles with transparent backgrounds. This approach provided flexibility in layout solutions for the lobby, including a countdown loader for game start times and a dynamic footer UI to enhance interaction and usability.
Final Style Mood Board 2
In the end product decided to go with darker colour tones, they are more inclusive and work better with the current customer branding.
Bingo Mobile UI Final Product
The Bingo Native App was designed to allow users to easily navigate the bingo rooms, purchase tickets, and enjoy the game while interacting with friends. Features included:
A clear, easy-to-use ticket purchasing system
Integrated chat functionality for social engagement
The ability to play slot games alongside bingo
A live prototype and product video were created to demonstrate the final flow, showcasing the intuitive interface and seamless interactions for users.
UI Screens Displayed in the flow
I paid special attention to demonstrating how the UI screens flow together, particularly in the ticket purchasing journey. This included visual feedback through win animations and chat features that added to the sense of community within the app.
Lobby Display
The lobby showcases a variety of game tiles in different shapes and sizes.
Licensees can choose tile shapes based on the rooms they want to promote.
Each tile is branded with unique themes, like coins for the penny room or ducks for "2 Little Ducks," for easy room identification.
Users can mark rooms as favorites for quick access.
Dedicated spaces are available for promotional banners.
A footer provides easy navigation between the lobby, mini-games, and schedules.
💡 Retrospective and Future Considerations
Looking back, Even though the branding is perfect for our customer Sky. I reckon having a softer pallet could be preferred by some of our users.
Not to worry, we work towards having the app modular and easy to reskin, so I am sure several of our other brands will choose a softer pastel UI pallet.