Microsoft Casual Games is a website where users can discover, browse, and play browser based “casual games” such as Microsoft Solitaire and Surf Game. A core part of the product is personalized game recommendations that we provide to help introduce the right games to the right people. The website is composed of a home page, a search query page, game specific landing pages, and genre specific browse pages.
01. Improving website functionality and game discoverability
02. Enhancing game experience in any viewpoints
03. Creating design systems in both light and dark modes
Competitor Analysis
Responsiveness
User problem solving
Wireframes
Design System
Prototyping
Supporting development
Visual design
Collaboration
Apr 2022 - Jun 2022
Figma
Photoshop
Illustrator
UX Labs
Content Service design team
MSN gaming engineering teams and leads (US & China)
MSN gaming PMs
Casual gaming SME
UX researcher
Maximal team (3D icons)
MSN games (Old version)
Microsoft already had an “Online Games” link that points to the existing Casual Games experience on MSN. However, the Microsoft Casual Games team was keen to broaden its casual gaming product range by bolstering its digital footprint across the Windows OS, Edge browser, and MSN ecosystem, including the new start.com and mobile app. Additionally, they aim to develop a website where users can discover, browse, and play browser-based "casual games" such as Microsoft Solitaire and Surf Game. Once our experience is complete, this link will be replaced with the new Microsoft Casual Games link.
In addition to the built-in native games within the Windows OS and downloadable titles from the Windows app store, our focus extended to enriching the end-to-end gaming experience across various platforms, including but not limited to:
Windows 10&11 flyout
Edge browser with new feature of “Shoreline hub”
Microsoft Start
(New MSN) landing experience
Casual games on Bing search
Progressive Web App (PWA)
Users will have the opportunity to explore and find new games within our landing experience. They will be presented with curated collections showcasing the most popular games across various genres, along with exclusive editorial content introducing the latest additions to the Microsoft game catalogue.
Users will have the capability to navigate and explore the extensive Microsoft game catalogue, empowering them to easily locate their desired titles through browsing and search functionalities.
While engaging with games on the landing experience, users will receive tailored recommendations for similar games, enhancing their gaming journey with personalized suggestions.
Users will have the seamless ability to access and play games directly within the experience, ensuring swift and effortless transitions into gameplay. Returning to previously played games will also be streamlined for a quick and hassle-free experience.
We sought to expand the user journey by integrating multiple entry points such as Bing search and answers, the MSN legacy site, and the new Microsoft Start.com. This led to the development of a new landing destination dedicated to gameplay and discovery, which acts as a vital connector across the entire user journey. Following several rounds of competitive analysis, design research, and iterations, we devised three MVP landing experiences (Home, Browse, Play) with a single layout.
.png)
Following the completion of the MVP landing experience, I played a role in developing responsive web design, ensuring the adaptability of the layout to various screen sizes and orientations while maintaining consistency.
While the casual games platform remains dedicated to responsive design, enhancing the gameplay experience for improved performance and usability on smaller devices became necessary. By focusing on these enhancements, our goal is to ensure users enjoy a smooth and delightful gaming experience across all devices.
Light and dark modes are essential in UX design to cater to user preferences, accommodate varying lighting conditions, and enhance accessibility. By offering both options, users can choose the mode that best suits their needs and preferences, ensuring a more comfortable and enjoyable experience across different environments and for users with diverse visual requirements.
Following several iterations of design research, competitive analysis, and user studies, we launched the casual games landing experience on Microsoft Start.com. This accomplishment was the result of collaborative efforts across teams, organizations, and geographical locations. Presently, the new landing experience boasts full responsiveness and accessibility, ensuring an inclusive and seamless user experience for all.
The Home landing experience is structured into three key sections: the Hero display featuring staff picks, the Left column displaying recently played games, and genre carousels presenting recommended games across various categories and 6 game genres: Match 3, Card, Word, Puzzle, Arcade and Strategy.
The selection and arrangement of games within the Hero display will be curated by MCG, ensuring a minimum of five games are consistently available in the editorial queue.
When a user chooses a genre from the header, the central area will populate with Standard cards representing the selected genre's games. If the number of games exceeds the capacity of the main area, flippers will appear on either side of the area. These flippers enable users to navigate through additional pages of games, ensuring they can explore the full range of available titles within the selected genre.
This is the home page of the current product as a marketplace app (V1) with a marketplace standalone feature before adding housing, job market and Social networking (V2). Users will see the item listing from their neighborhoods based on user settings, and also explore the items from different regions by changing the city.
When users interact with the "Show more" call-to-action (CTA), it triggers the opening of gameplay instructions. This feature provides users with additional guidance or details about how to play the game, offering clarity and assistance as they navigate through the gaming experience.
In addition to designing the landing experience, I played a role in creating game icons when the MCG team expanded the genre library from 6 to 28 genres. The Casual Games platform adopts a maximal style (3D) to offer users visually engaging and distinctive graphics. Initially, we engaged the Maximal team, responsible for 3D-looking icons and illustrations, to create the first 6 genre icons.
Initially, we engaged the Maximal team for the creation of the first 6 genre icons. Subsequently, I expedited the creation process by creating 22 genre icons under the guidance and feedback of the Maximal team.
