SameFinance
Web3 dApps, DeFi
SameFinance is a decentralized finance platform built as a part of the Samecoin ecosystem
Project overview
The platform combines advanced trading functionality, auto-compounding, and stablecoin-based payments into a seamless product structured around simplicity, accessibility, and trustless interaction.
One design system, multiple products at a time
SameFinance was developed as part of the broader Samecoin ecosystem, which also includes products like SamePay mobile app and the Samecoin protocol interface. To support this ecosystem, the platform was built on a token-based design system that can be easily themed and extended across future releases.
Core elements like color variables, component behaviors, and typography styles were centralized in Figma and exported to development via shared tokens.
Tailored Web3 patterns and UX
Unlike traditional web apps, SameFinance operates in a decentralized environment where key user actions, such as connecting a wallet or confirming a transaction , happen through external blockchain layers. This required rethinking many common UX conventions.
Designing predictable, consistent Inputs
A strong focus was placed on the input components system, which plays a central role in nearly every transaction and action across the platform. From farming to token swapping, users interact with forms constantly.
Each input field was designed to display essential contextual data such as available balance, estimated gas fees, and token selection, avoiding extra taps or uncertainty. To streamline actions, the UI included quick percentages selectors, MAX balance buttons, clear field resets, and token switchers.
Figma view of the input system with lists of ready-to-use component variants
Visual language for DeFi actions
To help users navigate recurring financial patterns, a custom icon set was developed to represent key actions (staking, farming, swapping, or claiming) These icons were lightweight, high-contrast, and scalable, ensuring usability even in dense interfaces or small-screen environments.
Their consistent use across the UI strengthened user recognition and behavioral mapping, allowing users to orient themselves quickly while reinforcing product branding.
Key takeaways
Core design choices and structural patterns that helped shape the product’s assuring overall usability, consistency, and responsiveness across platforms:
UX patterns were tailored specifically for Web3 wallet connectivity and transaction signing
Leveraged yield farming flows were simplified through progressive input and real-time feedbackLight & dark token-based theming
A flexible, themeable design system enabled product consistency across the Samecoin ecosystem
All actions, from deposits to claims, provided immediate visual validation and minimized friction
Product gallery
next work case
