Web App
BrainPlay
Making AI capabilities visible through gameplay.
BrainPlay is a decentralized AI benchmarking platform built on Bittensor. It evaluates AI models through interactive games that test reasoning, strategic thinking, and navigation. As a UI/UX Designer at ShiftLayer.ai, I contribute to creating clear and intuitive experiences for this AI competition platform.
- Role
- UI/UX Designer
- Company
- ShiftLayer.ai
- Duration
- One Month
- Platform
- Web Application
Overview
BrainPlay evaluates AI models through competitive gameplay instead of relying only on traditional benchmarks. The platform features Codenames, 20 Questions, and Super Mario, alongside live matches, game history, model rankings, and network performance information. Users can explore AI competition, follow match activity, and compare model performance across different games.
The Challenge
Making AI competition easier to understand. BrainPlay combines interactive games with technical performance data. The challenge is to make both the gameplay and evaluation results easy to explore.
- Game discovery: Help users find and explore different benchmarking games.
- Live activity: Make ongoing matches easy to discover and follow.
- Performance data: Present model statistics in a clear, readable format.
- Model comparison: Help users understand rankings and game-specific results.
- Navigation: Connect games, live matches, history, and leaderboard information.
Goals
Creating a clear AI benchmarking experience.
- Simplify information: Make technical model data easier to understand.
- Support discovery: Help users explore games and live matches.
- Show performance: Present rankings and match statistics clearly.
- Enable comparison: Make game-specific model performance easier to review.
- Maintain consistency: Keep navigation and interface patterns familiar throughout the platform.
Target Audience
Designed for people exploring AI capabilities.
AI Researchers & Developers
People interested in evaluating AI models and understanding their performance.
AI Enthusiasts
Users who want to explore AI capabilities through interactive games.
Model Evaluators
People comparing model rankings, win rates, and match results.
Technical Users
People interested in model identifiers, network information, and benchmarking data.
Design Approach
01
Understand
Understand the platform's features, game types, and performance information.
02
Structure
Organize games, live matches, history, and rankings into a clear information hierarchy.
03
Explore
Explore layouts and interaction patterns for presenting game and model data.
04
Design
Create consistent interfaces with clear visual hierarchy and intuitive navigation.
05
Refine
Improve readability, usability, and consistency across the experience.
Tools
Design
- Figma
- FigJam
AI
- Gemini
- Claude
- ChatGPT
Project
- ClickUp
- Discord
Design System
Keeping the interface consistent. A consistent design system helps users recognize familiar elements throughout the platform.
- Color & Typography
- Component Library
- Spacing & Layout
- Interactive States
- Responsive Patterns
Interface Design
Presenting games and performance data clearly across game selection, live matches, leaderboards, and history.
- Game Selection — Codenames, 20 Questions, and Super Mario as distinct benchmarking experiences
- Live Games — Discover active matches and explore gameplay activity
- Leaderboard — Model performance across the subnet, including UID, stake, win rate, and more
- Game History — Previous matches with categories and filtering controls
Interaction Design
Making platform navigation straightforward.
- Game Navigation
- Live Match Exploration
- Leaderboard Exploration
- Leaderboard Views
- Game History
- Clear Feedback
Deliverables
- Color Palette & Typography Guide
- Component Library
- Custom Icons
- Responsive Desktop & Mobile Layouts