GlobalX – DEX
GlobalX – DEX - Website Development - Photo 1
Enhanced usability

Simplified DeFi operations like token swaps and liquidity management, ensuring accessibility for users of all experience levels.


Responsive performance

Delivered a fully adaptive platform with seamless functionality across both desktop and mobile devices.

Scalability and security

Built a robust, secure architecture capable of handling high transaction volumes efficiently.

Overview
GlobalX DEX is a crypto development project operating on the Ethereum network.

GlobalX approached Phenomenon Studio with an ambitious vision to revolutionize the decentralized finance (DeFi) space through an all-in-one decentralized exchange (DEX) platform. Previously, the client partnered with us to develop the Global X Token Sale page, and, satisfied with the outcome, returned for this project.

The platform is designed to provide development and stability to the GlobalX token, expanding their ecosystem. By enabling seamless token swaps, increasing liquidity, and ensuring security, the DEX bridges traditional finance and DeFi, offering simplicity and scalability to users.

Client
GlobalX Image - fi_4628635 (3)USA
Technologies
Icon - Group 758530483TypeScript Icon - ReactReact Icon - Wagmi--Streamline-Simple-IconsWagmi Icon - radix-ui 1Radix UI Icon - ethers-seeklogo 1Ether.js Icon - framer-motion 1Framer Motion Icon - react-query-seeklogo 1Tanstack Query Icon - d3js 1D3.Js Icon - Tanstack TableTanstack Table Icon - redux 1Redux Icon - ZustandZustand Icon - GroupGraphQL Icon - apollo-graphql-compact 1Apollo Icon - image 295Magic SDK Icon - jest-svgrepo-com 1Jest
GlobalX – DEX - Website Development - Photo 2
Review
What client says
Image - Rectangle 34624326
Joshua Caleb
We reached out to this team for the development of our cryptocurrency exchange web app (DEX Swap), and the result exceeded all expectations. We’re very pleased with how everything turned out in terms of both functionality and design. The app works flawlessly, and its interface is very user-friendly.
Business needs
Client request & business goals

GlobalX tasked our company with creating a user-friendly decentralized exchange (DEX) to simplify complex DeFi operations like token swaps and liquidity management. Building on our previous successful collaboration, their goal was to expand the GlobalX token ecosystem, combining advanced functionality with an accessible design for users of all experience levels.

We provided a complete solution, from competitor analysis to development. We designed intuitive user flows, created a futuristic, adaptive UI, and developed a secure, scalable platform using technologies like React and Wagmi. Our focus was on blending functionality, performance, and a seamless user experience.

Icon - process-1
Wondering about the price? We’ll help you find the best solution!
Project
Problems & solutions
Problem
Many existing DeFi platforms have overly complex interfaces, making it difficult for beginners to navigate features like token swaps and liquidity pools.
We simplified the interface by focusing on essential functions, such as token swaps and liquidity management. Features like one-click token swaps and easy wallet connections were implemented to enhance usability for all experience levels.
Problem
Ensuring a seamless experience across both mobile and desktop platforms was critical, as users often struggled with inconsistent navigation and layouts.
We designed responsive layouts that adapted smoothly to different devices. A consistent grid structure and space-inspired visuals ensured clarity and usability across all screens.
Problem
Handling high transaction volumes while maintaining security and performance was a significant challenge for the platform.
We utilized technologies like Wagmi, Ethers.js, and TypeScript to create a robust, scalable architecture. Rigorous testing ensured secure and efficient performance under heavy loads.
Research
Research-driven UX: simplifying crypto swaps and token management

In the research phase of the GlobalX, we conducted a thorough competitor analysis to identify usability gaps in decentralized exchanges, focusing on crypto swapping, fiat onramps, and token ecosystems. A UX audit revealed common challenges, such as complex navigation, unclear transaction flows, and a lack of transparency in token management. These insights guided our design approach, ensuring an intuitive user experience that simplifies DeFi interactions while enhancing engagement with the GlobalX token ecosystem.

Stages

  • Competitor Analysis
  • UX audit
  • Map
  • User Flow
Stage 1
Competitor analysis

