All the UI elements used for Valorant, showing button stylings, form fields, toggle buttons, progress bars, filtering UI, and loading images.
All projects

Valorant 404 Page

Client
Valorant
Category
Web Design, Graphic Design
DURATION
1 mo
YEAR
2021

The challenge

To design a unique and engaging 404 error page for Valorant that resonates with the game’s aesthetic, engages users, and provides clear navigation back to the main content.

The goal

View the live site

User Research

Read more
View the full case study
PROCESS –
PROCESS –
PROCESS –
PROCESS –

the process

  • Thematic Illustration:
    A dejected Agent sitting amidst a chaotic backdrop (e.g., shattered Spike or fading map outlines), reinforcing the "404" theme.
  • Witty Error Message:
    Example: “You’ve teleported to an empty map. Let’s requeue!”
  • Navigation Options:

    • Primary CTA: "Return to Home" button styled like a game menu item.
    • Secondary Links: "Check Match History" or "Explore Agents."
  • Interactive Element:
    Subtle hover effects on CTAs, matching Valorant's UI aesthetics.
  • Responsive Design:
    Fully functional across desktop, tablet, and mobile platforms.
  • Read more
    View the full case study

    Sketches 

    Design Process & Wireframes

    No items found.

    Conclusion

    • What Worked Well: Successfully captured Valorant’s branding and enhanced user engagement with a creative 404 solution.
    • Challenges: Balancing humor with usability; ensuring accessibility for diverse users.
    • Takeaways:
      • Immersive designs should align closely with brand identity.
      • Micro-interactions can significantly elevate user experience.
    Read the full case study
    View the live site

    CREDITS

    ARTWORKS

    Valorant, Riot Games LTD

    UX / UI DESIGN

    Neel Akolkar

    DEVELOPMENT

    Neel Akolkar

    CASE STUDY

    Neel Akolkar

    Drink KY app screens in a grid layout showing the locations page map and filtering capabilities, the loading screen, the rewards dashboard, and the profile page.
    DRAG