HyberGaming Website Redesign
As the UI/UX Designer at HyberGaming, a game studio under Bitus Labs, I led the redesign of the company’s official game website.
%202.png)
%203.png)
%203.png)
HyberGaming Website: The Problem
Bitus Labs operates across both AI innovation and game development, but the original site blended these two vastly different focuses into a single platform. As a result, visitors often found the content confusing — the site looked more like an AI outsourcing company than a dedicated game studio.
This overlap created brand identity issues and communication challenges. Potential players, recruits, and investors were unsure of what the company actually did. The lack of a clear narrative and visual hierarchy also weakened user trust and professional credibility.
%202.png)
Solutions
Our solution was to separate Bitus Labs’ AI division and gaming division into two distinct websites — each with its own tone, audience, and goals.
For the HyberGaming site, I created a design system centered on a game studio personality; energetic, immersive, and visually engaging.
This included:
-
A bold visual language featuring game related motifs, motion cues, and high-contrast layouts.
-
A clear navigation hierarchy distinguishing players, recruitment, and investors.
-
Streamlined content architecture that highlights HyberGaming’s games and mission.
Design Process
Research
Synthesis
Ideation
Low-Fi Design
High-Fi Design
Reflection
Trending
01 Research
Designing for Delight: Learning from Real Players
Before starting the redesign, I conducted a series of research activities to understand how visitors perceived the original Bitus Labs website and what caused confusion in communicating HyberGaming’s identity
I interviewed our internal staff, including developers, marketers, and recruiters — to identify pain points from both internal and external perspectives.
01
Audience Understanding
02
Brand Perception
03
Content Relevance
04
Information Clarity
05
Visual Appeal & Trust
Competitive Analysis
To position HyberGaming as a recognizable and trustworthy game studio, I conducted a competitive analysis of leading studio and publisher websites, including
JILI GAMES
EEZE
POCKET GAMES SOFT
JILI GAMES
EEZE
POCKET GAMES SOFT
Clear Brand Positioning
✔
✔
✔
Audience Focused Navigation
✔
✔
✔
Visual Identity
X
✔
✔
Information Hierarchy & Clarity
✔
✔
✔
Responsiveness & accessibility
✔
X
X
Through the competitive analysis, I found that while many gaming companies present strong visuals, most struggle to communicate their brand story clearly across different audiences.
Some appear overly corporate, while others prioritize visual effects at the cost of clarity.
These insights revealed an opportunity for HyberGaming to create a website that feels visually playful yet strategically focused
Trending
02 Synthesis
A Clearer Story, A Stronger Identity
From the research and competitive analysis, several key insights emerged:
-
Visitors often couldn’t tell whether the company specialized in AI development or game publishing.
-
The original site didn’t differentiate between players, potential hires, and investors.
-
The old layout and style no longer reflected a modern gaming company.
-
The website lacked emotional engagement and failed to highlight the company’s vision, products,
01
Unclear brand focus
02
Lack of audience segmentation
03
Outdated visuals and structure
04
Missed storytelling opportunities
.png)
.png)
My research led me to wonder…
How might we redesign the HyberGaming website so that it clearly communicates our identity as a game company
Trending
03 Ideation
Defining a clear and playful identity
I explored multiple ways to bring HyberGaming’s identity to life while keeping navigation simple and intuitive.
Ideation
By exploring different site architectures and visual systems, I brainstormed multiple approaches to make HyberGaming’s website feel both authentically game-oriented and professionally credible.
Some early directions included:
-
Designing a split-brand layout separating Bitus Labs (AI) and HyberGaming (Games).
-
Using real game visuals and motion graphics as the primary storytelling medium.
-
Creating audience-specific entry points for players, recruiters, and investors.
-
Exploring light animations and parallax movement to convey a sense of playfulness.
Early Ideas
1. Split-Brand Architecture
A dual-site structure that isolates the game-focused HyberGaming domain from Bitus Labs’ AI projects, reducing confusion and clarifying the company’s core identity.
2. Interactive Game Showcases
Designing hero sections that simulate the feeling of playing — with hover-based transitions, game-like sound effects, and embedded trailers to immerse visitors immediately.
3. Audience-Tailored Navigation
Dedicated landing paths for players (games and updates), recruiters (studio culture, careers), and investors (partnerships, achievements).
Selected Idea — Interactive Game-First Website
The final concept centered on making HyberGaming’s games the core storytelling element.
By featuring gameplay clips, character art, and animation as the visual foundation, the site now instantly communicates its identity as a game studio, while maintaining a modern, professional layout suited for business stakeholders.
This approach balances entertainment and clarity — inviting players to explore, inspiring candidates to join, and assuring investors of the studio’s credibility.
I built a game first component system aligned to HyberGaming’s three audiences—players, candidates, and investors. Each module tells a specific part of the story and ships with variants for different contexts; responsiveness is built-in, but the priority is clarity and scalability.
Game-First Modules: A Component System for Three Audiences
Trending
04&05 Design
Designing a Game-Centric, Trust Building Experience
The design centered on redefining HyberGaming’s identity as a true game studio.
The goal was to merge the excitement of gaming visuals with the clarity of a professional brand site, ensuring visitors immediately understand what the company does and why it matters.
Moodboard: Establishing a Playful Visual Language
-
To shape the visual direction, I collected references from modern game studios and interactive entertainment websites that balance energy with trustworthiness.
-
I explored how color contrast, lighting, and typography can convey both excitement and professionalism — ensuring the site feels playful enough for players yet credible for investors and recruits.
-
The final direction combines vibrant gradients, soft glows, and subtle motion cues, reflecting HyberGaming’s creative spirit while maintaining the polish expected from a modern studio.
Hi-Fidelity
-3.png)
Hero Section
-2.png)
Game
-1.png)
About
.png)
Contact
Trending
Users responded positively, but there was room to refine the experience.
I conducted usability testing sessions with internal stakeholders and early visitors to evaluate the redesigned HyberGaming website. Overall, participants appreciated the clearer navigation, stronger brand identity, and more game-oriented visuals, noting that the site finally “felt like a game studio.”
However, several key issues surfaced during feedback sessions:
-
The color palette felt overly saturated, which distracted from the professional tone the brand aimed to convey.
-
Game showcases could not be fully demonstrated, since games were still in development, resulting in visual gaps and incomplete interactions.
-
The number of pages and navigation depth caused some visitors to lose context or struggle to find what they needed.
Iteration
Based on the feedback, I refined the website by softening the color palette, focusing only on game covers and promotional visuals, and condensing the content into a single scrolling page.
Final Design
%205.png)
06 Reflection
Outcome
The redesigned website successfully clarified HyberGaming’s brand identity and improved visitor engagement. Following the launch, recruitment performance increased significantly, with the team growing from 20 to 45 members within a short period.
The Experiences
This project deepened my understanding of how to build a product that balances creative identity with usability.
Working closely with marketers and product manager taught me how to align visual storytelling with business goals — ensuring the website speaks clearly to players, partners, and investors.
Insight & Illustrations Improvement
I strengthened my UI/UX design strategy and communication skills, learning how to translate brand values into interactive web experiences.
Through this process, I refined my design system workflow in Figma, creating reusable components and responsive layouts that improved design consistency and development efficiency.
If I had more time
If given more time, I would expand the design system and documentation to support future website updates and product launches.
While the designs were functional, I realized that better documentation, clearer naming conventions, and a more systematic component setup would streamline handoff and make collaboration even smoother.