Letsplay.live
A one stop for all platform where users can sign up and choose to play tournaments solo or in teams
LPL platform is facing low subscription rates even though there are multiple subscription rates available. The business needs to generate more subscription revenue to remain competitive.
The Solution💡
My goal was to help users understand the benefits of the different subscription tiers to enjoy exclusive member benefits and offer a more immersive and engaging esports experience
Who I worked with: I worked together with senior designers Midzi, Sahana and Jax in the design team.
Design Process
Platforms: Desktop & App
The Problem
Discover
Challenge:
Many esports companies are already well established, making it difficult for Letsplay.live to have a competitive advantage over their companies
Build brand presence in New Zealand
Increase conversion rates for non-users to increase member count in tournaments
Entice users to buy monthly or yearly subscription
Allowing users to communicate smoothly throughout games without disruptions
Goals:
Define
We focused on three types of personas which are: Tournament Organisers, Members and Team Admin. By having them, it helps in identifying the right direction when solving complex design issues, thus creating a better user experience.
Analysis
Through the figjam session and talking to our users, we realised there were also gaps to fill in other modules not only just subscription. Thus we explored how we could also improve other modules including match scheduling and creation of tournaments.
Figjam Discovery Sessions
In order to better understand the subscription problem, we had a UX workshop where I helped facilitate a discussion of crucial issues faced by the tournament organisers, admins and members. After the meeting, we gain insights into the platform and realised that subscription was not the only module that needs to be improved.
Ideate
We begun brainstorming potential solutions to address current issues with the previous website. These 4 platforms also helped to serve as inspiration as they are commonly used esports websites to host tournaments.
Team members
Place a high emphasis on knowing their matches and tournaments details
Lack of information visibility : In-game ID instructions difficult to find
Match room chat function can only be accessed by team owners and tournament organisers
Admin
Have difficulty inviting users, only having one entry point in old design
✅ Key takeaways :
Walkthrough of main changes
We wanted to look at the design from a usability friendly perspective since the amount of mobile users amounted for 60% of the website traffic, using mobile first approach.
Challenges along the way
One challenge that we had was that we had other changes to the product as well. In addition, Dynasty is moving towards a SaaS strategy across 4 different platforms. Thus, it is getting difficult to maintain consistency with the components especially during tight deadline period. Thus we used design system as a solution ✏️
Firstly its important to understand why do designers use design system ?
1) Design and development tasks can be rapidly generated and duplicated on a large scale.
2) This approach reduces the burden on design resources, allowing them to concentrate on more substantial and intricate challenges.
3) It creates visual consistency across products, channels, and cross-functional departments.
(Nielsen Norman Group)
We followed the workflow of having 4 design systems for Letsplay.live, Googly and Paidia allowing us to better maintain the file and over a trial of 1 month, we realised that saved an enormous amount of time by doing so !
By following this workflow of merging changes through branch, it allows us for more time to brainstorm on new flows and UI without worrying about making the changes throughout the main file. It gives us more time to work on the respective components and templates (pages).
An example of all the style guides in our new library for development team to reference upon.
After finalizing the style guide, we proceeded to develop the atomic components that compose the dynasty components. This approach streamlined our workflow significantly. With any new changes, we could simply make them in the atomic components file and then publish them to the main screens file, without the need for manual components transfer.
Constraints
Business Constraints 📈
To increase the revenue to Dynasty, our stakeholders and design team worked on including paid advertisements to be featured on the site which leads to our main question while designing:
How might we ensure visibility on the advertisements while making sure users still focus on tournaments on our platform ?
Developer Constraints 💻
We also addressed some developer constraints especially for mobile. Some of the questions include:
Number of lines for tournament cards and discover card
Banner adjustment to 16:9 ratio for best view
Brackets & table view in users’ view
Number of lines for discover card
Handoff
After completing the first version of mobile app designs, we created prototypes to ensure clear comprehension and visualization of the functionality among key stakeholders, including developers, project managers, and QA testers. This approach also helped maintain transparent communication across the team and is helpful in identifying bugs later on in the prod and staging environment.
QA Testing
We assisted in streamlining the QA testing process by pinpointing defects within the environment, classifying them as either P1, P2, or P3 issues, with P0 denoting the utmost urgency. This enabled us to retrospectively analyze the environment and identify opportunities for enhancing UX flows and refining specific UI elements.
This was an issue that was found by a QA tester. After we change the changes, it was then tested out together with the QA team and it went live together with the other updates mentioned on top.
Desktop Hi-Fi Designs
Updates in progress
Supercell and Letsplay.live’s collaboration testing received a success rate of 82% including in Korea and Japan, 706 out of 862 participants attended the tournament event. The partners were satisfied with the results and excited about the launch happening in march. Live site: https://gg.letsplay.live/home
If I had additional time available, I would delicate it to:
Conducting a more extensive research on subscription module
Ensure higher invitation rate by identifying strategic entry points for inviting users through monitoring heatmaps.