🎯 Institutional UX Research Project: Primary research into institutional trading terminal design. I analyzed Bloomberg Terminal's architecture, interviewed portfolio managers, and prototyped solutions for institutional data density problems. Not production software, but shows I understand what Private Bank platforms need.
TradeX
Institutional Trading Terminal
Trading terminal for institutional portfolio managers. Level 2 Order Book visualization, Portfolio Risk Matrix tracking 80+ funds, real-time P&L attribution, keyboard-first execution. Built for extreme data density (120+ concurrent metrics) and sub-second decisions.
TradeX Institutional Terminal . Level 2 Order Book with Quick Execution Interface & Multi-Instrument Monitoring
Why TradeX Exists
My production work includes institutional B2B infrastructure (ACY Connect FIX API platform) and retail trading interfaces (LogixTrader, Finlogix, TradingCup). TradeX answers the question: Can I design terminal UX for portfolio managers handling $100M-$50B?
ACY Connect proved I can ship institutional infrastructure (FIX Protocol for hedge funds). More importantly, the technical logic mapping from that production work — where I deconstructed FIX message states like 35=8 (Execution Report) and 35=W (Snapshot) with our Tech Lead and QA — provided the institutional foundation needed to design the TradeX terminal.
Three institutional design challenges I explored:
- Level 2 Order Book: Bid/ask depth, spread dynamics, liquidity heat maps. Inspired by order flow patterns from ACY Connect's FIX documentation work.
- Portfolio Risk Attribution: 80+ funds with real-time VaR, Sharpe Ratio, Alpha, Beta across sector/regional exposure.
- Multi-Asset Orchestration: Monitor equities, forex, commodities, derivatives simultaneously with cross-market correlation.
1. Institutional Architecture: Risk & Compliance Matrices
Portfolio Risk Matrix . Multi-Dimensional Risk Decomposition
Compliance Matrix . SEC Filing Review & Audit Logs
TradeX's core infrastructure utilizes high-density matrices to manage extreme data complexity. Risk managers use the Risk Matrix (Left) to monitor fund volatilities, while Compliance Officers use the Screener Matrix (Right) to track regulatory filing health. Both interfaces share a unified "Bloomberg-inspired" design language optimized for sub-second scanning.
2. Design Philosophy
Inspired by Bloomberg Terminal: every pixel delivers alpha. I studied Bloomberg's patterns through financial publications, trader interviews, and documentation. Three principles define institutional-grade design:
Principle 1: Data Density Over Whitespace
Portfolio managers operate 4-8 monitor setups. Whitespace is wasted opportunity cost. TradeX's Portfolio Risk Matrix displays 80+ funds with 12 metrics each (960 data points) on a single screen . impossible in retail fintech, essential in institutional finance.
Principle 2: Keyboard-First = Zero Mouse Latency
In retail platforms (my LogixTrader work), keyboard shortcuts are enhancements. In institutional terminals, they're the primary interaction model. TradeX's Order Book supports F9 (execute), Ctrl+R (sort by VaR), Alt+O (open order ladder) . 100% mouse-free workflows.
Principle 3: Compliance as Real-Time Feedback
Retail platforms show compliance errors after submission. Institutional terminals surface regulatory constraints during order entry. TradeX's Order Book shows SEC Rule 15c3-1 net capital impact and FINRA margin requirements before execution.
2. SEC/FINRA Compliance: Catching Violations BEFORE Legal Review
Why this matters for private bank platforms: UHNW $10M+ AUM clients operate under extreme SEC/FINRA scrutiny. One compliance violation = $1M-$50M+ fine + reputational damage. The workflow below shows how I proactively identify potential violations during design—not after implementation.
While TradeX is a concept project, this compliance review process is exactly how I work with Legal teams at ACY Securities. Internal ACY platform screenshots are available during interviews; the workflow shown here is identical to production.
Real-world compliance review workflow: Identifying potential violations before implementation
🔍 What This Workflow Shows:
Daily Return figure of $1.9M is extreme for a retail dashboard without "Simulated" labels. Solution: Add mandatory SEC risk disclosures.
"Moderate" is vague for maintenance banners. Solution: Use standardized status terminology required for audit trails.
Proactive Compliance Design:
- Identify violations before Legal review (saving weeks of rework)
- Translate regulatory requirements into specific design constraints
- Document compliance rationale for audit trails
Real-World Institutional Compliance: Fixed Income Screener & SEC Filing Review
The interface demonstrates a production-grade institutional compliance workflow. This shows how regulatory review is integrated directly into the trading terminal.
3. Portfolio Risk Matrix Design
960 Data Points Without Cognitive Overload
80 funds × 12 metrics = 960 concurrent data points. How do you keep it scannable?
VaR and Sharpe Ratio outliers highlighted via font-weight and color-coded severity.
Supporting fund IDs and regional tags dimmed at 60% opacity to reduce visual noise.
What This Demonstrates:
- Extreme Data Density: Managing 900+ points without cognitive collapse.
- Risk Severity Categorization: Using heat-mapping for VaR limits.
- Institutional Scannability: Typographic hierarchy optimized for pro trading.
Multi-Dimensional Analytics Integration
The right-side panel integrates 5 analytical dimensions simultaneously:
- Sector Allocation Bar Chart: Portfolio exposure by industry (2015–2021 time series)
- Stress Test Scenarios: Portfolio performance under Stress/Crisis/Montreal conditions
- Regional Exposure Heat Map: Geographic concentration risk (China, Spain, European Union, Frontier markets)
- S&P 500 Correlation: Live chart with 3 moving averages (Morning/Median/Closing) tracking index correlation
- EUR/USD Time Frame: Forex exposure impact with volume distribution
Design Rationale: Institutional portfolio managers don't look at funds in isolation . they evaluate systematic risk, correlation exposure, and macro sensitivities. This multi-panel layout supports holistic portfolio construction, not individual security selection.
4. Level 2 Order Book: Market Microstructure
The Order Book is the most critical institutional trading interface . where professional traders analyze market depth, liquidity concentration, and optimal execution pricing. The design logic for this component was directly informed by my production work on ACY Connect.
By mapping raw FIX 4.4 protocol logic from our Tech Lead and QA (handling partial fills, execution reports, and snapshot updates), I gained the technical intuition needed to design a terminal UI that correctly represents market microstructure and liquidity heat maps at institutional scale.
Level 2 Order Book . Real-Time Market Depth with Bid/Ask Heat Map & Quick Execution Controls
What is an Order Book (and Why It Matters Institutionally)
In retail trading platforms (my LogixTrader work), users see a single "current price" (last traded price). Institutional traders need to see the entire order book . all pending buy orders (bids) and sell orders (asks) at different price levels. This is called Level 2 market data.
Why this matters: A portfolio manager executing a $10M equity order can't just "market buy" . they need to see if there's enough liquidity at the current price, or if their order will move the market (slippage). The Order Book visualizes this liquidity distribution.
Solution: Bid/Ask Depth Heat Map
TradeX's Order Book uses color-coded heat mapping to visualize liquidity concentration instantly:
Left Column: Bid Side (Buy Orders)
| Qty | Bid Price | Visual |
|---|---|---|
| 6 | 20872.00 | Light Green |
| 50 | 20843.00 | Dark Green |
Darker green = higher quantity (more liquidity at that price level). Traders can instantly see where large buy orders are concentrated.
Right Column: Ask Side (Sell Orders)
| Ask Price | Qty | Visual |
|---|---|---|
| 20902.00 | 6 | Light Red |
| 20931.00 | 50 | Dark Red |
Darker red = higher quantity (more sell pressure at that level). Identifies resistance zones where large sellers are waiting.
Quick Execution Interface
The Order Book integrates one-click execution controls directly alongside market depth visualization . eliminating context switching between analysis and execution:
Execution Controls (Per Symbol Card)
- Entry Price: Adjustable via +/− buttons (default: current market price)
- Units: Position sizing with +/− controls (supports fractional shares)
- Est. T.M. (Total Margin): Real-time margin calculation based on account equity
- Auto Send Checkbox: Toggle between manual confirmation vs. instant execution
- Buy Manually / Sell Manually: Large, color-coded action buttons (green buy, red sell)
Design Rationale: Professional traders executing 50-200 trades/day need zero-click workflows. The "Auto Send" mode enables keyboard-only execution: Tab to Units → Enter value → Spacebar to execute. No mouse required.
Trade History Integration
Below the Order Book, TradeX displays a real-time Trade History panel with granular status tracking:
5. Multi-Chart Orchestration
Multi-Chart Dashboard . 4-Panel Synchronized View with Real-Time P&L Tracking
Challenge: 4 Simultaneous Charts Without Cognitive Overload
Portfolio managers monitoring multiple positions (Microsoft, Apple, Google, Tesla simultaneously) need synchronized time-frame controls . changing one chart's time range should update all 4 charts. This is a coordination challenge absent from single-chart retail platforms.
Solution: Unified Time-Frame Controller
Bottom-right chart controls: 1D, 1M, 3M, 1Y, 5Y, All buttons globally adjust all 4 charts simultaneously.
UX Rationale: Institutional traders analyze correlation patterns (e.g., "How did Microsoft and Apple move together during last month's Fed announcement?"). Synchronized time frames enable comparative analysis without manual re-adjustment per chart.
Watchlist Integration
Left sidebar displays a live watchlist with 15+ symbols showing Bid, Ask, Spread, and 24hr Change%. This mirrors Bloomberg Terminal's "Monitor" panel . professional traders don't navigate to symbols via search; they maintain persistent watchlists of their coverage universe.
6. Adaptive UI
Light Mode . Fibonacci Technical Analysis with Integrated Live Webinar Panel
Why Light Mode Matters Institutionally
Most institutional terminals (Bloomberg, FactSet) default to dark mode for 10+ hour trading sessions (reduced eye strain). But compliance officers, risk managers, and regulatory reviewers often work in well-lit office environments where dark mode causes glare on printed materials.
Design Decision: Dual-Theme Architecture
TradeX supports both dark (traders) and light (compliance/risk) themes with preserved data visualization:
- Dark Mode: Pure black (#000000) with neon accents (Cyan #00D1FF, Lime #4CAF50, Amber #FFAA00)
- Light Mode: Off-white (#F5F5F5) with high-contrast typography (80%+ black text on light backgrounds)
- Consistent Across Themes: Red/green price movements, chart candlestick colors, and risk severity indicators remain identical (ensures muscle memory transfer)
Technical Indicator Integration: Fibonacci Retracement
The Microsoft/TSLA charts display Fibonacci retracement levels (0.236, 0.382, 0.5, 0.618, 0.786) . a technical analysis tool used by institutional traders to identify potential support/resistance zones. Additional indicators visible:
- DeMarker Indicator: Momentum oscillator (bottom panel) . identifies overbought/oversold conditions
- Volume Bars: Integrated below price charts (green = buying volume, red = selling volume)
- Multiple Time Frames: 1H (hourly) granularity for intraday trading decisions
Professional-Grade Technical Analysis: Fibonacci & Gann Tools
Institutional traders (particularly in commodities, forex, and equity derivatives) extensively use Fibonacci retracement/extension tools and Gann analysis for identifying key price levels and time-based cycles. Bloomberg Terminal, Thomson Reuters Eikon, and TradingView Pro all provide these tools as standard features for professional market analysis.
Fibonacci Tools Suite . Institutional-grade retracement, channel, and time-based analysis
Why Fibonacci Matters Institutionally
Fibonacci tools are not "mystical" . they're self-fulfilling prophecy patterns. When thousands of institutional traders watch the same 61.8% retracement level, it becomes a real support/resistance zone due to clustered order flow.
- Fib Retracement: 0%, 23.6%, 38.2%, 50%, 61.8%, 100% levels for pullback analysis
- Fib Channel: Parallel trend channels with Fibonacci spacing for breakout zones
- Fib Speed Resistance Fan: Angular support/resistance lines from trend origin
- Fib Arcs: Curved support/resistance zones based on price distance
- Fib Time Zone: Vertical lines at Fibonacci intervals (predicting reversal timing)
Gann Analysis Tools . Price-time relationship mapping for cycle-based trading
Why Gann Matters Institutionally
W.D. Gann's price-time analysis methods are used by commodities traders and forex strategists to identify cyclical patterns. Gann Fans (45° angle lines) and Gann Boxes help institutional desks predict major market turning points.
- Gann Fan: 9 angular trend lines (1x1, 2x1, 3x1, etc.) for support/resistance mapping
- Gann Box: Price-time square grid dividing trends into geometric segments
- 1x1 Line (45° angle): Represents "perfect balance" between price and time
Real-World Use: CME Group traders use Gann analysis for S&P 500 futures; forex desks at Deutsche Bank and Citi apply Gann Fans to EUR/USD major trend analysis.
What This Demonstrates for Institutional Finance Roles
Including comprehensive technical analysis toolsets proves I understand:
- Professional Trader Workflows: Institutional platforms must support quantitative analysis (algorithmic trading) AND discretionary technical analysis (human pattern recognition)
- Multi-Strategy Support: Different trading desks use different methodologies . equities desks favor moving averages, commodity traders rely on Fibonacci, forex teams use Gann cycles
- Tool Parity with Bloomberg: Any institutional terminal competing with Bloomberg Terminal MUST provide equivalent charting tools (Fibonacci, Gann, Elliott Wave, Ichimoku Cloud)
- Configurability > Simplicity: Unlike retail platforms that hide complexity, institutional UIs expose ALL tools and let power users customize their workspace
Design Philosophy: Retail platforms optimize for "ease of use" (reducing cognitive load). Institutional platforms optimize for "depth of analysis" (maximizing analytical power). TradeX embodies this institutional mindset by providing professional-grade technical tools without UI hand-holding.
Collaboration Integration: Live Webinar Panel
Bottom-left corner shows an ACY Webinar video feed. This represents a unique institutional requirement: real-time analyst commentary. Bloomberg Terminal offers similar functionality through Bloomberg TV integration . traders watch market analysis while monitoring positions.
Design Insight: Institutional trading isn't solo work. Traders coordinate with research analysts, risk managers, and compliance officers via integrated communication tools (video, chat, voice). TradeX's webinar panel demonstrates understanding of this collaborative workflow.
7. What This Shows
TradeX research proves I understand the architectural differences between retail and institutional finance UX — critical knowledge for designing platforms serving portfolio managers and wealth advisors:
✅ Production Work (Retail/Broker)
- LogixTrader: Web trading (15-30 metrics per screen, single-chart focus)
- Finlogix: Broker terminal (50+ metrics, multi-chart support)
- TradingCup: Copy trading (social proof, risk controls)
- Target Users: Retail traders, semi-professional day traders
🎯 TradeX Concept (Institutional)
- Portfolio Risk Matrix: 80+ fund analytics (960 data points simultaneously)
- Level 2 Order Book: Market microstructure, bid/ask depth visualization
- Multi-Chart Orchestration: Synchronized 4-panel monitoring
- Target Users: Portfolio managers ($100M–$50B AUM), institutional traders
Core Transferable Skills for Institutional Finance Roles
1. Extreme Data Density Design
Institutional platforms like Bloomberg Aladdin display 200+ risk metrics per portfolio. TradeX's 960-datapoint Risk Matrix demonstrates the information architecture approach required for scannable hierarchies at institutional scale.
2. Market Microstructure Understanding
Order Book design demonstrates knowledge of bid/ask spreads, market depth, and liquidity visualization — critical for any institutional trading platform serving professional market participants.
3. Multi-Asset Class Orchestration
Professional traders monitor equities, forex, commodities, and derivatives simultaneously. TradeX's multi-chart synchronization mirrors multi-asset institutional terminal architecture.
8. Reflection
"Retail platforms design for the 80% happy path. Institutional terminals design for the 1% catastrophic scenario."
The Portfolio Risk Matrix exists for the days when markets crash . when a portfolio manager managing $10B in AUM needs to identify which 5 out of 80 funds are violating VaR limits in under 5 seconds. That's not a retail UX problem. That's an institutional design requirement that demands extreme density, color-coded severity, and keyboard-first workflows.
This concept project challenged every UX principle I applied in LogixTrader and Finlogix. Where those platforms prioritized "progressive disclosure" and "minimalist aesthetics", TradeX requires "information maximalism" and "density-first design". Understanding when to apply which paradigm is the difference between a retail fintech designer and an institutional finance designer.