Topcoder Design Challenge
Topcoder
🏆 About the Challenge
The Topcoder Opportunities Design Challenge is a high-stakes UX/UI tournament tasked with building the new, unified user experience for the Topcoder Community App. This challenge is one of the very first public implementations of the streamlined Topcoder Design System (Launched June 2026).
Designers must move past basic interface skinning to establish a scalable information architecture that elevates four distinct tracks as co-equal, primary destination points: Challenges, Tasks, Review Opportunities, and Long-Term Engagements.
📅 Critical Dates & System Timeline
- 🚀 Phase 1 (Round 1 Sprint): June 5, 2026 @ 10:00 AM ET – June 9, 2026 @ 04:00 AM ET
- 🔍 Checkpoint Review Loop: June 9, 2026 @ 04:00 AM ET – June 10, 2026 @ 04:00 AM ET
- 🏁 Phase 2 (Round 2 Final): June 10, 2026 @ 04:00 AM ET – June 15, 2026 @ 04:00 AM ET
🎨 Key Architectural Frameworks & Core Screens
1. Opportunities Listing Page (Desktop & Mobile)
- Goal: A unified portal tracking active/past challenges and alternate task modules.
- Filter Infrastructure: Design granular sorting parameters covering Engineering Track, Engagement Type, Location, Timeline Status, Required Skill Matrix, and Prize Tiers.
- Asset Gating: Create intuitive icon and color codes to differentiate formats instantly
2. Challenge Details Dashboard
- Goal: A comprehensive problem landscape screen updating the legacy view with optimal typographic hierarchy.
- Component Tracks: Separate structural views mapping Challenge Details, Active Registrants, Public vs. Private Submissions, and a contextual ad banner space dedicated to the Marathon Match Tournament or AI Exponential League.
- Forum Integration: Redesign the Admin Topic List and Individual Topic layouts based on the latest native forums structure.
3. Upload & Submission Management Nodes
- Goal: High-fidelity layouts tracing multiple parallel file uploads, real-time code validation states, input errors, and download/deletion management history logs.
📐 Device & Typographic Specifications
Designers must strictly leverage the official Topcoder Design System Figma canvas and system typography tokens:
- 🖥️ Desktop Layout: 1680px canvas width (1200px locked content grid).
- 📱 Mobile Layout: 393px canvas width $\times$ 852px minimum vertical canvas length (iPhone 16 baseline).
- ✍️ Typographic Hierarchy: Figtree for primary headers, Nunito Sans for standard body prose text layouts.
- 🎨 Icon Library: Material Design Icons only. Zero external stock images allowed.
💰 Prize Pool Matrix
The challenge offers a total cash allocation of $1,650+ USD distributed across verified placements:
| Placement Rank | Allocation | Additional Incentives |
| 🏆 1st Prize (Grand) | $1,000 | Full integration into production system repository |
| 🥈 2nd Prize | $500 | Inclusion in Topcoder design portfolio showcase |
| 🥉 3rd Prize | $150 | General community honors tracking |
| 🏅 Checkpoint Bonus | $250 total | 5 specific Milestone Checkpoints awarded $50 each |