Problem
This is not a landing-page task. Users need to find a game, understand product status and compatibility, compare options, pay through supported methods and recover from incomplete or unavailable states.
Case study 042026
CheatRise / Game Commerce Platform
Source-backed product case with multiple routes, five responsive widths and a large component-and-state UI-kit.
View project↗CheatRise
- Case type
- E-commerce product design
- Role
- Product Designer + UI/UX Designer
- Period
- 2026
- Status
- Product flows + responsive system
01
Problem and solution
Solution
A full e-commerce product design with catalogue navigation, status logic, payment surfaces, product states, responsive flows and a documented UI system.
My role
Product Designer + UI/UX DesignerMapped the core commerce routes from discovery and filtering to product detail, payment and support.
02
Research
E-commerce pattern and state review
I treated the product as a commerce journey rather than a promo page: discovery, comparison, availability, purchase, notifications and error recovery.
For a digital product, trust comes from transparent states and a predictable payment journey.
The design section contains desktop product routes for homepage, catalogue, game catalogue, status, notifications, additional software and detailed product information.
The responsive system includes homepage frames at 1920, 1440, 992, 430 and 360 px plus menu and popup states.
The UI-kit documents typography, color scales, effects, tabs, status badges, payment methods, buttons, fields, filters, cards, accordions, headers and footers.
All case images are direct exports from the provided Figma nodes.
03
Information architecture
Core purchase journey
The interface anticipates branches: available, updating, unavailable, version selection and support.
- 01Catalogue→
- 02Filter and search→
- 03Product detail→
- 04Payment→
- 05Delivery and support
CheatRise
- 01
Mapped the core commerce routes from discovery and filtering to product detail, payment and support.
- 02
Designed operational states for availability, updates, status badges, notifications, forms and payment methods.
- 03
Built responsive compositions and a UI-kit so new product and catalogue screens can be assembled consistently.
04
Visual concept
The project's character becomes its own presentation system
The mockup does not disguise the interface: environment, colour, scale and medium extend the logic of the project itself.
- 01
Dark gaming environment with a functional accent
- 02
States matter more than decorative variants
- 03
A component system built to scale the catalogue
05
Design and system behaviour
Not a gallery of pictures, but a sequence of states
Each visual is tied to a journey stage and demonstrates a distinct part of the solution.
06
Validation and outcome
Result and system scope
Source-backed product case with multiple routes, five responsive widths and a large component-and-state UI-kit.
What can be verified
- 01
Provided source: Figma design node 533:8046.
- 02
The case includes homepage, responsive variants and a direct UI-kit export.
- 03
The source visibly contains multiple routes and component variants, not only a hero concept.
Role boundaries
Product design project · Role: Product Designer + UI/UX DesignerProduct names, game artwork and commerce content remain with their respective owners.
The case documents product and interface design; it does not make claims about a live production launch or sales metrics.
Outcome
A full e-commerce product design with catalogue navigation, status logic, payment surfaces, product states, responsive flows and a documented UI system.
Open verified source ↗Discuss a related project
Need a website, product interface or automation system?
Send the current surface, goal and constraints. I will propose a route from diagnosis to a verifiable release.
Discuss a related project↗