We analyzed competitors like Uniswap, Curve.fi, Propeller and Carbon, uncovering several issues. Many platforms had overly complex interfaces, leading to poor user experiences, especially for beginners. We also found that liquidity providers face risks like impermanent loss, which can deter participation in liquidity pools. High transaction fees and slower processing times were common challenges.

GlobalX – DEX - Website Development - Photo 5
Stage 2
UX audit

During the UX audit of GlobalX DEX, we identified key usability issues, including inconsistencies in UI components, a lack of system feedback, and navigation challenges that hindered smooth user interactions. Critical workflows—such as swap execution, wallet connection, token selection, and adding liquidity—suffered from unclear layouts, requiring users to make unnecessary steps or encounter friction in completing transactions. To address these issues, we implemented a cohesive design system, enhanced real-time feedback mechanisms, optimized navigation flows, and refined layout structures to ensure an intuitive, seamless, and efficient user experience across all core DeFi functionalities.

Stage 3
Map

Guided by Competitor Analysis and UX audit, we meticulously crafted the Information Architecture for GlobalX. This phase focused on creating a user-centered structure that is easy to understand and navigate, ensuring a smooth and enjoyable experience for all users.

GlobalX – DEX - Website Development - Photo 6
Stage 4
User flow

At the user flow stage, we mapped out step-by-step interactions for key actions like swapping, connecting a wallet, selecting tokens, and adding liquidity to ensure a smooth experience. We optimized the flow to minimize unnecessary steps, reduce cognitive load, and provide clear guidance for both novice and experienced users.

GlobalX – DEX - Website Development - Photo 7
Design
Designing a modern DeFi platform with clarity and engagement in mind

During the design stage, we started with wireframing to structure layouts and refine user interactions for a seamless DeFi experience. We then developed a moodboard and design concept, establishing a modern, clean aesthetic that aligns with the GlobalX brand and enhances usability. Finally, we applied these principles in the UI design, creating an intuitive, visually appealing interface that improves navigation, clarity, and engagement across all platform features.

Stages

  • Wireframes
  • Design direction
  • UI Design
Icon - process-1
Wondering about the price? We’ll help you find the best solution!
Stage 1
Wireframes

At the wireframing stage, we focused on designing the user interface and experience for GlobalX Dex, creating low-fidelity mockups to outline the platform’s layout and functionality. This involved strategically placing key elements like the swap interface, liquidity pool information, and wallet connection to ensure a seamless and intuitive user journey.

GlobalX – DEX - Website Development - Photo 8
GlobalX – DEX - Website Development - Photo 9
Stage 2
Design direction

During the moodboard and design concept phase we established the visual direction for GlobalX Dex, drawing inspiration from space exploration and futuristic technology. This vision was translated into a clean, modern aesthetic using the Outfit font for enhanced readability, a consistent space-inspired color palette, and a grid-based layout to ensure a cohesive user experience across the platform.

Stage 3
UI design

In the UI design stage we meticulously crafted the visual interface for GlobalX Dex, applying the established design language to create pixel-perfect screens and interactive elements. This culminated in a comprehensive UI kit, providing a reusable library of components and styles to ensure design consistency and streamline future development.

GlobalX – DEX - Website Development - Photo 12
Development
Building the backbone of a seamless DEX experience

In the development phase, our priority was to build a secure, scalable, and high-performing DEX that seamlessly integrates advanced blockchain features. Using React as the foundation, we ensured a robust and responsive front-end experience tailored for both desktop and mobile users. Blockchain interactions were streamlined with Wagmi, enabling efficient and reliable connectivity with Ethereum and Uniswap.

To enhance user experience, we implemented real-time data visualization tools and intuitive wallet connection processes, ensuring users could easily access key features like token swaps and liquidity management. Extensive testing processes were carried out to validate performance, security, and scalability, guaranteeing a smooth and dependable experience across all devices.

