Thorchain swap interface redesign

Context

THORChain is a decentralized exchange built on real native assets: trade actual Bitcoin for actual Ethereum from your own wallet, with no wrapped tokens, no bridge and no account. It pioneered native cross-chain swaps and runs the largest Bitcoin DEX, with over $120 billion settled since 2019.

This mission was part of a full rebrand led by Le Fruit Studio: new brand identity, new landing page and more. My mission focused on the swap interface itself, redesigning it and rebuilding a complete UI Kit, a new visual layer over the existing flow without touching the cross-chain logic underneath.

Challenge

• Redesign a swap interface a lot of people use, without breaking the flow that already worked or the cross-chain logic behind it.

• Make a dense cross-chain transaction legible: asset selection across 13 chains, rate, slippage, network and liquidity fees, full transaction details and confirmation.

• Cover every state of a self-custody swap: disconnected, connected, multiple wallets, asset selection, swap ready with details open, confirmation.

• Rebuild a complete, reusable UI Kit so the team could keep shipping on their own after handoff.

Approach

• Took the art direction set by Le Fruit Studio and translated it onto the swap interface, screen by screen.

• Turned it into a UI Kit that is as clean as possible: built on variables, with light and dark mode driven from the same components.

• Designed a deep component library covering the real product: buttons, dropdowns, inputs, modals, icons, the asset selector and every wallet and connection state.

• Reworked the swap flow state by state: connected, multi-wallet menu, select-asset modal, swap ready with details open, and confirmation.

• Built for what comes next: future use cases anticipated, everything fully responsive, ready for the team to extend after handoff.