Gate.io — Homepage Redesign
Redesigning the Gate.io homepage by identifying existing issues and proposing solutions — from UI analysis to high-fidelity redesign.
Context
In April 2024, I participated in a contract project with Gate.io, one of Asia's leading cryptocurrency trading platforms, to revamp its entire UI and upgrade its information architecture from version 2.0 to 3.0.
Gate.io is a centralized cryptocurrency exchange, established in 2013, that provides a platform for buying, selling, and trading over 3,800 cryptocurrencies. It's known for its wide range of supported cryptocurrencies, diverse trading options (including spot, margin, and futures), and advanced trading tools like trading bots and copy trading.
I was tasked with redesigning the Gate.io homepage by first identifying existing issues and then proposing solutions. Below is a demonstration of my analysis and approach before moving into the revamp process.
Task Requirements
- Analyze existing problems on the homepage, identify key issues, and break them down.
- Undertake a homepage redesign, with the scope covering — but not limited to — the homepage.
- Explain your understanding of the product, your design strategy, and your approach to problem-solving.
- Deliver a complete and finalized UI design solution.
This is what Gate.io's 2.0 homepage looks like in English & Chinese version:
Competitive Analysis
Since Gate.io is a cryptocurrency exchange, conducting competitor analysis and research before redesigning the homepage was essential. After reviewing numerous exchanges across Asia and North America, I focused on three major Asian platforms: OKX, Binance, and Bybit.
My summary: all three have optimized their websites and apps by embracing simplicity — streamlining complex and redundant features to highlight only the most essential elements. They also use attractive visual effects to enhance the user experience subtly. This trend toward "less is more" might well represent the future direction of UI/UX design.
OKX
As one of the leading exchanges in Asia and worldwide, OKX is an innovative cryptocurrency exchange with advanced financial services. It provides hundreds of tokens and trading pairs, serving millions of users in over 100 countries.
Binance
Binance is one of the world's largest cryptocurrency exchanges, offering spot trading, futures, options, staking, and more. It's known for high liquidity, extensive cryptocurrency range, advanced trading features, and global reach.
Redesign Process
Goals
- Conducted problem analysis of the Gate.io homepage, identifying and breaking down existing issues.
- Redesigned the homepage while maintaining Gate.io's existing style and brand color scheme.
- The core objective was to improve information presentation, information architecture, interactions, and visual elements.
- The homepage redesign was primarily based on the English version of the site.
Analysis of Issues
By identifying problems and pain points, I thoroughly analyzed how each interactive element functions — examining where and how clickable components navigate users. I assessed all UI elements, including icons, colors, images, and abbreviations, to ensure they communicate clear and accurate information.
Redesign with Explanation
By addressing each issue, I provided solutions focused on enhancing user needs while ensuring consistency and accessibility. Rather than implementing dramatic changes, I focused on the finer details — such as overlooked functions, icons, and colors. I firmly believe that "great design lies in the details — refining every element ensures clarity, usability, and a meaningful connection with users."
Redesign with Explanation in Chinese
Final Deliverable
Project Contribution
During Gate.io's UI revamp project, the entire team collaborated to optimize both the website and app from version 2.0 to 3.0. My group focused on fundamental pages, and I primarily worked on the "My Profile" section and its subpages, including Announcements and Support. My responsibilities included applying the new design system, optimizing user flows and information architecture, and collaborating on competitor analysis.
An example of optimization of the My Profile static page in both light and dark mode:
Outcomes
Working as part of a large team gave me a great opportunity to experience the working style of Asian companies and understand how teamwork functions in a big organization. Along the way, I gained valuable hands-on experience that deepened my skills in both UI and UX design — expanding my professional abilities and teaching me a lot about effective collaboration and communication in a large team setting.