One Screen, All Signals

An B2B AI-powered Fintech dashboard for quantitative analysts, designed to deliver real-time stock insights

My Role

My Role

Product Designer

Product Designer

Scope

Scope

UI Wireframe, Low-to-High Fidelity Prototypes, Design System, End-to-End Design Process, User Research

UI Wireframe, Low-to-High Fidelity Prototypes, Design System, End-to-End Design Process, User Research

Tools

Tools

Figma, V0, Stitch

Figma, V0, Stitch

Year

Year

2025

2025

Overview

Overview

Bopu Asset is a quantitative asset company targeting to quant analysts on real-time stock signal and make decision on stock trading. Stocki is a SaaS AI Stock platform aiming to faster, precise, and extensive All-In-One platform.

Bopu Asset is a quantitative asset company targeting to quant analysts on real-time stock signal and make decision on stock trading. Stocki is a SaaS AI Stock platform aiming to faster, precise, and extensive All-In-One platform.

The Problems

The Problems

  • 90% task success rate: Validated core features and workflows through usability testing with target users.

  • 4x Efficiency Gain: Reduced the "Signal-to-Insight" task flow from 25 minutes to 6 minutes.

  • 90% task success rate: Validated core features and workflows through usability testing with target users.

  • 4x Efficiency Gain: Reduced the "Signal-to-Insight" task flow from 25 minutes to 6 minutes.

Solutions

Solutions

I led three key features of this products: 1) Watchlist homepage; 2) News Detail Page; 3) Podcast Detail Page for an AI-driven Fintech dashboard, defining the strategic MVP from concept to handoff-ready designs within a 2-month sprint. 

My Contribution

Watchlist homepage

Watchlist Homepage

Watchlist homepage

A consolidated dashboard integrating real-time data to reduce context switching

A consolidated dashboard integrating real-time data to reduce context switching

News Detail Page

News Detail Page

An AI-powered page to accelerate signal discovery and enable rapid data synthesis

An AI-powered page to accelerate signal discovery and enable rapid data synthesis

Podcast Detail Page

An "Key Insight" to optimizes time-to-insight by making long-form audio scannable

An "Key Insight" to optimizes time-to-insight by making long-form audio scannable

Pain Points

The Challenge: Initial user research with quantitative analysts revealed significant workflow friction. The existing chatbot-only tool was time-consuming, leading to critical, time-sensitive signals being missed.

The Challenge: Initial user research with quantitative analysts revealed significant workflow friction. The existing chatbot-only tool was time-consuming, leading to critical, time-sensitive signals being missed.

Information Overload

1

1

Endless "Read Later" Lists

Endless "Read Later" Lists

Endless "Read Later" Lists

Users were overwhelmed by manually tracking multiple, unstructured data feeds.

Inefficient Signal Discovery

2

2

Time to Catch Key Details

Time to Catch Key Details

Time to Catch Key Details

Locating actionable insights within news and podcasts was a time-intensive process.

Fragmented Data Sources

3

3

Uncover All of the Signal

Uncover All of the Signal

Uncover All of the Signal

Constant context switching between platforms led to missed signals and cognitive load.

How Might We

How might we help quant analysts to quickly capture real-time stock signals without losing focus?

How might we help quant analysts to quickly capture real-time stock signals without losing focus?

The Goal

Design Strategies

Reduce Context Switching

Increase Information Clarity

Business Goal

Faster Time-to-Insight

Cost Saving

The Design Solutions

Key Feature 1: All-In-One Watchlist homepage

Key Feature 1: All-In-One Watchlist homepage

Design Goal

Design Goal: To design a consolidated dashboard integrating four real-time data sources. This solution establishes a single source of truth, reducing context switching and information overload for the analyst.

Design Goal: To design a consolidated dashboard integrating four real-time data sources. This solution establishes a single source of truth, reducing context switching and information overload for the analyst.

Information Architecture

This IA diagram defines the product structure and primary user flow, mapping the path from the high-level consolidated dashboard to deep-dive analysis pages.

This IA diagram defines the product structure and primary user flow, mapping the path from the high-level consolidated dashboard to deep-dive analysis pages.

Hypothesis 1: Prioritizing P1 Information (Price & News)

Stock Chart: a dominant, full-width chart module was the optimal way to ensure maximum visibility for the user's primary data;
News: A dedicated right-hand column would be the most scannable layout, making it easily scannable.

Stock Chart: a dominant, full-width chart module was the optimal way to ensure maximum visibility for the user's primary data;
News:
A dedicated right-hand column would be the most scannable layout, making it easily scannable.

Hypothesis 2: Organizing Secondary Context (Social & Media) 

Twitter + Podcasts: organize these "contextual signals" in a way that supports deep-diving without competing with the primary market data.

Twitter + Podcasts: organize these "contextual signals" in a way that supports deep-diving without competing with the primary market data.

Key Features

Design Prototype

Watchlist Homepage

Watchlist Homepage

Key Feature 2: Podcast Detail Page

Key Feature 2: Podcast Detail Page

Design Goal

To reduce friction in long-form audio analysis. This page transforms a 60-minute podcast into a scannable, interactive summary to accelerate time-to-insight.

To reduce friction in long-form audio analysis. This page transforms a 60-minute podcast into a scannable, interactive summary to accelerate time-to-insight.

Information Architecture

This user flow defines the deep-dive path for audio analysis. It maps how the AI-powered features (Key Takeaways, AI Summary, Transcript) are structured to enable rapid data synthesis.

This user flow defines the deep-dive path for audio analysis. It maps how the AI-powered features (Key Takeaways, AI Summary, Transcript) are structured to enable rapid data synthesis.

AI Key Insights Summary

It reduces information overload by generating scannable "Key Insight" cards, and transforms a 60-minute podcast into an actionable summary, optimizing the research workflow.

It reduces information overload by generating scannable "Key Insight" cards, and transforms a 60-minute podcast into an actionable summary, optimizing the research workflow.

Time-stamped Transcript

An interactive, searchable transcript is auto-generated. This allows users to click any sentence to navigate the audio, streamlining data validation and pinpointing key moments.

An interactive, searchable transcript is auto-generated. This allows users to click any sentence to navigate the audio, streamlining data validation and pinpointing key moments.

Design Prototype

Podcast Detail Page

Podcast Detail Page

Key Feature 3: News Detail Page

Key Feature 3: News Detail Page

Design Goal

To streamline the research workflow for text-based news. The design focuses on enhancing scannability and surfacing key data points without requiring a full read-through.

To streamline the research workflow for text-based news. The design focuses on enhancing scannability and surfacing key data points without requiring a full read-through.

Information Architecture

This diagram illustrates the information hierarchy for the news module. It defines a direct user flow from the article to the AI-generated summary, prioritizing rapid comprehension.

This diagram illustrates the information hierarchy for the news module. It defines a direct user flow from the article to the AI-generated summary, prioritizing rapid comprehension.

AI Summary for Quick Reading

The AI-powered summary distills long-form articles into bulleted "Key Takeaways." This enhances scanability and allows for rapid data synthesis, enabling faster decision-making.

The AI-powered summary distills long-form articles into bulleted "Key Takeaways." This enhances scanability and allows for rapid data synthesis, enabling faster decision-making.

Sentiment Keyword - Contextual Signal

Design Prototype

New Detail Page

New Detail Page

Design System

Retrospect

What I learnt

Create a free website with Framer, the website builder loved by startups, designers and agencies.