2025 · Дизайн + инженерия
Reswap
Децентрализованная биржа на Solana — кошельки, свопы, живые графики и real-time данные, собрано целиком на фронте
Контекст
Децентрализованная криптовалютная биржа на Solana — полная DeFi-поверхность для on-chain трейдера. Token swap с маршрутизацией через Jupiter-агрегатор, IDO-продажа новых токенов, liquidity engine с пулами и provider-доходностью, staking, награды и yield-механика, страница токена с real-time графиком цен. Девять локалей (en/ua/ru плюс шесть других), wallet-connect под несколько Solana-кошельков (Phantom, Solflare, Backpack и др.), ORAO randomness on-chain. Дизайн-язык, фронт и on-chain интеграции — всё из одних рук.
Задача
Провести сложный DeFi-продукт через весь его смысловой объём — swap, IDO, liquidity, staking, награды, FAQ, страница токена — так, чтобы он не выглядел как админка для разработчиков. Дизайн-язык должен держать одну и ту же спокойную ясность на простом swap-окне, в multi-step IDO-флоу и на живом графике с тикерами цен. Заинженерить on-chain слой (wallet-adapter, web3.js, Jupiter routing, SPL Token, ORAO randomness), удержать real-time данные через reconnecting WebSockets и кастомный RPC-слой, сделать продукт локализуемым на девять языков с консистентной типографикой.
Сделано
Дизайн-язык с чистого листа: палитра, типографика, motion-система, кастомная иконография по разделам, layout-tokens. Next.js 15 + React 19 + TypeScript App Router с next-intl на девять локалей, Radix UI-примитивами, Tailwind design tokens. Solana-стек: @solana/web3.js, wallet adapter под несколько кошельков (Phantom, Solflare, Backpack, Trust и др.), SPL Token, Jupiter-агрегатор для маршрутизации swap, ORAO randomness on-chain для рандомных событий. Lightweight-charts от TradingView для real-time ценовых вью с собственным feed-слоем поверх. Lottie для motion-акцентов, react-slick + framer-motion поверхностью. Reconnecting WebSockets для live-обновлений цен и orderbook, axios для off-chain вызовов, кастомный RPC-слой с rate-limiting и retry-логикой. Server actions для off-chain workflow (IDO-whitelist, claim flows). Каждый визуальный элемент — оригинальный, каждый системный слой — сделан руками.
