Realport — Creating tradability for sustainable infrastructure.
Realport is a smart-contract-based institutional fundraising platform connecting small institutional investors with sustainable real asset owners. The challenge: give investors enough information to make confident decisions, while ensuring asset managers felt comfortable sharing sensitive data — before any KYC process began.
We ran a full Design Thinking process across four stakeholder groups — asset holders, regulatory partners, institutional investors, and the business itself. The output: a flexible asset card system for quick comparison, a structured deal room with three information layers, and an investment widget designed to build trust at every step.
View full case study →From fuzzy problem
to shipped product.
User interviews, stakeholder workshops, and competitive analysis. We don't guess what people need — we find out. Every insight becomes a design decision.
Information architecture, user flows, and taxonomy. Before any visuals, we map the structure — so the product makes sense to the people who'll actually use it.
Wireframes to high-fidelity Figma designs. Iterative, validated, and handed off with interaction specs your dev team can actually build from.
Dev-ready specs, design tokens, component libraries, and QA support. We stay involved post-launch to iterate on real-world usage data.
Design you can
actually build with.
User Research & Insights Report
Interview synthesis, pain point mapping, and actionable recommendations — so every design decision is grounded in real user data, not assumptions.
User Flows & Information Architecture
Clear maps of how users move through your product. From entry points to key actions — structured to reduce friction at every step.
High-Fidelity Figma Designs
Pixel-perfect screens covering every state — empty, loading, error, success. Not just the happy path; every edge case accounted for.
Design System & Component Library
Scalable Figma components with defined tokens, variants, and usage guidelines. Your team keeps shipping without starting from scratch.
Dev-Ready Handoff & Specs
Interaction specs, spacing docs, and Figma Dev Mode annotations. Developers know exactly what to build — no interpretation required.
Built for AI, Fintech & B2B SaaS.
These are the environments where UX complexity is highest and the cost of a poor experience is steepest. We've spent 10+ years designing products in exactly these spaces — and we know what works.
We speak your
industry's language.
For teams building
products that matter.
Startups validating their first product
You have an idea and maybe some code. You need a UX partner who can help you figure out what to build, in what order, and how to make it stick with real users.
Scale-ups untangling product debt
Your product grew fast and it shows. Navigation is a maze, new features don't connect, and onboarding is a support ticket. We redesign without breaking what works.
Teams without a design system
Every screen looks slightly different and new features take twice as long. We build the design foundation your engineers and product managers actually want to work with.
Ready to build a product
that users actually love?
30-minute discovery call. No pitch, no pressure — just an honest conversation about your product and what it could become.
Realport — Creating Tradability for Sustainable Infrastructure
A platform connecting capital with sustainable real assets.
RealPort is a smart-contract-based institutional fundraising platform that empowers small institutional, semi-institutional, and family office investors to flexibly gain exposure to sustainable real assets they otherwise wouldn't have access to.
Exclusive investments, limited visibility.
Investors need easy and early access to the types of investment options available — with an overview of sustainable assets including pictures, descriptions, historic performance, and asset manager info. But sustainable real asset investments are inherently exclusive, and asset managers are selective about who can access their information.
The core design challenge: find the right balance between the amount of information we can show investors before a potential offer, while ensuring asset managers still feel comfortable sharing.
- Design an asset card with high-level information, a marketing image, status indicator, and a CTA for Dealroom access requests.
- Create a detail page to display extended asset and asset manager information beyond the card.
- Design an investment widget to be embedded inside the asset Dealroom.
Design Thinking — adapted for four stakeholders.
We used an adaptation of the Design Thinking framework. The complexity here wasn't technical — it was stakeholder alignment. Every party had competing needs that all had to be served.
Design Thinking process adapted for the Realport project
After identifying the needs of all parties, we mapped the following high-level user flow:
Quick comparison without information overload.
For the asset card, the key challenge was deciding which data to surface and how to present it for fast comparison. We iterated through multiple information structures, testing combinations of asset name, location, past performance, investment conditions, and status.
Early wireframe iterations for the asset card information structure
After testing with asset managers and potential investors, we landed on a flexible card structure — adaptable based on the data available for each asset, rather than a rigid fixed template.
Finalised asset card information architecture
We supported each data point with icon graphics to aid quick identification and comparison across cards.
Icon system supporting high-level asset information
We also implemented a colour-coded status system to reflect each asset's historical investment stage at a glance.
Colour-coded status system for investment stage
Three-layer information architecture for trust-building.
The deal room's job is to give investors everything they need to commit — and to initiate the KYC process. We divided it into three clear sections: High-level information, Investment widget, and Deep information.
Three-section information structure for the Dealroom page
In the top section, we combined high-level asset information with the investment widget. We ran several visual iterations — all sharing the same structure — to align with Realport's design language.
Visual iterations of the Dealroom top section
The deep information section was split into three tabs: Highlight (digested asset overview, performance, documentation links), Exposé (full PDF access), and Description (image slider with marketing-focused copy).
Final designs — asset card and dealroom.
Final production designs — asset card (left) and dealroom page (right)
We were asking too much, too early.
This project was challenging to test given the early stage of development. Validation happened through potential investors' demo sessions, with feedback documented iteratively.
After several rounds of iteration, the team recognised a fundamental UX problem: users were being asked to do too much with too little reward upfront. Basic registration just to see an asset card, then a Dealroom access request requiring asset owner approval, then an extensive KYC process — all before gaining access to actual deal information.
The key learning: show as much information as possible before asking anything of the user. Progressive disclosure only works when the early layers are genuinely valuable on their own.