Technologies
Selected technologies
Icon - Subtract
TypeScript
Icon - React
React
Icon - vite-1 1
Wagmi
Icon - react-query-logo-png_seeklogo-435661 1
Tanstack Query
Icon - Frame 2131329620
Ether.js
Icon - radix-ui 1
Radix UI
Icon - vite-1 1-1
Framer Motion
Icon - vite-1 2
D3.Js
Icon - vite-1 3
Redux
Icon - vite-1 4
GraphQL
Icon - vite-1 11
Apollo
Icon - image
Zustand
Icon - vite-1 12
Magic SDK
Icon - vite-1 13
Jest
FEATURES
Project’s core features
GlobalX – DEX - Website Development - Photo 13
GlobalX – DEX - Website Development - Photo 14
GlobalX – DEX - Website Development - Photo 15
Decentralized dwaps

We meticulously designed and implemented Decentralized Swaps that are truly seamless. We wanted to cut out the intermediaries and put users directly in control of their trades, making the process intuitive and secure. This is decentralized finance as it should be – empowering and transparent.

GlobalX – DEX - Website Development - Photo 16
Info page

We created the Info Page, a comprehensive resource where users can explore all the details about our tokens and liquidity pairs. We want our community to be informed traders, equipped to make smart decisions and navigate the space with confidence.

RESULTS
Achieving a seamless balance of innovation and user-friendliness
Enhanced usability

Simplified DeFi operations like token swaps and liquidity management, ensuring accessibility for users of all experience levels.


Responsive performance

Delivered a fully adaptive platform with seamless functionality across both desktop and mobile devices.

Scalability and security

Built a robust, secure architecture capable of handling high transaction volumes efficiently.

The GlobalX DEX successfully delivered a user-friendly platform that bridges advanced DeFi functionality with simplicity and accessibility. The intuitive design and streamlined workflows made complex features like token swaps and liquidity management easy to use for both beginners and experienced users. The responsive, scalable platform ensured seamless performance across devices, aligning with GlobalX’s futuristic branding and business goals.

Our rigorous approach to research, design, and development enabled us to create a platform that expanded GlobalX’s ecosystem while maintaining high standards of security, performance, and usability. This project solidified our collaboration with GlobalX and set a benchmark for excellence in DeFi platform design.

Our cases
More cases

#Product discovery #Web app design #Web development

Bliss Creek admin panel – how a custom dashboard design simplified user management and streamlined transaction cycles
Bliss Creek Image - fi_4628635NJ, USA
Tech Stack

React, Next, Flowbite for ui, Firebase, Tailwindcss, Redux, React Hook Form

Timeline

6 month

Results

2x faster user onboarding and management

Reduced admin task completion time

Enhanced data accuracy and compliance across all cycles

#Website design #Website development

GlobalX – promo website for DEX
GlobalX Icon - fi_4628635USA
Tech Stack

Typescript, React, Vite, Framer motion, Tanstack query, Radix UI, Zod

Timeline

2 month

Results

Increased user confidence

Simplified user experience

Improved engagement

Image - Rectangle 34624326

Joshua Caleb

Working with the team on our landing page was incredibly productive and enjoyable. From the very beginning, the team demonstrated high professionalism, thoroughly understanding our goals and requirements. Not only did they create an attractive and modern design, but they also made the site user-friendly and functional.

#UX Audit #Product redesign #Web development #Team extention

Isora – optimizing governance, risk & compliance for top institutions
SaltyCloud Icon - fi_4628635Texas, USA
Tech Stack

React, Python, AWS

Timeline

12 months, ongoing

Results

2x faster user workflows

50% shorter time-to-market

Nominated for UX Design Award 2024

Contact us

Have a project in mind?
Let's chat

Your Name

Enter your name *

Your Email

Enter your email *

Message

Tell us about your project

You can upload maximum 5 files
Some of your file not loaded, because maximum file size - 5 mb
Your budget for this project?

By clicking this button you accept Terms of Service and
Privacy Policy

Icon - launch
Thanks for taking time to reachout!
Stay connected with us by subscribing to our LinkedIn account. By following, you’l be the first to hear about our latest updates, news, and exciting development. We look forward to sharing our journey with you!
Icon - launch
Thanks for taking time to reachout!
We’d love to hear more about your project! Feel free to schedule a call using the link provided. This will help us better understand your vision and ensure we’re aligned on all the details.
Have a project to
discuss?
Image - ksenia
Kseniia Shalia
Account Executive
Have a partnership in
mind?
Image - polina
Polina Chebanova
Co-Founder & CPO