OP.GG Desktop App

OP.GG Desktop App

OP.GG Desktop App

Visual similarity and UI/UX inefficiencies were identified, leading to a comprehensive design overhaul for improved aesthetics and user convenience.

Visual similarity and UI/UX inefficiencies were identified, leading to a comprehensive design overhaul for improved aesthetics and user convenience.

Role

UI/UX Designer

UI/UX Designer

Product

B2C, Desktop App

B2C, Desktop App

B2C, Desktop App

Duration

7 Days

7 Days

MAU

55M

55M

a cellphone leaning against a wall
a cellphone leaning against a wall
a cellphone leaning against a wall

Overview

This project aimed to comprehensively renew the UI/UX of the OP.GG Desktop App, South Korea's leading League of Legends win rate information service. Considering the urgent 7-day timeline and available resources, the project scope focused on enhancing UI aesthetics and improving the usability and intuitiveness of specific elements, with a particular emphasis on the My Page section.

Background

  • While the existing OP.GG Desktop App had its own design philosophy, an analysis of competitor services (BLITZ, Battle.net) revealed significant areas for improvement in both aesthetic appeal and usability.

  • Leveraging these insights, the project actively incorporated rapidly evolving 2024 UI/UX design trends (Bold Typography, Glassmorphism, Dark/Light Mode, Micro Interactions) to achieve visual differentiation and an enhanced user experience.

Problem

  • The OP.GG Desktop App's default dark mode theme resulted in visual similarity with competitor services, and certain UI elements compromised aesthetics or lacked intuitiveness.

  • The fixed advertising area, while essential for revenue, required design improvement. Furthermore, key features like the header and spell key settings needed UI/UX enhancements to boost user convenience.

Solution

Based on insights gained from service analysis and current design trend research, I developed a UI/UX strategy to elevate the aesthetic appeal and user experience of the OP.GG Desktop App. Key improvements included:

a cell phone on a ledge
a cell phone on a ledge
a cell phone on a ledge

Solution 01
Elevated Visual Aesthetics & Modernization

  • Introduced a primary Light Mode and integrated bold Glassmorphism to establish a distinct and contemporary visual identity.

  • Refined header UI, modernized spell key settings, and applied Radius 18 card UIs to enhance overall aesthetic appeal and visual clarity.

Solution 02
Enhanced Interactivity & Personalization

  • Implemented engaging micro-interactions and an instant dark/light mode toggle for a more dynamic and personalized user experience.

Solution 03
Strategic Monetization &
User Control

  • Optimized the fixed advertising area by standardizing banner size and introducing an "Ad Removal" button, facilitating a monthly subscription model to balance ad revenue with user choice.

Solution 04
Streamlined Usability & Information Hierarchy

  • Streamlined tab menus with text-style buttons and strategically repositioned mini icons for improved navigation and accessibility.

My Approach & Impact

Although this was an idea-proposal project and not ultimately developed, I considered it a valuable opportunity to participate in a mini-project aimed at improving the aesthetics and usability of a service beloved by 55 million League of Legends users worldwide. During a meeting with OP.GG's working-level team, I proposed adding a subscription model with an ad-removal feature to contribute to revenue generation, which received a positive response. The process of redesigning a web-based service into a desktop app was both novel and enjoyable. I also gained a new insight: even small micro-animations, like those applied to the theme change CTA button, can dynamically transform the entire screen's atmosphere.

© 2025 by Austin Lee