Mobile Casino Lobby
Designing and testing wireframes for a brand-new mobile casino game.
Overview
My company started developing a mobile casino game in collaboration with a major IP. As the lead UX designer, I was assigned the task of bringing everyone's ideas together and developing the new UI and navigation model for a virtual slot app. The main lobby and Slot HUDs play a crucial role in determining both early and long-term user retention.
Project Goals
My Contributions
I worked as the sole UX designer on this project. I was responsible for working directly with leadership across disciplines and provided:
-
UX strategy based on findings from consumer insights (UX research)
-
design recommendations based on heuristics analysis
-
feature recommendations informed by comparative studies
-
user flows and wireframes
Lean on industry standards and user testing to validate design decisions in order to create the main lobby of a new mobile slot game where the core MVP features of the game will be located.
Getting started
I began by meeting with stakeholders and team members to understand the market and its users, as well as the core loop proposed by the leadership. It became apparent that there was an immediate need to define the information architecture of our game. Specifically, we needed to begin that process by tackling the main lobby.
Whats going in the game?
I started taking inventory of what features were planned to go into the game. I set up meetings with our Sr.Director of Game Design and VP of Product to discuss their priorities as they related to the core game loop.
I found that there were six must have features for MVP.
MVP Features
Missions
Side missions and quests add additional goals to increase user motivation, which resulted in improved retentions.
Daily Bonus
A standard feature across all mobile casino games that provides users an allowance of coins
Battle Pass
rewards milestones to help track users' progression.
Store
Key feature for any free to play mobile game
Collections
Users find high-value memorandums themed around our exciting IP.
Promotions
Product driven sales that tie into the store and live ops
Competative Analysis
Once I understood what features were key, I decided to perform a competitive analysis using games from our portfolio and games that were major competitors in the space.
Lightning Link
Quick Takeaways
Layout and Navigation
-
Simple layout with features similar located on two heads-up displays (HUDs).
-
Complex navigation due to multiple sub-menus.
-
Poor recognition of core features due to lack of labels
Touch Points
-
Wheel and hourly bonuses are easily accessible.
-
Store and missions are less accessible.
Slotomania
Quick Takeaways
Feature Layout
-
Related features are kept close, similar to Cash Frenzy.
-
Has a Slots Filter System
Slot Machine Design
-
Small tiles limit information display.
Touch Points
-
Retention features easily accessible; piggy bank, store, and profile less so.
Cash Frenzy
Quick Takeaways
Space Management
-
Efficient use of space for features and store offerings.
Design Considerations
-
Redundant navigation elements create confusion.
Touch Points
-
Expandable tray for easy access to features.
Cashman Casino
Quick Takeaways
User Recognition
-
Consistent icon labeling and badges on slot tiles.
Touch Points
-
Accessibility of features like the wheel and daily bonus., store, and profile less so.
Heart Of Vegas
Quick Takeaways
Layout Simplicity
-
Non-overwhelming, simple layout.
Icon Consistency
-
Inconsistent icon design affects functionality.
Touch Points
-
Specific features like the wheel and hourly bonus are easily tapped.
Guidance Based On Findings
User Interface and Layout
-
Streamlined Navigation: Develop a straightforward and intuitive navigation system. Avoid overly complex sub-menu structures to enhance user experience.
-
Clear Layout: Emphasize simplicity in the game's layout, making sure it's visually appealing yet not overwhelming, similar to the successful approach of Heart of Vegas.
Feature Organization and Accessibility
-
Strategic Feature Placement: Prioritize the placement of key features like missions, stores, and bonuses within easy reach, considering thumb-friendly zones for mobile users.
-
Compartmentalization of Features: Group related features effectively, as seen in Lightning Link, but ensure that each feature is distinct and easily identifiable.
Design and Aesthetics
-
Consistent Iconography: Design icons that are both visually consistent and clearly convey their function. This addresses the inconsistency issue observed in Heart of Vegas.
-
Differentiation of Interactive Elements: Ensure buttons and interactive elements are distinctly designed, addressing the differentiation issue seen in Lightning Link.
User Engagement and Retention
-
Optimized Touch Points: Design the game's touch points—such as the missions, bonuses, and battle pass features—to be easily accessible, drawing from the successful elements in Cashman and Cash Frenzy.
Additional Considerations
-
Avoid Redundancy: Eliminate redundant navigation elements to reduce confusion and streamline user experience, learning from the issues identified in Cash Frenzy.
-
Ergonomic Design: Focus on ergonomic considerations, ensuring that the features we want to prioritize are in the most visible and easy to reach places.
-
Filter and Sorting Features: Incorporate an effective filter system for slots, improving on the execution seen in Slotomania, ensuring that the icons used are appropriate and intuitive.
Designs
I created 4 designs based on these observations.
1
2
3
4
Getting the team involved
The team saw significant potential with each of the proposals above. After engaging in discussions with stakeholders and user researchers, we narrowed down to two designs that we could present to our users for usability testing and research. To add context for users I created additional screens demonstrating settings menus and the slot gameplay screen.
I had two design approaches for the lobby and both seemed viable. One was to adopt a method similar to Cash Frenzy and use a central tray to house all secondary features and live-ops. This would help with scalability in the future. The second was to highlight our missions, which were going to be the main retention feature for the title.
Option 1: Scalability
Option 2: Missions Focus
Testing
For our testing, we wanted to focus on recognition and user sentiment towards the design. We asked a combination of open-ended questions about sentiment and expectations and questions about what they would expect certain elements to do or where they would expect features to be located.
Sample of questions asked in user tests:
General Layout and Design
-
Overall Impression: "What are your initial thoughts about the layout and design of this screen?"
-
Element Placement: "How do you feel about the placement of buttons and features on the screen? Is there anything that feels out of place or hard to find?"
-
Design Appeal: "What do you find most visually appealing about this interface, and why?"
Specific Elements
-
Mission Button: "Where would you expect to find tasks to perform to earn rewards? How easy was it to locate?"
-
Collections: "Where would you expect to find things you've earned as you progress in the game? How confident are you in your answer?"
-
Daily Bonus: "Where would you expect to find free coins?"
-
Store Button: "How does the store button appear to you in terms of visibility and accessibility?"
-
Hamburger Menu: "What are your expectations when you see the hamburger menu?
-
What would you expect to see in buttons X,Y, Z?
User Experience and Sentiment
-
Icon Recognition: "Were there any icons or buttons whose function was not immediately clear to you?"
-
Layout Preferences: "If you could change anything about the layout or size of these elements, what would it be and why?"
-
User Expectation: "Did anything in the layout behave differently than you expected? If so, what was it and how did it differ from your expectation?"
Overall Feedback
-
Improvement Suggestions: "What improvements or changes would you suggest for this interface?"
-
Final Thoughts: "Do you have any other thoughts or feedback about the design that you would like to share?"
Results
We tested 10 participants who were mobile casino players between the ages of 27 and 52. Their response was overwhelmingly in favor of the first option. However there were certain design decisions about option two they appreciated. The main take aways are as follow:
Keep features visible
Users much preferred option one because they could see everything all at once.
Social and profile together
Users much preferred the profile screen on the second option. They felt social, mail, and settings made sense there.
Missions Consistency
User's preferred option one because the missions asset stayed in the top HUD in lobby and slots play.
Don't cover slots space
Users all responded negatively to the missions asset being placed over the slot area.
Make info easy to find
Users made it clear that they all liked the information icon on the slot bottom HUD.
Big missions asset is misleading
Users felt that having a huge missions asset in the middle at the bottom was odd and made the game seem one dimensional.