Xen Gaming website redesign

Xen Gaming

UX/UI Design, Website Development & E-commerce

About the project

Xen Gaming is a global gaming and entertainment organization working across creators, brand partnerships, digital content and community experiences.

The organization had evolved beyond its original gaming team identity, but its website had not fully kept up. Merchandise dominated the experience, while the organization's creator network, commercial capabilities and partnership work were less visible.

The project focused on restructuring Xen's digital presence into two dedicated experiences: a corporate website designed for brands and potential partners, and a standalone merchandise shop built around creators and community.

My Role

  • UX Researcher
  • UX/UI Designer
  • Website Strategist
  • Frontend Developer
  • E-commerce Developer
  • Interaction Designer

Tools used

Figma
Figma
HTML
HTML
CSS
CSS
JavaScript
JavaScript
Node.js
Node.js

The Challenge

Xen's previous website placed merchandise at the centre of its digital presence. Although it supported product discovery, it did not communicate the organization as effectively to potential sponsors, clients or partners.

The challenge was to create a clearer website experience that communicated Xen's identity, creator network and commercial work while making it easier for visitors to understand what the organization does.

At the same time, the merchandise experience needed its own space with better product discovery, collections, creator shops and an integrated shopping journey.

Problems

  • The previous homepage placed product listings ahead of Xen's commercial capabilities and brand positioning.
  • Visitors looking for partnerships had to navigate through content aimed primarily at merchandise customers.
  • Case studies, creators and previous campaigns needed stronger visibility and clearer organisation.
  • The website lacked a clear separation between B2B and B2C user journeys.
  • The visual experience needed to feel more modern, cohesive and representative of Xen's culture.
  • Merchandise needed a dedicated storefront with organised collections, variants and checkout.
  • The new system had to support future campaigns, additional creators and new product collections.

Design process

Research

Define

Structure

Design

Develop

Understanding two audiences
with different digital needs

Audience analysis

Brand partners Needed quick access to capabilities, creators, previous collaborations and contact information.

Potential clients Needed to understand Xen's work and how a collaboration could create value.

Gaming community Needed easier access to official merchandise, creator collections and product information.

Different intentions The two audiences required different navigation, content priorities and calls to action.

Website audit insights

Merchandise-first hierarchy Shopping content dominated the initial impression of the organization.

Limited case visibility Campaigns and partnerships were not given a strong dedicated presentation.

Mixed navigation Company information and shopping competed within the same experience.

Scalability The new information architecture needed room for more creators, case studies and products.

Brand consistency Both platforms needed to feel connected without sharing identical user journeys.

What the insights revealed

The website was attempting to serve two fundamentally different purposes. Brands wanted to understand Xen's business, creators and track record, while the community wanted to browse and purchase merchandise.

The central design decision was to separate those experiences. Each website could then prioritise its own audience, while remaining connected through one consistent Xen identity.

Design goals

1

Clarify Xen's positioning

Communicate Xen as a gaming and entertainment organization, not only a merchandise brand.

2

Separate user journeys

Give business visitors and merchandise customers clear, purpose-built digital destinations.

3

Put the work forward

Make partnerships, campaigns and case studies easier to discover and explore.

4

Improve shopping

Build a focused merchandise experience with collections, product details and cart functionality.

5

Create room to grow

Design a scalable structure for future creators, campaigns, partnerships and merchandise.

From research
to practical UX decisions

01 Dedicated corporate website

The main site prioritises the organization, partnerships, creators and case studies.

02 Separate merchandise shop

Shopping receives its own navigation, product categories and conversion-focused flow.

03 Case-study-led storytelling

Dedicated case pages allow potential partners to explore Xen's work in more depth.

04 Connected brand experience

Both websites share visual identity and cross-links while maintaining clear user journeys.

Understanding the previous website experience

The original website used a merchandise-first structure with a large retail hero, product displays and business-related information further down the page.

Reviewing the existing hierarchy helped identify where the website could better represent the organization and create clearer paths for visitors.

01

Merchandise-first experience

Product listings were the dominant content rather than Xen's partnerships and campaigns.

Original Xen Gaming merchandise listing
02

Retail-focused homepage

The main hero highlighted merchandise instead of presenting the organization.

Old Xen Gaming website hero
03

Secondary business content

Partnerships and activations were present, but needed stronger placement and structure.

Old Xen Gaming activation presentation
Original Xen Gaming partnership and brand presentation
Previous partnerships and brand positioning
The redesign / 01

A website built around the organization.

The new corporate website shifts the focus from merchandise to Xen's position within gaming, entertainment and the creator economy.

Its structure prioritises the creator network, selected brand partnerships, campaign case studies and opportunities for brands to collaborate.

Explore the live website ↗
01

Clear positioning

A stronger introduction to Xen as an organization and creative partner.

02

Creator network

Dedicated creator content makes talent and community more visible.

03

Case studies

Previous campaigns have their own storytelling and visual documentation.

04

Partnership journey

Business visitors can navigate toward relevant work and contact opportunities.

The redesign / 02

A dedicated space for Xen merchandise.

Separating the store made it possible to create an experience focused entirely on shopping, collections and the wider Xen community.

The storefront connects custom frontend design with Shopify product data, allowing visitors to explore merchandise, select product variants and move through a dedicated cart and checkout.

Explore the merchandise shop ↗
01

Official merchandise

Collections and products organised into a dedicated shopping experience.

02

Creator shops

A structure for merchandise connected to individual Xen creators.

03

Product selection

Product detail views, variants and interactions designed around shopping.

04

Shopify integration

A connected product catalogue, cart and checkout flow.

Development & outcome

One identity. Two purpose-built experiences.

The project combined information architecture, UX/UI design, frontend development, responsive layouts, interaction design and Shopify integration.

The resulting structure gives Xen a dedicated corporate presence while separating merchandise into its own shopping experience.

Rather than competing within a single website, the two journeys now have different purposes while remaining part of the same brand ecosystem.