Challenge

In this project, we were tasked with designing Player Game Cards and Player Team Cards for 8 different games. The goal was to create an intuitive, visually engaging, and shareable format that allowed players to showcase their individual and team statistics across their gaming circles.

Each card needed to function as a personalized identity module, enhancing player engagement, fostering community interactions, and enabling seamless stat-sharing.

1. Designing the Player Game Cards

Problem Statement

Game cards were formed to showcase the Game Stats of a player in any particular game. The client wanted Game Cards to be created so that players could add their Game Stats to show off strengths through stats and achievements and attract Team Leaders of other teams.

A key challenge was ensuring that, at first glance, anyone could immediately recognize which game the card belonged to without needing to read the details. This required a strategic use of visual identity and branding.

UX Strategy & Approach

1. Visual Identity & Game Association

   
   

   • Each Game Card subtly integrated the relevant game’s graphics, giving it an identity unique to that game.

   • The Game logo/emblem and Player name were given prime prominence at the top to reinforce identity.

   • A minuscule game logo was placed in the center area for added reinforcement, ensuring clarity for players who may not immediately recognize the visual.

     
     

2. Player Information & Hierarchy

   
   

   • Shareability was primal for the business, so a share button was positioned at the top-right corner for quick access.

   • Some games required Player Ranks to be displayed, so we placed them right next to the Player Name for immediate recognition.

     
     

3. Information Architecture & Tab System

   
   

   The bottom 60-70% of the card was dedicated to structured content, divided into three interactive tabs:

   • Stats Tab – Designed to resemble childhood trump card games, making stats comparison engaging and intuitive.

   • Achievements Tab – Showcased trophies and milestones, reinforcing individual accomplishments.

   • Clips Tab – Dedicated to gameplay clips, allowing players to highlight their best moments.

     
     

4. UI & Interaction Design

   
   

   • Designed interactive hover states to explore individual statistics.

   • Used motion-based animations to enhance the experience of browsing through achievements and clips.

   • Optimized for mobile-first usability, ensuring seamless interaction across devices.

Final UI & Visual Showcase

Impact & Results

• 35% increase in player profile engagement within the first month of release.

• Positive feedback from players citing the intuitive layout and shareability.

• Increased team collaborations as players used Game Cards to showcase skills for recruitment.

2. Designing the Player Team Cards

Problem Statement

Team cards were formed when players created a team. The client wanted teams to be represented as Team Cards that players could share to invite other players or showcase strengths through stats and achievements.

A key challenge was ensuring that, at first glance, anyone could immediately recognize which game the team belonged to without needing to read the details. This required a strategic use of visual identity and branding.

UX Strategy & Approach

1. Visual Identity & Game Association

   
   

   • Each Team Card subtly integrated the relevant game’s graphics, giving it an identity unique to that game.

   • A minuscule game logo was placed in the center area for added reinforcement, ensuring clarity for players who may not immediately recognize the visual.

     
     

2. Team Branding & Hierarchy

   
   

   • The team logo/emblem and name were given prime prominence at the top to reinforce team identity.

   • A share button was positioned at the top-right corner to maximize accessibility, as shareability was a core business goal.

     
     

3. Information Architecture & Tab System

   
   

   • The bottom 60-70% of the card was dedicated to structured content, divided into three interactive tabs:

     • Stats Tab – Designed to resemble childhood trump card games, making stats comparison engaging and intuitive.

     • Players Tab – Showcased team members, their roles, and individual contributions.

     • Showcase Tab – Dedicated to trophies, achievements, and collectibles, reinforcing team accomplishments.

       
       

4. UI & Interaction Design

   
   

   • Designed interactive hover states to explore individual team member stats.

   • Used motion-based trophy showcases to give achievements a more celebratory feel.

   • Optimized for mobile-first usability, ensuring seamless interaction across devices.

     
     

Final UI & Visual Showcase

Impact & Results

• 40% increase in team profile views, leading to higher engagement.

• Enhanced team branding & visibility, helping squads attract sponsorships.

• Improved team spirit & recruitment, as players could better represent their team.

Conclusion & Learnings

This project reinforced the importance of:

✅ Progressive disclosure for managing information overload
✅ Visual hierarchy & motion design for engagement
✅ Community-driven UX to enhance social interactions

By designing scalable, adaptable Player Game Cards and Team Cards, we significantly elevated the gaming experience and strengthened player engagement across multiple platforms.

Thank you!

If you liked this project, contact us to build your dream product together!