Skip to main content
004

Zort

An AI-powered crypto trading platform that connects to Coinbase Pro and executes Bitcoin and Ethereum trades autonomously. I owned the full design process: user research, personas, information architecture, user flows, wireframes, and three distinct visual directions for both the marketing website and trading dashboard.

Role
UX/UI Designer
Year
2020-2021
Tags
[UX DESIGN][WEB3][PRODUCT DESIGN][USER RESEARCH][WIREFRAMING]
Status
Completed
zort.co
Zort marketing website, dark premium design direction with electric teal accent, showing hero section, dashboard preview, and performance metrics

Zort needed to serve two fundamentally different audiences with one product. Everyday investors (like Maya, 29, who bought $200 of Bitcoin once and never touched it again) need simplicity, plain English, and zero jargon. High-net-worth investors (like David, 47, VP of Operations with $40K in crypto) need performance data, risk metrics, and trade-level transparency. Every existing AI trading tool requires configuration: pick a strategy, set parameters, choose risk levels. Zort's differentiator was zero-config, but that raised a harder design problem: how do you build trust when the user has no control?

01

Research: two personas, one product

Built detailed personas for both audiences. Maya (everyday investor) needs onboarding in 3 steps, one big number on the dashboard, and reassuring microcopy. David (HNW investor) needs historical returns, Sharpe ratios, trade-level AI reasoning, and a security page he can read like a contract. The strategic decision: lead the marketing site with Maya, unlock depth for David.

02

5 user flows mapped end-to-end

Mapped every critical journey: new user onboarding (Maya's 3-step path), returning user performance check (simple vs. detailed toggle), skeptical visitor conversion (the trust funnel ending at the security page), HNW investor deep evaluation (Performance to Security to Pricing to About), and Zort Coin retention (personalized top-up with auto-refill).

03

Wireframes: 3 directions explored, 1 selected

Explored three homepage layouts: Product-First (rejected, shows UI before explaining value), Value-First Centered (selected, mirrors Maya's thought process), and Social Proof-First (rejected, small numbers backfire for new products). Then iterated section order on the winner, testing performance-before-process vs. process-before-performance.

04

3 website directions, each serving a different hypothesis

Dark Premium (crypto-native but refined), Light Clean (Wealthfront-level trust), and Bento Hybrid (bold, modern SaaS). Each tested a different assumption about what builds trust in a product that touches your money AND uses AI AND involves crypto.

05

3 dashboard directions, progressive disclosure in action

Dark Teal (balanced default with simple/detailed toggle), Light Glass (Maya's world, one number and one status), and Dark Orange (David's Bloomberg-meets-modern, every metric visible). The core pattern across all three: same data, different depths.

03UX Research
User Personas
Two user personas: Curious Maya (everyday investor, 29, Toronto) and Strategic David (HNW passive investor, 47, Vancouver) with goals, frustrations, trust triggers, and design implications
User Flows
Detailed user flow diagram for first-time onboarding: Discovery to Homepage to Sign Up to Connect Coinbase Pro to Purchase Zort Coin to Set Risk Preference to Dashboard, with design decision annotations
1 / 5

5 user flows: onboarding, returning user, skeptic conversion, HNW evaluation, retention

04Wireframes
Homepage Wireframes: 3 Directions Explored
Low-fi wireframe exploration: three homepage layout directions (Product-First rejected, Value-First Centered selected, Social Proof-First rejected) with annotations explaining each decision, followed by iteration on the selected direction
05Website Design: 3 Directions
Website Direction 1: Dark Premium
Full-page dark premium website mockup with teal accent, centered hero, dashboard preview, 3-step explainer, performance chart, security section, and Zort Coin pricing
Website Direction 2: Light Clean
Full-page light website mockup inspired by Wealthfront/Stripe, trust blue accent, clean white background, professional and approachable
Website Direction 3: Bento Hybrid
Full-page dark website mockup with lime green accent, asymmetric bento grid layout, bold typography, colored stat cards, scrolling ticker
06Dashboard Design: 3 Directions
Dashboard Direction 1: Dark Teal
Trading dashboard with dark background and teal accent, bento grid layout showing portfolio value, AI status with pulsing indicator, performance chart, allocation donut, recent trades with AI reasoning, weekly summary
Dashboard Direction 2: Light Glass
Light glassmorphism dashboard designed for Maya (everyday investor), friendly and non-intimidating with soft gradient cards, frosted glass effects, wide sidebar navigation
Dashboard Direction 3: Dark Orange (Detailed)
Data-rich dark dashboard with orange accent designed for David (HNW investor), showing full trade history table, risk metrics, AI decision log, allocation breakdown, export options
07Behind the Scenes

Explore the full Figma file with all website and dashboard mockups as editable design layers.

09Results

2

Personas Created

5

User Flows Mapped

3

Website Directions

3

Dashboard Directions

Desktop + Mobile

Responsive Designs

Full Process

Research to Hi-Fi

FigmaUser ResearchCompetitive AnalysisInformation ArchitectureUser Flow MappingWireframingVisual DesignResponsive DesignDesign Systems

This project crystallized how I think about audience-first design. The instinct is to design for everyone, but 'everyone' means no one. The single most impactful decision was choosing Maya as the primary audience for the marketing site. That one call cascaded through every layout, every copy choice, every section order. David's needs didn't get ignored, they just got placed one click deeper. The other insight: trust is architecture, not decoration. The security page isn't a reassurance section, it's a conversion page. The custody diagram showing Zort only sends trade signals (never touches funds) did more for conversion than any hero headline could.

Interested in working together?

I design products that ship, and prove their value with real metrics.

Get in Touch
Next ProjectE-Commerce Stores005 / Shopify, Meta Ads, $800K+ Revenue