DAYZ Tournament registration web
UI/UX Design case study
Duration: 3 weeks
Project overview
Introduction
Product
A tournament announcement website for the game DayZ, designed to create an immersive experience that reflects the game's post-apocalyptic atmosphere while delivering essential tournament details. The platform ensures that participants and fans can engage with the event before it even begins, enhancing anticipation and excitement.
Problem
While gaming tournaments are widely popular, many event websites fail to capture the essence of the game they represent. Generic layouts and lack of thematic immersion often result in a disconnect between the event and its audience. A more engaging and visually cohesive approach was needed to align the tournament experience with the gritty, survival-driven world of DayZ.
Goal
To design and develop a website that not only provides key tournament information but also immerses users in the DayZ universe. Through careful UI/UX design and strategic visual storytelling, the site aims to enhance player engagement, increase participation, and build a stronger community around the event.
Project overview
Introduction
My role
UI/UX designer leading the website development. Responsible for research, concept development, wireframing, prototyping, and final visual design to ensure a seamless and immersive experience that aligns with the DayZ aesthetic.
Responsibilities
Conducting competitive analysis, defining user flow and information architecture, creating wireframes and interactive prototypes, developing a cohesive visual style, ensuring accessibility, and refining the design through iterative improvements.
User research
Project summary
Analyzing tournament websites for PUBG, Valorant, Fortnite, and Escape from Tarkov helped identify key engagement strategies.
Additionally, insights from streams and YouTube highlighted what excites players about gaming events. This research revealed that many tournament sites lack a strong thematic presence, which was crucial for creating a more immersive DayZ experience.
Pain points
First impact
1
Lack of Immersion
Generic tournament sites fail to capture DayZ’s survivalist atmosphere.
2
Uninspired Design
Standard layouts don’t reflect the rugged, chaotic feel of post-apocalyptic games.
3
Low Engagement
Static pages lack motion, textures, and thematic visuals, making them less immersive.
Visual effects
Loading & hero animation
The loading screen mirrors DayZ’s in-game sequence, enhancing immersion. The hero section features a looped animation of a character with a smoke grenade, creating a dynamic and atmospheric first impression.
Visual effects
About section animation
Bringing the game map concept to life, the About section features a layered forest mask made of trees and bushes, creating an immersive visual. To enhance the survival theme, a torn map fragment was added, reinforcing the rugged, post-apocalyptic aesthetic of DayZ.
Visual effects
Product card animation
The product card features a torn paper effect, reflecting the rugged, survivalist aesthetic of DayZ. This design approach extends across the entire site, reinforcing the game's immersive atmosphere.
Dynamic UI
Web blocks in motion
All sections of the website were fully animated to ensure a cohesive and engaging visual flow. From transitions to subtle effects, each element was designed to enhance the user experience and maintain the game’s signature atmosphere.
UI Kit
Typeface
UI Kit
Color & Icons
UI Kit
Components
