FEB 21, 2025

2,602 words

8 m

🔍 Rethinking a crypto exchange: a UX/UI analysis for Bybit

A strategic review of usability, branding consistency, and product flow design

In January 2021, as part of an application for a senior product design role at Bybit, a comprehensive UX/UI analysis was conducted to evaluate the platform’s design maturity, usability gaps, and branding consistency.

Standardizing the design language

At the time of review, Bybit’s interface was shaped by an inconsistent set of design variables, leading to redundant elements and special-case exceptions that diluted brand consistency. A centralized style file was proposed to consolidate typography, color, and spacing tokens into a single system.

The suggested color foundation for surfaces and typography

The suggested color foundation for surfaces and typography

Onboarding and first-time experience

The default app state for new users felt static and uninviting. Upon first login, there was little visual or functional indication of what to do next. The analysis proposed a solution built around an interactive walkthrough, guiding new users through the app’s core features.

Starting a walkthrough by guiding users through the mobile app menu

Starting a walkthrough by guiding users through the mobile app menu

Keeping primary actions always visible

Data-heavy screens created layouts where important actions became buried under long scrollable lists. Key interactions, such as depositing funds, were not always easily reachable in context. To solve this, the recommendation was to adopt persistent floating action buttons (FABs) for core operations. This approach ensures that no matter where users are in their browsing flow, critical actions remain one tap away, improving both accessibility and task completion speed.

Use of a FAB button to keep the main action visible to the user

Use of a FAB button to keep the main action visible to the user

Clearer iconography with purpose

Icons often included too many elements, making them difficult to recognize at smaller sizes, especially on mobile. In some contexts, repeated icons with no clear textual distinction created confusion rather than clarity. A simplified, more meaningful icon set was proposed, where each visual is directly tied to its label and functional context, improving both accessibility and quick recognition.

Screenshots showing lack of recognizability across the icons set and their usage

Screenshots showing lack of recognizability across the icons set and their usage

Rethinking layout patterns and visual hierarchy

In many cases, the repeated use of flat browsing patterns led to user fatigue and cognitive friction. The analysis emphasized the importance of treating layout as a navigational path, suggesting the use of tabs navigation in replace of long lists.

Comparison between the old navigation approach (left) and the new tabs-based one

Comparison between the old navigation approach (left) and the new tabs-based one

Key actions towards the product redesign

1. Build a unified design system: a reduced, standardized set of design tokens and visual rules would ensure a cohesive brand presence across all devices.

2. Strengthen core UI assets: refining iconography, optimizing visual spacing, and applying a consistent design system

3. Raise the UX standard: attention must be paid not just to visuals but also to interaction models, layout flexibility, and onboarding experiences that adapt to user needs and context.

bongio.work

2025

bongio.work

2025