top of page
cas.jpeg
LL_BR_MarqueeMainLogo_noBG.png
Group 10.png
Group 9.png
Before (1).png
After (1).png

Redesigning Luckyland Slots

Tasks Performed

Competitor Analysis

User Interviews

User Flows

Wireframing

Prototyping

High Fidelity Mockups

UI Design

Design System

Internal Improvements

What Did Users Say?

I conducted multiple user interviews with both seasoned and new users and discovered some interesting results.

Feedback

  1. There are just too many games and scrolling through them is a hassle.

  2. The app is incredibly slow to load and crashes often.

  3. Didn't know they could add games to their favorites.

  4. Just wants to find specific types of games.

  5. The design is so overwhelming.

  6. Some buttons weren't clear that they could be pressed.

  7. The music is too distracting in the lobby.

Goals

Questions The Business Had

  1. We have a catalogue of 100+ games, so why are the majority of users only playing a few?

  2. We recently added a Favorites section so users can add their favorite games for easy access but users are not using it. How can we get them to use this?

  3. Since we do have 100+ games, how can we make it easier to scroll through all the pages if they only have 3 games per page?

  4. We have special tournaments and jackpot events but no one is playing them. How can we get more users to join?​

  5. Visually we want the lobby to look like a VIP room at a casino. How can we update the UI to fit that?

Overview

I was brought on to take Luckyland Slots to the next level by introducing a new design and layout. This project was massive and I was tasked to take on the first phase of it along with another UX Designer and our Product Manager.

Tools

Figma
Adobe Illustrator
Adobe Photoshop
Jira

Adobe After Effects
Autodesk Maya
Storybook
Miro

Role

UX Designer
UI Designer

Team

Product Manager
UX Designer
Self

What's Our Competition Doing?

I looked into our competition and played their products to note down what they do well and what they could do without. A few things I noticed with the more popular ones were as follows.

Constraints

Due to the constraints of the slots themselves, the entire app needed to stay in landscape. The app was also made in unity so designs need to be built for that engine in mind. The design needs to prioritize mobile users.

Group 11.png
Finalwireframe (2).png

First Wireframes

In this version, I shrunk all the posters so more could fit on the screen and introduced vertical scrolling. I added filters to the left based on the types of games users preferred. I also added sorting options so users could have more control over finding games. The favorites button on each poster is more prominent. I also opted to remove the carousel banner at the bottom since we have data showing that users rarely tap on it. I also chose to not have a designated Deals button because it is rarely active, so it takes up unnecessary space. We decided to have it replace the Buy button when a deal becomes active as it calls the user to open up the store and make a purchase.

Final Wireframes

I increased the poster sizes enough that the user could still scan multiple at once and still be able to read the contents. I separated the toggle so users could better associate the coin type with its display. I consolidated the tabs into the sorting menu and moved it to the left so it was near the filters. The business wanted a better way to advertise their special games or events but didn't want to lose the space, so I moved the banner into the catalogue so it was more seamless. I moved the sound button into the hamburger menu and added an extra top bar button for a future feature. We also brought back a stacked coin display as users expressed that they found it familiar.

Finalwireframe (3).png

The Challenge

There were a lot of challenges to overcome at the beginning. We lacked an in-depth understanding of what users wanted when playing Luckyland Slots and why they either come back or leave. The existing UI components were scattered across multiple folders and computers and there was also no user flow to reference off of to know which screens to work on. It was clear that the first thing I needed to do was set the foundation for our team to work off of.

User Testing

I turned this into a prototype and started conducting user tests to get early feedback on whether this is an improvement to the users.

Feedback

  1. Users were excited to see so many posters at one glance, however they wished they were a little bigger.

  2. Users liked the ability to sort and filter different types of games. A lot of mentions of how the icon helps them differentiate the games.

  3. Felt the posters were really busy and worried what they'd look like in that small space.

  4. Users were confused about how to switch coin types.

  5. No one noticed the sound icon.

  6. Most users did not notice both sorting options, the tabs and the dropdown. They would only notice one or the other.

Note

After launch, we collected feedback from users through surveys, our social platforms, and user interviews.

Results

  1. There was a 72% increase of game discoverability. 

  2. Over 80% of users favored the new design.

  3. Almost every user we interviewed started using the favorites feature.

  4. The Jackpots button on the left being large allowed users to notice it to join events.
     

Games

Most of what I've seen involve having smaller poster sizes to fit more content on the screen.

Simplicity

The designs were simple and navigation was clear and straightforward.

Promotions

I noticed that other companies are making an effort to advertise new or existing games to draw users to play them.

Tasks Performed

  1. ​Created templates for social media team

  2. Discussed best design practices for email campaigns

  3. Designed resuable assets for social media team

  4. Provided feedback to the web team on best ways to update the company website

  5. Conducted workshops for in-house art team on best layout practices

  6. Gave presentations on logo design practices

  7. Tested each game and provided feedback for all UI elements

  8. Designed templates for in-house art team to increase efficiency

  9. Worked closely with engineers to find out how to help improve their workflow

Research

Wireframes

UI

Results

Overview

These are tasks that I took over to improve on company efficiency, practices, and personal growth.

Slide 16_9 - 1.png
Slide 16_9 - 2.png

So What Did I Do?

  1. Created a user flow reflecting the current state of the app.

  2. Tracked down and inventoried all UI components.

  3. Collected any existing user research conducted and organized it to analyze.

Design Choice

The company wanted to stay away from the solid colors of our competitors, so we opted for a rendered look. We ended up choosing purple as our main color as it was more calm but elegant and gave it a gold accent to indicate wealth. We also kept the background a solid dark color so the focus is on the posters. It was at this point I started building our design system.

bottom of page