🏛️ HyperETH - Perpetuals & Trading

📋 TL;DR

HyperETH is a perpetuals and spot trading platform made for Web3, built to cut the cognitive overload other terminals normally ignore. As the sole product designer, I took it from competitive research all the way to 220 desktop and 225 mobile screens in 8 weeks. I also led a small team made up by an illustrator/brand designer and a motion designer. The core edges were a modular terminal, a modal-less layout, in-context knowledge bits and an AI trading copilot. HyperETH launched and quickly reached $10M in trading volume.

🎯 The problem

Most Web3 trading platforms are near-identical clones: same layout, same information overload, same modals stacked over the chart. They compete on social marketing and referral percentages, not on the experience of a trader who spends hours a day inside them, nor a newbie that's trying to get started.

Automata wanted a terminal that lowers that cognitive load without dumbing it down. It had to work for a first-time trader who doesn't know what a "TWAP" order is, and for a pro who wants every tool within reach.

👨‍💻 Who is it for?

Active Web3 traders, from all experience levels, typified by our persona William (27), who is tired of hopping between identical platforms and feels he lacks the tools and knowledge to get his next win. He doesn't just want higher referral rates, but also a trading terminal that actually cares about his way of trading.

🔬 What competitors taught us:

I audited Binance, Based and Drift, three platforms with the same core structure and small differences in tooling and UI. Three gaps showed up on all of them:

• Everyone sees everything. Every panel is on screen whether the trader needs it or not, which overloads newcomers and clutters pros, not adapting to their personal preferences.

• Jargon goes unexplained. Terms like "TWAP" or liquidation price are never explained in context, so new traders leave the platform to study rather than going for their first trades.

• The chart gets covered. Order flows, confirmations and settings open modals over the chart, the one thing a trader needs to keep watching all the time. This is how someone loses an opportunity.

🔍 Our defined edges:

1. A modular terminal

The Problem: One fixed layout serves nobody well. Newcomers drown in data, while pros still can't hide what they don't use.

The Decision: Easy-to-reach interface toggles that let each trader choose how much information the terminal shows, and how.

The Trade-off: By creating a custom terminal display, we also create the necessity for defining what should be displayed by default. Using the competitor audit, we shipped a single panel with core trade functions as the main view, and every other tool as tabs or toggleable views.

"I would love to be able to choose my own way of visualizing the info displayed on my trading terminal, I don't need some of these."

2. Info in view, always

The Problem: Every platform we studied interrupts the chart with modals and pop-ups.

The Decision: Go as modal-less as possible. All actions live in one fixed right-side panel, so the chart and positions stay visible at all times.

The Trade-off: We end up turning the terminal panel into "contested real estate", running the risk of making information hard to reach. Through progressive disclosure, we got to make modal elements, trading tools and tabs coexist properly.

"I want to have access to the most relevant sets of data and charts at all times, what if something happens and I miss it?"

3. Knowledge in context

The Problem: Unexplained jargon is the biggest barrier for new traders and sends them off-platform for hours of study.

The Decision: Small, well-placed knowledge bits next to the actions they explain. They give context to those who need it without cluttering the interface for those who don't.

The Trade-off: There's a fine line between relevant information and clutter, creating the need for evaluation around what's worth explaining or not. To make sure that this line is respected, we placed explainers near key actions and high-relevancy terms, tied to hover interaction.

"Sometimes I feel like my usual platforms are not giving me enough context. What even is a TWAP?"

4. An AI trading copilot

The Problem: Newcomers need simple answers, while pros want market insight. Both currently leave the platform to get them.

The Decision: An in-platform agent that answers trading questions, offers market analysis and suggests pairs based on the trader's strategy, making HyperETH one of the first platforms to support vibe trading.

The Trade-off: Providing trading suggestions can be quite risky if the user takes it as financial advice. Trust needs to be built through transparency on the logic behind the suggestions being offered. To ensure that, the agent always explains the reasoning behind each suggestion, and the user always makes the final call.

"I would really like to have a specialist with me, someone who can explain concepts I'm still missing, or maybe even give me some good trade lines."

🎨 Visual system

The interface is built for long sessions, so the visuals step back a bit, and the data leads. A dark, white-on-black palette reduces eye strain, and Work Sans keeps dense numbers readable across weights.

Two shape languages split the product. The terminal uses sharp-edged, stacked bento blocks so the structure recedes behind the action areas. The surrounding ecosystem (affiliates, secondary tools, promos) uses rounded, free-form components that feel friendlier.

🖥️ Key screens

1. Straightforward trading

Keeping an eye on where it matters the most, the metrics, the users can quickly deploy their positions, and manage them on a familiar yet fresh usage flow.

2. Modular terminal

With the usage of the modular approach, HyperETH's trading terminal presents the user with the choice of filtering how much info they want to see.

3. Every trade mode in reach

Featuring all the bells and whistles, HyperETH got released with multiple trade modes, and an ever-growing suite of tools made to give the user full control on their positions and trades.

4. AI Copilot

With the copilot integration, HyperETH can not only be its own source of trading knowledge, but also one of the first platforms using vibe trading, where agents can suggest pairs for the user based on their desired strategies.

5. For all knowledge levels

HyperETH features small explainers scattered everywhere in a non-intrusive manner, ensuring that everyone has the needed info and context on their actions, no matter what.

💭 Outcome & reflections

Having finished this project, HyperETH launched to thousands of users and reached $10M in trading volume. User feedback repeatedly called out its ease of use, its toolset and its overall quality.

If I could change something about how this project came to be, that would be having more user research pre-launch. This platform was developed during the "gold rush" caused by Hyperliquid's success, so every team was rushing to launch their own version. With more time to sit down with users, I'm sure we could've found even more angles to break the mold for trading terminals.

If you're feeling curious, you can check a few selected screens on the Figma window below: