Project Background & Problem Analysis

RemixDAO is a strategy platform designed for crypto investors, serving a diverse user base—from beginners entering Web3, to traditional finance investors, to advanced on-chain users. The product’s core features include strategy participation, performance tracking, community-based leaderboards, and multi-chain asset management. The goal is to build a modular experience that fosters transparency and user motivation.However, the original product posed several usability challenges that hindered user understanding and retention:

First-time visitors struggled to grasp the platform’s value and how to get started, making it difficult to build trust
The Club module, intended to motivate users by showcasing team and individual performance, lacked a clear comparison structure, making it hard to understand one’s standing and drive engagement
In the Vaults, users couldn’t easily understand the actual on-chain earnings and asset composition of their strategies. The data lacked visual hierarchy, grouping, and charts. The workflows also lacked guidance, which diminished user trust and made it difficult to feel in control of their investments.

How I Identified These Issues

1. Internal Interviews
‍I conducted interviews with the CEO, marketing lead, and community manager to understand our core user segments:

Beginner users who need onboarding clarity and confidence
Mid-level investors who focus on portfolio performance and risk
Advanced users who care about efficiency, chain/version control, and strategic flexibility

These conversations also revealed the importance of the Club module in motivating users through team performance and referral-based earnings—yet its current design failed to support this purpose effectively.

2. Heuristic Evaluation
Since we couldn’t directly test with users, I applied Nielsen Norman Group’s 10 usability heuristics to identify major UX issues:

The vaults lacked visual hierarchy and clear grouping, violating principles of information scannability
The Club interface offered no intuitive comparison or sorting logic, reducing user control and engagement
The landing page failed to communicate core value props quickly, which risked confusion and bounce

Module 1: Login & Landing Page — Crafting a Trustworthy First Impression

Before

After

1. Landing Page

Design Rationale:
‍Web3 beginners—such as Japanese housewives or older investors—are particularly sensitive to scams and trust signals. By surfacing key credibility elements like roadmap, audit status, and testimonials directly on the landing page, we reduce early bounce and establish legitimacy before the user connects a wallet.
‍Benchmarks:
Zengo, Swissborg, and Lido all display similar security and social proof modules upfront.
Hypothesis:
‍If we display trust-building content before login, users will feel safer exploring the platform and be more likely to continue to the next step in the onboarding flow.
Trade-off:
‍Displaying additional content increases page length and visual density. To mitigate this, we used collapsible sections, visual icons, and concise microcopy to maintain quick scannability.
Validation:
‍We can validate the effectiveness of trust-building content on the landing page by:

Tracking drop-off rate before and after trust elements were introduced (e.g., % of users who bounce before login).
Running first-time user testing to measure perceived trust level and clarity (using trust-rating surveys and open-ended feedback).
Heatmap or scroll-depth analysis to confirm if users are engaging with roadmap, audit, and testimonial modules.

2. Sign in

Design Rationale:
‍Static login flows often frustrate returning users and confuse beginners. By adapting the login stepper based on user type—showing full steps for new users and skipping redundant ones for returnees—reduce friction, improve clarity, and speed up access to the Dashboard.
‍Design Assumption: This approach reduces redundant steps and makes the flow clearer and faster for both user types.
Hypothesis:
‍If I adapt the login steps based on user status (new vs. returning), we’ll reduce drop-off, shorten task completion time, and improve user satisfaction—especially among repeat users.
Trade-off:
‍Conditional flows increase development complexity (e.g., real-time checks, wallet/NFT status caching, state handling). To mitigate this, I modularized step components and cached key data to support consistency and performance.
Validation:
‍We can validate this design by:

Measuring task completion time for new vs. returning users before and after implementation.
Tracking drop-off rates at each login step to ensure returning users skip friction points.
Conducting usability tests simulating both user types and collecting confidence + clarity feedback via short surveys.

Prototype

Module 2: Club — Performance Visibility and Social Motivation

Before

After

1. Modular Card Layout for Performance Comparison

Design Rationale:
‍Dense data tables created cognitive overload for users, especially when comparing multiple metrics across many users. A modular card layout—featuring icons, color accents, and grouped data—helps break down information for faster scanning and comprehension.
‍Benchmarks :
I studied Web3 platforms like Zapper and Zerion for their card-based layout clarity. I also referenced Notion and Figma, which use modular groupings and visual hierarchy to structure complex data.
Hypothesis:
‍Switching to a modular card design will reduce information fatigue and enable faster performance comparison, especially for tasks like identifying top earners or assessing downline contributions.
Trade-off:
While card layouts improve scannability, they reduce on-screen density. This may frustrate expert users who prefer data-dense tables. Layout structure and spacing had to be rebalanced to preserve content clarity.
Validation:
‍Run A/B tests comparing table vs. card layouts for task success rate and completion time. Product analytics will track dwell time and card engagement within the Club module.

2. Grouped Display by Status: Active vs. Inactive Strategies

Design Rationale:
‍Users tend to mentally organize performance data by relevance. Splitting strategies into "Active" and "Inactive" groups reduces visual clutter, making it easier to focus on current performance.
‍Benchmarks: I took cues from Google Analytics and Asana, which segment tasks by status to align with user intent. Zapier also applies similar logic when organizing workflows by active/historical state.
Hypothesis:
‍A segmented view will shorten the time users need to locate current strategies, leading to faster interactions and more confident decision-making.
Trade-off:
‍Grouping data requires clear status logic and adds vertical space. Users with large datasets may need to scroll more, so layout and pagination must be well-balanced.
Validation:
We can use Tree Testing or Card Sorting to verify grouping logic, track click-through rates in the "Active" section, and gather feedback via clarity-focused satisfaction surveys.

3. Advanced Filter Panel with Hierarchy, Range & Multi-Condition Support

Rationale
The original filter system only supported basic, flat filtering. It lacked the ability to segment users based on relational hierarchy (Parent / Layer), asset range, or user name. To improve performance discovery and competitive comparison, I introduced a redesigned Advanced Filter Panel featuring:

structured filter sections (Layer, Parent, Name)
a visual asset range slider with histogram
quick toggles for Top 3 / 5 / 10 performers

Benchmarks:
I drew inspiration from Dune Analytics and Amazon Seller Central for multi-condition filter layout, and from LinkedIn Recruiter and Figma Team Browser for hierarchical search patterns and visual range sliders paired with data context.

Hypothesis:
‍A structured, multi-condition filter experience will enable users to identify and compare relevant performers faster (e.g., "Top 5 users within $1,000–$5,000 range"), leading to better engagement and retention.
Trade-off:
‍Adding more filter layers increases UI complexity and may introduce a learning curve for first-time users. To address this, I prioritized clear sectioning, defaults, and progressive disclosure to reduce overwhelm.
Validation:
‍In future iterations, we can validate this solution through:

First-click testing to assess discoverability and correct usage of the filter panel
Feature usage tracking to measure how often users engage with filters like Layer, range, or Top N shortcuts, and whether these lead to higher interaction rates
Task-based usability tests simulating user goals (e.g., “Find the top 3 subordinates in a specific strategy”) to measure accuracy and efficiency

Prototype

Module 3: Vaults – Making Strategy Execution Clear and Confident

Before

After

1. Improving Vault Usability with a Staked Filter

Design Rationale:
‍Crypto users often revisit platforms to track only the vaults they’ve already invested in. By introducing a "Staked" toggle, we help users filter out irrelevant pools, reduce scanning effort, and focus on personal asset performance.
‍Benchmarks: Inspired by DeBank and Zerion, which prioritize user-owned assets in dashboards. Binance Earn also provides "My Holdings" filters to streamline asset tracking.
Hypothesis:
‍A toggle for staked-only strategies will help users locate relevant vaults faster, reduce time-on-task, and enhance confidence in tracking returns.
Trade-off:
‍Adding a toggle introduces extra UI elements and logic. There’s a risk that new users may mistake the filtered view as the full product, especially if toggle state isn’t clearly indicated.
Validation:
‍We can analyze toggle usage rate, session heatmaps (e.g., via Hotjar), and observe if users spend less time scrolling when it’s active. Feedback surveys will help assess clarity and perceived control.

2. Clarifying Web3 Jargon with Just-in-Time Tooltips

Design Rationale:
‍Web3 platforms often contain unfamiliar terminology. By introducing tooltips for terms like Deposit, Pending Token, and Strategy, I provide just-in-time, non-intrusive guidance that helps less experienced users build confidence and reduces fear of misoperation.
‍Benchmarks: Tooltip behavior aligns with Google’s Material Design system and follows the principle of progressive disclosure from Nielsen Norman Group.
Hypothesis:
‍Clear tooltips will increase comprehension for new users, reducing hesitation during transactions and improving engagement with complex concepts.
Trade-off:
‍Tooltip interactions require thoughtful design for accessibility (e.g. focus state, keyboard support). Additionally, maintaining concise content within limited space demands careful writing and localization planning.
Validation:
‍We can test comprehension via user interviews and click-tracking on tooltip triggers. Qualitative feedback will focus on clarity, helpfulness, and trust.

Prototype

Success Metrics

To evaluate whether the redesign achieved its goal, I defined the following success indicators:

Bounce Rate ↓
‍Visitors should feel more secure and continue exploring instead of leaving immediately. A lower bounce rate reflects improved first impressions and trust.
Connect Wallet Conversion Rate ↑
‍More users should feel confident to connect their wallet after seeing upfront trust signals. This is a key indicator for onboarding success.
Filter & Sorting Action Rate ↑
‍The Club module redesign encourages strategic comparison. Increased interaction with filters, sorting, and Top N views validates that users are actively exploring and engaging with the interface.
Vault Selection Rate ↑
‍Users can make faster decisions with aligned layout and strategy badges.

Design System

UI Mockup

Takeaways

Designing this crypto investment platform from end to end taught me how to structure complex data and interactions into modular, user-friendly experiences — especially for Web3 beginners and comparison-driven investors.

I learned that card-based layouts not only improve scannability but also reduce cognitive load by breaking information into digestible segments. Mapping interaction types to task frequency also proved critical: search needed full-screen focus, sort worked best in a drawer UI, and filters—though used less often—benefited from a structured, expandable sidebar with clear active states. Aligning layouts for comparison tasks helped users evaluate strategies more effectively, while a clear, stable visual tone enhanced trust in a high-risk, fintech context.

Without access to real users or usage data, I relied on heuristic evaluations, crypto benchmarks, and UX research (e.g., NN/g, Google UX Playbook) to support key decisions. This experience strengthened my ability to design independently, make strategic trade-offs, and build scalable systems under constraints — all while balancing usability, learning curves, and business goals in a Web3 environment.

If I were to continue evolving this design, I’d prioritize usability testing with Web3 newcomers to validate assumptions around filter complexity, comparison logic, and visual tone perception.

Project Background & Problem Analysis

How I Identified These Issues

Module 1: Login & Landing Page — Crafting a Trustworthy First Impression

Module 2: Club — Performance Visibility and Social Motivation

Module 3: Vaults – Making Strategy Execution Clear and Confident

Success Metrics

Design System

UI Mockup

Takeaway

Project Overview

RemixDAO Website- 2024.05 — 2024.07

Product background

01 | Team Goals

02 | My Role & Deliverables

03 | Project Challenges

Project Background & Problem Analysis

How I Identified These Issues

Module 3: Vaults – Making Strategy Execution Clear and Confident

Success Metrics

Design System

UI Mockup

Takeaways

Related Products

Welcome to contact me !