Product UX/UI Upgrade
Product UX/UI Upgrade
Winon came to us with an outdated visual identity — inconsistent colors, mismatched assets, and components that no longer reflected the brand. We led a complete UI upgrade: a new visual language, a refreshed color system, and a component library built for consistency across the entire platform.
Winon came to us with an outdated visual identity — inconsistent colors, mismatched assets, and components that no longer reflected the brand. We led a complete UI upgrade: a new visual language, a refreshed color system, and a component library built for consistency across the entire platform.
Pixel Art Identity
For Winon Casino, we chose a pixel art robot as the main symbol. The robot represents the product’s smart, tech-driven nature, while the pixel art style reflects simplicity and clarity. We also apply the pixel approach in the overall composition, visually dividing the project into clear, structured sections.
For Winon Casino, we chose a pixel art robot as the main symbol. The robot represents the product’s smart, tech-driven nature, while the pixel art style reflects simplicity and clarity. We also apply the pixel approach in the overall composition, visually dividing the project into clear, structured sections.
Building the Color System
The first decision was to go fully dark mode. From there, we defined three core dark shades to form the base of the interface - giving the platform depth without losing clarity. For accent, we kept Winon's brand blue at the center of the experience, ensuring the new UI still felt unmistakably Winon. Finally, we added three fixed status colors green, yellow, and red to clearly communicate states like success, warning, and error across every component, consistently.
The first decision was to go fully dark mode. From there, we defined three core dark shades to form the base of the interface - giving the platform depth without losing clarity. For accent, we kept Winon's brand blue at the center of the experience, ensuring the new UI still felt unmistakably Winon. Finally, we added three fixed status colors green, yellow, and red to clearly communicate states like success, warning, and error across every component, consistently.
Beyond the color system, we developed a dedicated concept for cards and widgets․ The components users interact with most. Each one was designed to be visually distinct, giving Winon a look that stands apart from other platforms in the space, instead of blending into the generic casino UI look.
Sport-Specific Components
For the sports section specifically, we designed a dedicated set of components - event cards, tabs, filters, and markets - each built to handle the density and complexity of sports betting data while staying clean and easy to navigate.
For the sports section specifically, we designed a dedicated set of components - event cards, tabs, filters, and markets - each built to handle the density and complexity of sports betting data while staying clean and easy to navigate.
2 Ways to View the Sports Events
To fit different user preferences, we designed two distinct grid layouts for the sports page: a Card View and a List View. This gives users the flexibility to choose the format that feels most comfortable to them - whether they prefer a more visual, spaced-out layout or a denser, faster-scanning list.
To fit different user preferences, we designed two distinct grid layouts for the sports page: a Card View and a List View. This gives users the flexibility to choose the format that feels most comfortable to them - whether they prefer a more visual, spaced-out layout or a denser, faster-scanning list.
The Single Event Page
The single event page was designed so users can see markets and live game results at a glance - no digging, no extra clicks. Everything they need to make a fast decision is right in front of them.
The single event page was designed so users can see markets and live game results at a glance - no digging, no extra clicks. Everything they need to make a fast decision is right in front of them.
Your Growth,
Our Mission
/01
Product & Competitors Audit
Before you spend a dollar on redesign, you need to know exactly what's working and what's quietly costing you customers. We dig into your product's usability, visual trust signals, and how you stack up against competitors. You'll walk away with a clear, honest breakdown of what to fix first and why it matters for your bottom line.
/01
Product & Competitors Audit
Before you spend a dollar on redesign, you need to know exactly what's working and what's quietly costing you customers. We dig into your product's usability, visual trust signals, and how you stack up against competitors. You'll walk away with a clear, honest breakdown of what to fix first and why it matters for your bottom line.
/02
UX/UI Upgrade
/02
UX/UI Upgrade
/03
Design System for Scalable Platforms
/03
Design System for Scalable Platforms
FAQs
How long does a typical project audit take?
Project timelines vary based on scope, but most branding or website projects take between 5 – 14 days.
Do you offer ongoing support after launch?
What if I only need audit or design, not both?
Can you work with my internal team?
How does the dedicated designer service work?
Do you work with startups or only established companies?
FAQs
How long does a typical project audit take?
Project timelines vary based on scope, but most branding or website projects take between 5 – 14 days.
Do you offer ongoing support after launch?
What if I only need audit or design, not both?
Can you work with my internal team?
How does the dedicated designer service work?
Do you work with startups or only established companies?
FAQs
How long does a typical project audit take?
Project timelines vary based on scope, but most branding or website projects take between 5 – 14 days.
Do you offer ongoing support after launch?
What if I only need audit or design, not both?
Can you work with my internal team?
How does the dedicated designer service work?
Do you work with startups or only established companies?
Let’s Talk
Your Next Big Idea
Fill This Form Below
Let’s Talk
Your Next Big Idea
Fill This Form Below
Let’s Talk
Your Next Big Idea