01
Summary
OSD Remote App is a screen control mobile application launched by MSI, to replace physical buttons on the monitor. It enhances gaming fluidity and immersion, providing gamer with a better gaming experience. This app integrates multiple features, repackaging key functions from the original screen control software to ensure quick adjustments during gameplay. It includes game monitoring, game profiles, system settings, joystick control.
The original project was from 2018. Through recent product updates on the official website, I can sense that past design efforts have attracted more users and that the company is now willing to invest more resources in further optimization. Five years later, I also want to challenge my previous design.
To evolve from single-screen to multi-screen support and enhance the overall user experience, the entire design plan revolves around two core principles: design flexibility and experience optimization. I aim to integrate control for multiple monitors within the app, enabling seamless switching between screens. Additionally, through customizable settings and refined UI visuals, I hope to enhance both the overall feel and practical efficiency.
Duration
Jun 2017 - Jan 2018
My Role
UI Designer
Responsibility
UI Design
Visual Design
Remark
Part of the content and UI were updated in 2023
Objective
Based on the 2019 OSD Remote App goal—allowing gamers to adjust monitor settings anytime for the best gaming experience—this update refines the app’s UI and user experience based on the 2023 MSI Gaming Intelligence design style.
Role & Deliverables
In this project, I collaborated with the design lead to define the product direction, consolidating the existing OSD PC Control App into Mobile. After designing the new experience, we worked with the product team’s engineers to evaluate technical feasibility and delivery. (The project was redesigned in 2023 while maintaining its overall structure.)
Challenges
As a tool for gaming products, we needed to explore market trends and key applications for gamers. However, since gaming trends evolve yearly, the design must incorporate long-term adaptability and a flexible style to continuously enhance the user’s in-game experience.
Outcome & impact
We completed the new design and development within two months and gained 50,000+ users within six months. By 2023, the user base exceeded 100,000. Although we couldn’t evaluate the impact of the new design in 2023, we received significant recognition from long-term users, reaffirming the value of our improvements.
02
Product Architecture
03
Project Planning
04
Project Overview
05
Persona
Gamers
Who play games on computers
During gaming, users are less sensitive to changes in the screen and focus more on the game itself. Therefore, they usually make adjustments once and don't frequently tweak settings during gameplay.
Professional Gamers
Make esports their profession
For users with high accuracy requirements for their screens, especially during gameplay, they tend to prefer intuitive and quick real-time adjustments. Stability is the highest priority, regardless of the settings being made.
Tech Enthusiasts
Passionate about experiencing new tech gadgets
Actively exploring the features of new products and diving into each one. Even if some features are not frequently used, they always try them out myself, take notes, and share my findings.
User pain points and demands
Unintuitive operation
Inaccurate settings
Response delay
Poor stability
Cumbersome operation
Lack of innovation
Insufficient information
06
Explore Design Styles
We believe that by providing an intuitive and streamlined UI while ensuring real-time interacte, and also reduce the user's learning curve, enhance operational fluidity, and enable users to make screen adjustments instinctively during gameplay, achieving the optimal gaming experience.
07
Color Guidelines
08
Typography Guidelines
09
Logo Design
10
Wireframe
11
UI Component
Most of the components in the OSD Remote App are derived from the PC version of the control software, forming a unified set of standardized components. This serves as a foundation for reuse and modification across other related products. For MSI, this requires a thorough evaluation process. In the past, our focus was primarily on PC products, with limited applications for mobile devices. However, with the increasing popularity of mobile devices and the diversification of gaming experiences, integrating the component library will be a long-term cost-reduction tool. It enables designers to efficiently utilize standardized elements while ensuring consistent updates and a seamless user experience.
12
Design Deliverables
Why Redesign?
Challenge New Skills, Establish a New Style
On one hand, it’s about reflecting on past work—learning from years of hands-on experience and striving to enhance the quality of the original design. On the other hand, previous designs were limited by technical constraints, allowing users to connect only a single screen and adjust basic parameters to optimize their gaming experience. However, as player demands evolve, we now need to address multi-screen requirements, diverse gaming experiences, and different operational goals—leading to the need for a new design.
Connect with devices
A single phone to connect to multiple devices
When users have multiple screens in their environment or identical screens in the same area, they can use a PIN code to pair their phone with the screen. Once recorded on the phone, the system will automatically match the devices.
Multiple screens
Starting with gamers
As the information industry evolves, many users are no longer satisfied with a single-screen experience. During the 2023 redesign, we evaluated this shift—limiting connectivity to a single screen restricted market potential and failed to meet the needs of modern users (e.g., financial analysts). We returned to the app’s original purpose: to help users enhance efficiency, improve experiences, and expand multitasking capabilities.
Real-time status adjustment
Immersive adjustment
OSD Remote App users often require quick and precise parameter adjustments during use, which is especially crucial for professional gamers. To enhance usability, we replaced dropdown with switches and increased button sizes for better accessibility. This allows users to develop intuitive control after just a few interactions.
Switching between different modes
Prototype + Competitor analysis
Apart from the original gaming users, we introduced additional modes for users to choose from. In the initial 0-1 phase, we established preset parameters through two approaches: first, by creating a simple MVP for user testing; second, by analyzing competitor settings and user feedback to identify widely accepted market standards, which served as the foundation for our initial configurations.
Multi-Screen and Multi-View
Reducing Switching
The 2018 design already featured multi-view functionality, indicating that users have a need for multiple display views on their monitors. Therefore, in the redesign, I not only considered multi-view requirements but also addressed the need for multi-view when connecting multiple monitors and computers. A commonly used approach for this is PbP (Picture-by-Picture) or PiP (Picture-in-Picture).
•PbP：Allows multiple input sources to be displayed side by side on the same screen, treating them as separate windows.
•PiP：Overlays a smaller secondary window on top of the main display, enabling users to monitor another source while focusing on the primary content.
Custom function for PUBG
Deep Dive into the Game to Gain Player Support
According to a 360.cn research report, since 2014, the growth rate of per capita sales revenue for mobile games has been declining, while PC games have maintained a high growth rate, which continues to accelerate. Among them, PUBG, which supports both mobile and PC platforms, saw a rapid increase in search volume in 2016, indicating immense potential. By October 2017, major players like Tencent had also entered the market.
Based on this trend, we believed that launching additional features tailored for PUBG as part of our marketing strategy could attract more players and generate greater interest in our product.
13
Effectiveness Analysis
100,000
+
Downloads: Over 50,000 in One Year, 100,000+ in Three Years
The 2018 design surpassed 100,000 downloads in just three years, indicating that over 100,000 users purchased a single monitor model and were willing to download the app for operation. However, at that time, the app only supported a single monitor model, which might have contributed to the stagnation in downloads and product updates after three years.
In 2023, I redesigned the app with the goal of integrating MSI's monitor lineup and enhancing app compatibility, creating greater flexibility and new business opportunities.
