Collaborated with a team of four UX/UI designers to redesign Chess.com, focusing on enhancing user experience and interface. From initial research and concept development to final design execution.
In this project, I worked as a UX/UI researcher and UI designer, conducting extensive research to gather user insights and identify key areas for improvement. I collaborated closely with the team to translate our findings into effective design solutions, contributing to the overall aesthetic and functional enhancements of the Chess.com platform.
Redesign Chess.com to deliver a user-centric experience while modernizing the platform's visual design.
As a long-time chess player, I've always appreciated the depth and strategy of the game. When a teammate suggested redesigning Chess.com during a brainstorming session, it instantly caught my attention. The idea brought back memories of the redesign contest I had seen back in 2021, and I realized this was a unique opportunity to contribute to a platform that has been a part of my chess experience. The chance to enhance a tool I regularly use and admire made this project especially meaningful to me.
"Design is not just what it looks like and feels like. Design is how it works."
- Steve Jobs
Chess.com is a leading online platform dedicated to the game of chess, offering a comprehensive suite of tools and resources for players of all levels. Founded in 2005, the site provides a variety of features, including live and turn-based chess games, puzzles, lessons, and articles. Users can play against others from around the world, join tournaments, and participate in an active community of chess enthusiasts.
Additionally, Chess.com offers instructional content from top players and coaches, making it a valuable resource for improving one's game. With its user-friendly interface and robust feature set, Chess.com has become a go-to destination for millions of chess players globally.
The current design of Chess.com, while functional, lacks a modern and cohesive visual identity that resonates with today's users. The user interface is cluttered, making navigation confusing. Additionally, the design feels outdated, which can detract from the overall user experience.
These design shortcomings create barriers to engage players, limiting the platform's potential to provide an intuitive and enjoyable chess experience. A redesign is needed to address these issues, focusing on creating a more user-centric, aesthetically pleasing, and accessible platform.
The Chess.com homepage serves as the central hub for users, featuring the latest chess news, trending games, and personalized content. It provides quick access to live games, puzzles, lessons, and user profiles, ensuring players can easily navigate to their desired activities. The homepage also highlights upcoming events and tournaments, connecting users with the vibrant Chess.com community.
Clicking "Start New Game" opens a menu with options like blitz, bullet, daily chess, and correspondence games, catering to various play styles and time preferences. This feature allows users to quickly select the type of game that best fits their skill level and desired pace on Chess.com.
The sidebar navigation on Chess.com provides quick access to essential features such as playing games and solving puzzles.
Users can easily navigate to different sections of the site, including live games, puzzles, lessons, and tournaments, ensuring a seamless experience for engaging in various chess activities.
The sidebar navigation on Chess.com provides quick access to essential features such as playing games and solving puzzles.
Users can easily navigate to different sections of the site, including live games, puzzles, lessons, and tournaments, ensuring a seamless experience for engaging in various chess activities.
The mobile version of Chess.com offers a streamlined experience for users on smartphones and tablets, ensuring accessibility and functionality on the go. It maintains key features such as live games, puzzles, and lessons in a responsive layout optimized for smaller screens. Users can easily navigate through tabs and menus to play games, solve puzzles, and access educational content, making it convenient to enjoy chess activities anytime and anywhere.
The mobile version retains the same core functionalities as the desktop site, providing a consistent and enjoyable chess-playing experience across different devices.
"Research is formalized curiosity. It is poking and prying with a purpose."
- Zora Neale Hurston
We conducted interviews with 5 dedicated Chess.com users to delve into their favorite features and what drives them to use the platform. Key insights from these discussions were compiled into organized cards, and as a team, we categorized this valuable information to better understand user preferences and needs.
"Firstly, the very first one, I mean, what's actually my score is, I want to know, but I can find it somewhere. It should be like on the face, it should be like the very first thing I should click on the profile, it should say that these are the number of games. So that could be the best thing if it could happen."
"I just like seeing a bigger board on the desktop. So that's why I use the desktop. I just don't the mobile it's like you're kind of on the go. And if I if I'm rushed and I make a mistake, then there's no point in playing it because you're making stupid blunders. So just the web one I prefer more."
"It'll be interesting if the chess celebrities today, who have a lot of influence in the chess world, had specific videos breaking down famous games. Even beyond celebrities, any chess teacher could do this. It would add value by offering in-depth analysis and learning opportunities."
Following our research phase, we proceeded with card sorting to systematically organize and categorize the insights we gathered. This method allowed us to group similar information together, helping us identify patterns and prioritize user needs effectively. By structuring our findings through card sorting, we gained a clearer understanding of the most significant aspects influencing user interactions on Chess.com.
"Good design is making something intelligible and memorable. Great design is making something memorable and meaningful."
- Dieter Rams
These initial designs focused on structuring the layout and functionality of the interface without detailed visuals. It allowed us to outline key elements, interactions, and navigation flows based on our research findings and user insights. This phase served as a foundational step before moving into higher-fidelity designs and prototyping.
It was important to include the main CTA's on landing page to improve efficiency and reduce confusion for new users.
Mobile Wireframes
It was important to include the main CTA's on landing page to improve efficiency and reduce confusion for new users.
Mobile Wireframes
To ensure a cohesive and visually appealing redesign for Chess.com, my team and I created a comprehensive style guide. This guide served as our visual language blueprint, ensuring consistency across all elements of the platform. It detailed our choices for typography, color palette, iconography, and UI elements, providing a clear framework that unified our design efforts and streamlined the development process. By adhering to this style guide, we were able to maintain a consistent and professional look throughout the redesign, enhancing both aesthetics and user experience.
With our comprehensive style guide in place, we moved on to creating high-fidelity mockups for the Chess.com redesign. The style guide provided a clear framework for our design elements, ensuring consistency and cohesiveness across all screens and interactions.Using the defined typography, color palette, and UI elements from the style guide, we crafted detailed mockups that accurately represented the final look and feel of the platform. These high-fidelity designs allowed us to visualize and fine-tune every aspect of the user interface, from the layout of the home screen to the intricate details of the game boards and player profiles.
Working on the Chess.com redesign project was an incredibly rewarding experience. Collaborating with a talented team of UX/UI designers allowed us to combine our strengths and perspectives, leading to a more robust and innovative design. The teamwork and open communication we maintained throughout the project were key to our success. This collaborative effort not only enhanced the final product but also provided valuable insights and learning experiences for everyone involved. Overall, it was a great opportunity to grow as a designer and contribute to a project that holds personal significance for me.