Valorant Challengers South Asia
Valorant Challengers South Asia was a competitive esports tournament series for the game Valorant in the South Asian region, organized by Riot Games. Loco, being one of India’s leading streaming platforms, embarked on the journey to draw as many eyeballs as possible to the Hindi version of the stream on the platform. On a personal level this project was a very big deal for me because I actively live and breathe Valorant.
30K+
Monthly Active Users
1.5K+
Vouchers Redeemed
Scope of work
UI & UX Design
Tools
Figma & Spline
Duration
1 month
Capcity
Full time - Loco
Problem Statement
- Create web-based pages for the Android/iOS apps along with responsive webpages for desktop and mobile web
- Have a provision for users to win in-game points via lucky draw
- Allow users to see match scheduling and team standings
While the requirements were straightforward, it was essential to abide by branding guidelines laid out by Valorant & Riot Games.
Process
A tight timeline meant keeping the information architecture as simple as possible. This was done to ensure tech feasibility within a short period of time. There were two key pieces of information that needed to be conveyed — voucher states and team standings.
User Journey and Information Hierarchy
I mapped out a straightforward, linear architecture to guide the user quickly: Landing Page > Match Schedule/Team Standings > Watch and Win VP CTA > Show Voucher Code / Card States. Keeping the flow one-dimensional minimized engineering edge cases and allowed for rapid development.
User Interface
The idea was to create a clear, gamified flow highlighting the opportunity to win Valorant Points. I designed clear card states (for example, “Congratulations! You’re a winner of XXXX VP”) so users instantly understood their reward status. I designed highly scannable, responsive tables for the League Phase, Group Phase, and Playoffs so fans could easily track rankings, win-loss records, and upcoming match timings (IST). To elevate the visual experience and abide by Valorant’s energetic branding, I used Spline to convert 2D vectors into dynamic 3D assets, adding visual pop to the hero sections and landing pages.
Conclusion
Crafting this experience was especially delightful for me due to my inherent interest in Valorant and esports. With over 30K MAU for that month this page experienced good traffic and high engagement. Learning Spline to create 3D assets from 2D vectors was a fun way to add some pop to the landing page.
