Velora Widget is a new integration layer of the Velora Protocol. It’s a plug&play customizable React component that empowers founders, product managers, and developers with a quick way to integrate Velora’s intent-based cross-chain trading capabilities into their DeFi projects.
My Role
As Head of Design, I led the Trading Widget project end-to-end and shaped it as a product and distribution lever rather than just an interface. I worked closely with Product, Engineering, and Business Development to define its positioning, scope, and success criteria.
Timeline
2 weeks, September 2025
Tools
Figma, Jitter, Framer
The Context: designing the trading widget as a growth and distribution engine
In 2025, Velora evolved from a DeFi liquidity aggregator into an intent-based, cross-chain trading platform. With that came a new set of capabilities: MEV protection, gasless trades, best-price execution, and instant cross-chain swaps.
The Challenge: deliver powerful cross-chain trading without added complexity
Offer advanced cross-chain trading capabilities with minimum integration effort
Gain trust and transparency in a high-risk financial context
Adapt to multiple environments (stand-alone, embedded, modular, mobile, dark/light)
Scale across many partners through configuration rather than custom builds
One additional challenge was strategic: Velora chose to become the first client of the widget, replacing the most important parts of its core product with it.This meant the widget had to meet both internal product standards and external partner expectations from day one.
Research Insights: design decisions grounded in real usage
Product analytics, partners' feedback, user sessions, and support tickets revealed recurring friction points across the swap experience.
Competitive Analysis: where Velora leads, others stop
Velora is the only widget that combines instant (intent-based) cross-chain trading, OTC orders, a dedicated trade lifecycle UI, and a no-code configuration layer into a single native React component.
The Solution: one trading system, multiple contexts
A configurable, embeddable trading system that brings Velora's cross-chain execution to partner dApps and its own product. It runs standalone, inside partner apps, or as Velora's core trading interface, adapting to each context through configuration and theming rather than custom builds.
Illustrations and animation by Mihajlo Martinovic
How the system works
Velora Widget is built around a single-core system. Partners configure how it looks and where it runs, but execution and routing remain consistent and under Velora's control.
Information Architecture: annotated task flow for cross-chain swaps
Focus on the new Trading Overview
Illustrations and animation by Mihajlo Martinovic
Configuration layer: Widget Playground
The Playground is a no-code environment where partners configure and preview the trading widget in real time. Instead of the previous iframe approach, which offered limited customization options, partners now control theming, layout, and behavior directly before integration.
The Outcome: designing systems that scale with the business
The Trading Widget turned Velora's infrastructure into an embeddable product. Partners could spin up branded trading experiences without extensive integration, opening new revenue streams and driving volume back into the protocol.
This kept onboarding fast, execution consistent, and maintenance low as the partner ecosystem grew.
Velora Widget is a compact component that empowers founders and developers with a quick way to integrate Velora’s intent-based cross-chain trading protocol.