A practical walkthrough of every major capability.
Setup & First Use
Get from "open the app" to a real comparison in seconds.
1.1
First-visit onboarding modal
On your first visit, a modal opens with four curated starter portfolios (Magnificent Seven, Dividend Aristocrats, and others) plus a "build your own" picker pre-populated with SPY, GOOG, NVDA. Pick a set or type your own tickers and you are running a real comparison in seconds. You can re-open the modal any time from the small icon in the header.
Short video≈1280×800 · 4 to 6s loop
Capture: page load on a fresh session showing the onboarding modal with the four starter portfolio cards visible. Hover one card to show the highlight state, then click it so the modal closes and the chart loads.
1.2
Rich ticker dropdown
Each option in the search dropdown shows the symbol, full company name, sector and industry, and a market cap badge across two clean lines. This makes it easy to disambiguate similar tickers (think NVDA vs NVO vs NVT) without leaving the picker. Useful when you only half-remember a symbol but know the company.
Screenshot≈900×600
Capture: the ticker picker with "NV" typed in, dropdown open, showing NVDA, NVO, NVT and a few others, each with company name, sector, and market cap badge visible.
1.3
Up to 100 tickers compared at once
A single comparison set can hold up to 100 tickers, well beyond what most charting tools allow. Useful for sector sweeps, watchlists, and "show me everything in my universe" exercises. The chart, table, and metrics stay responsive at this scale because the backend is built around bulk computation.
Short video≈1400×900 · 5 to 7s loop
Capture: the FEATURED Showcase preset (or any 100-ticker collection) loading the chart with all lines drawing in, so the breadth is obvious. Pause briefly on the populated state.
1.4
Per-set benchmark ticker
Every comparison set has a benchmark ticker (default SPY, removable, configurable per set) styled distinctly in the chart and table. The benchmark is what every percentile rank, range band, and SPY correlation uses. Switch it to QQQ for a tech-tilted comparison, or to a thematic ETF if you want a tighter peer baseline.
Short video≈1200×800 · 4 to 5s loop
Capture: the chart and the legend with SPY visible as the benchmark line (distinct styling). Switch the benchmark to QQQ in the Configuration tab and let the chart and table re-render.
Read price shapes across multiple tickers on one interactive chart.
2.1
Interactive chart with zoom, pan, and crosshair
The main chart supports zoom, pan, and crosshair hover that works across both data points and blank space (so you can read values between bars on intraday views). Drag a region with the mouse to zoom, double-click to reset, and use the range slider underneath the chart for quick scrubbing. This is the core surface for reading shapes: steady climb vs spiky rally vs late-blooming winner.
Short video≈1400×900 · 6 to 8s loop
Capture: a 5Y comparison of NVDA, MSFT, GOOG, AAPL. Drag-zoom into the 2023 window, hover the crosshair across a flat region to show the tooltip persisting, then double-click to reset.
2.2
Linear and log scale toggle
Switch between linear and log scaling with the segmented control above the chart. Linear suits short windows where absolute change matters; log suits long windows where percentage change matters and otherwise large winners would visually flatten everything else. The toggle changes how a multi-year chart reads.
Short video≈1400×900 · 3 to 4s loop
Capture: a 10Y chart with a few large winners (e.g., NVDA, AAPL) plus a steadier ticker like JNJ. Toggle from Linear to Log so the difference in readability is obvious.
2.3
Right-side ticker labels at line endpoints
Every line ends with the ticker label on the right edge of the chart, with smart collision avoidance so labels never overlap. You can read which line is which without dragging the cursor across the chart. Especially useful when comparing 10+ tickers where the legend chips below would be slower to scan.
Screenshot≈1400×900
Capture: a chart with 8 to 12 tickers that finish at varied y-positions, so the right-edge label collision avoidance is visible (some labels offset slightly above or below their endpoint).
2.4
Chart fullscreen toggle
The fullscreen button (top-right of the chart card) expands the chart to fill your viewport. Useful when you have many tickers and want every line cleanly resolved, or when sharing a screen where the chart needs to fill the room. Press Esc to dismiss.
Short video≈1500×900 · 5 to 6s loop
Capture: click the fullscreen icon, hold on the expanded chart for 2 seconds, then dismiss with Esc to show the transition both ways.
2.5
Top N performers filter
Choose to show only the top 10, 15, 20, or 25 performers on the chart while keeping the table complete. The chart stays readable when comparing big lists and the table still gives you full context. Useful when 50 tickers turns the chart into spaghetti.
Short video≈1400×900 · 4 to 5s loop
Capture: a 30 to 50 ticker comparison with the chart looking busy. Open the Top N selector and switch from "All" to "Top 10" so the chart visibly thins out while the table below stays the same height.
2.6
Baseline alignment
Pick any ticker as the baseline and the chart rebases all other tickers to that ticker's start date. Useful when one ticker started trading later and you want a head-to-head from the youngest start (for example, comparing CRWD to MSFT, where MSFT predates CRWD by decades). Returns and quant metrics recompute automatically against the new window.
Short video≈1400×900 · 5 to 7s loop
Capture: compare MSFT, GOOG, CRWD on a 10Y window so CRWD's late start is visible. In the Configuration tab, set Baseline = CRWD and let the chart rebase. The leaderboard order may change.
2.7
Important Period chip in chart title
When you activate a historical event (like "2022 Bear Market" or "GFC"), a purple chip appears in the chart title showing the event name and date range. You always know what window you are looking at, even after deep zooming or scrolling. The chip clears in one click.
Short video≈1300×800 · 4 to 5s loop
Capture: open the Important Period dropdown, pick "2022 Bear Market", and let the chart snap to the window. The purple chip should be plainly visible in the chart title.
2.8
Hover returns panel
A small panel pinned to the top-left of the chart shows every ticker's return at the current hover x-position, sorted with the leader on top. Walk your cursor along the chart and the panel updates in real time, capping at 30 rows for readability. Useful for answering "who was up the most on this date?".
Short video≈1400×900 · 5 to 7s loop
Capture: a 5Y chart with 12 to 15 tickers. Sweep the cursor slowly from left to right, ideally pausing at a couple of inflection points (a crash, a rally) so the leader reordering in the panel is visible.
The legend below the chart is interactive. Use it to emphasize, hide, or open a per-ticker dossier.
3.1
Hover a chip to emphasize a line
Hover any ticker chip in the legend below the chart and that line gets thicker while every other line dims. Move the cursor away and the chart returns to normal. Useful for inspecting one line in a busy chart without losing the comparison context.
Short video≈1400×900 · 4 to 6s loop
Capture: chart and legend in view. Hover one chip for 2 seconds (line thickens, others dim), move off, then hover a different chip. The transition should feel fluid.
3.2
Shift+click to hide a line
Shift+click any legend chip to hide that line from the chart. The chip stays in place (dimmed with a dashed border) so you remember it exists and can re-add it with another shift+click. Useful for temporarily removing an outlier so the remaining lines fill the chart vertically.
Short video≈1400×900 · 5 to 7s loop
Capture: a chart where one ticker (e.g., NVDA on 5Y) compresses everything else. Shift+click the NVDA chip to hide it, watch the chart auto-rescale, then shift+click again to bring it back.
3.3
Smart legend sorting
The legend auto-sorts by the most relevant metric for the current window: CAGR for windows longer than a year, raw period return for shorter windows. The leader is at the top. The default ordering matches the metric that best characterizes the active timeframe, so no manual sort is needed for a quick read.
Two screenshots, side by side≈700×500 each
Capture: the same set of tickers on a 1M window (sorted by raw return) and on a 5Y window (sorted by CAGR). Same tickers, different leaderboard order. Caption the difference.
3.4
Per-chip cheatsheet dossier
Hover the small three-bar icon on any legend chip to open a wide per-ticker dossier in place. The dossier shows headline metrics (CAGR, period return, volatility, Sharpe, SPY correlation, trend score) with rank capsules, plus a multi-period returns strip, ATH and ATL info, and the ticker's sector and industry. A complete per-ticker read without leaving the chart.
Short video≈1500×900 · 6 to 8s loop
Capture: the legend in view, hover the three-bar icon on the NVDA chip so the cheatsheet opens, hold for 3 seconds so the headline metrics, multi-period strip, and ATH/ATL block are all readable. Then hover a different chip.
Sort, scan, and filter the numbers behind every comparison.
4.1
Comprehensive sortable rankings table
Every comparison drives a rankings table below the chart, sortable by any column. Click any column header to sort ascending or descending. Use it to move from "show me a chart" to "rank these tickers by Sharpe ratio" in one click.
Screenshot≈1500×900
Capture: the rankings table populated with 12 to 15 rows. Show all three category groups visible (Basic, Quant, Multi-Period). Sort by Sharpe so the active sort indicator is visible.
4.2
Sticky first three columns
The Visibility, Rank, and Ticker columns stay pinned on the left when you scroll the table horizontally. You always know which row you are reading, even when comparing wide metric strips on a narrow screen. The sticky band has a subtle shadow so the boundary is visible.
Short video≈1300×600 · 4 to 5s loop
Capture: the table on a narrow viewport (or with all three categories enabled so it overflows). Horizontally scroll right and back, so the sticky shadow is visible and the Ticker column never moves.
4.3
Color-coded category toggles
Three toggle pills above the table (Basic, Quant Metrics, Multi-Period) let you show or hide whole groups of columns, each color-coded blue, purple, and green with a live count. Your selection persists across reloads and across comparison sets. Use this to focus on what matters for the question you are asking, without losing the other columns permanently.
Screenshot≈1100×500
Capture: the three category toggles above the table with live counts (e.g., "Basic 5", "Quant 6", "Multi-Period 4"). Show the table immediately below so the column groupings line up by color.
4.4
Range band visualization
The Range column shows a small horizontal bar with a marker indicating where the current price sits between the period's low and high. At a glance you see whether a ticker is near its peak, mid-range, or near its trough for the selected window. Hover for the exact high, low, and current values.
Screenshot≈900×500
Capture: close-up of the Range column for 8 to 10 rows. Mix tickers near their peak (marker at right), near their low (marker at left), and mid-range so the visualization variety is obvious.
The Multi-Period column shows a small vertical bar chart, one bar per period. Bars are always rendered chronologically (shortest left, longest right) regardless of selection order, with bar height proportional to rank. The shape shows whether a ticker is consistent across timeframes or, say, "strong in 1Y but middling in 5Y".
Screenshot≈1100×600
Capture: close-up of the visual summary column for 10 to 12 tickers. Pick rows with contrasting shapes: one consistent winner (tall bars across the strip), one that improves over time (rising bars), one mediocre everywhere.
5.2
Hover tooltip on the visual summary
Hover the visual summary and a tooltip lists the ticker's average rank plus every period's value and rank. You see all the underlying numbers without losing the visual. Useful when two tickers have similar bar shapes and you want to know exactly where they differ.
Short video≈1200×800 · 4 to 6s loop
Capture: hover the visual summary cell for one ticker and let the tooltip appear, hold for 2 seconds, then move to a different row to show the tooltip update.
5.3
Sort by individual period or by average
Sort the rankings table by any individual period (for example, 5Y return) or by the average rank across all selected periods. The average-rank sort surfaces tickers that perform well across many windows, not just one. The arrow on the column header shows the current sort direction.
Short video≈1300×800 · 5 to 7s loop
Capture: sort by 1Y return (one ranking), then by 5Y return (different ranking), then by Avg Rank (a "consistency winners" ranking that differs from both). Three quick sorts, with the table reordering each time.
Risk-adjusted and path-quality metrics that go beyond raw return.
6.1
Trend Score
Trend Score grades the quality of a price path on a scale from -1 to +1, magnitude-aware and time-normalized so longer windows do not dominate. A score near +1 indicates a smooth, sustained climb; near -1 indicates a smooth, sustained decline; near zero indicates choppy or sideways action. Use it to distinguish tickers that climbed steadily from tickers whose gains came in a few sharp jumps.
Screenshot≈1000×550
Capture: the table sorted by Trend Score descending. Pick a comparison set with a mix of clean climbers (high score), choppy movers (near zero), and a steady decliner (negative). Highlight the column.
6.2
Trend Score interval breakdown tooltip
Hover the Trend Score column to see the score broken into 12 sub-intervals, each with its own date range, return, and contribution percent to the total. The breakdown shows which segments built the score and which subtracted from it. The metric is inspectable instead of opaque.
Short video≈1200×900 · 5 to 7s loop
Capture: hover the Trend Score cell on a high-scoring ticker (NVDA on 5Y is a good example), let the 12-interval breakdown render, hold 3 seconds. Then hover a low-scoring ticker so the contrast is visible.
6.3
Trend Return
Trend Return is a composite that combines raw return with Trend Score, weighting gains earned via a steady path higher than gains earned from a single sharp move. Sort by Trend Return when you want returns weighted by path quality. The resulting order often differs from a sort by raw return.
Two screenshots, side by side≈700×500 each
Capture: the same comparison sorted by raw Return (left) and by Trend Return (right). The order should differ visibly so the reader sees what "rewarded for path quality" means.
6.4
Free-tier teaser dropdown
On the free tier, the multiselect for Quant Metrics still shows every Pro metric (Sharpe, max drawdown, SPY correlation, and others) with a short description and an upgrade nudge. You can see the full menu before deciding to upgrade. The selected metrics make it onto the table immediately after upgrade, no resetting required.
Screenshot≈700×600
Capture: the Quant Metrics multiselect open on a free-tier session. Show the locked Pro options with their descriptions and the upgrade nudge clearly visible.
6.5
Help modal on every metric header
Click the small help icon on any metric column header for a plain-English explanation, the relevant tradeoffs, and a use-case example. No prior finance background required to understand what Sharpe ratio rewards or where Trend Score might mislead. A way to learn the vocabulary of quantitative comparison alongside real work.
Short video≈1200×900 · 6 to 8s loop
Capture: click the help icon on the Sharpe column header, let the modal render, hold for 3 seconds so the body text is readable, dismiss, then open the help modal for Trend Score so two metrics are demonstrated.
Pick from 20+ presets, custom date ranges, or 17 historical events. Switching windows is one click.
7.1
More than 20 preset periods
The timeframe bar offers more than 20 presets, from 1D, 2D, 3D, and 1W on the short end through 25Y and 30Y on the long end. Click any one and the chart, table, and rankings recompute instantly. A custom date range picker is also available if no preset fits.
Screenshot≈1100×400
Capture: the full preset bar in the Essentials tab with one preset highlighted as active. Show enough of the bar that the breadth from 1D through 30Y is visible.
7.2
Intraday granularity (15-minute bars)
For 1D, 2D, and 3D presets, the chart switches to 15-minute interval data with intraday-aware behavior (no whitespace for non-market hours, day-start markers, the latest live quote always included). Useful for fast-moving days when daily granularity is too coarse. Holiday and weekend gaps are handled cleanly so the chart reads naturally.
Screenshot≈1300×800
Capture: a 3D intraday chart showing day-start markers (dotted vertical lines + date labels) and 15-minute granularity. Pick a recent 3-day window with visible movement.
7.3
Important Periods dropdown
A dropdown organizes 17 historical events into two tiers. Tier 1 is the canonical episodes (Dot-com Boom and Bust, GFC, COVID Crash and Recovery, 2022 Bear Market, AI Boom, and others). Tier 2 is the deeper cuts (LTCM, 9/11, Brexit, Q4 2018, Banking Crisis 2023, and more). Activate one and the chart snaps to the event's window. Useful for answering "how would my picks have done in the GFC?".
Screenshot≈700×800
Capture: the Important Periods dropdown open, showing the two-tier grouping with event names and date ranges. Both Tier 1 and Tier 2 sections should be visible (may need to scroll mid-list).
Hold multiple parallel comparisons in one session, or start from a curated preset.
8.1
Up to 25 comparison sets per session
A single session can hold up to 25 comparison sets, each with its own tickers, timeframe, columns, and benchmark. Use them to keep separate workstreams (your IRA, a watchlist, a sector deep-dive, a peer comparison for one stock) without losing context. A quick-switch dropdown lets you flip between sets and your settings travel with each one.
Short video≈1200×800 · 5 to 7s loop
Capture: the comparison-set dropdown open, listing 6 to 8 sets with names and ticker counts. Pick a different set so the chart and table swap to the new one. The transition should be smooth.
8.2
Curated ticker collections
Browse curated collections grouped by category: FEATURED Showcase (the breadth of the app at 25 to 100 tickers), DIVERSIFIED (asset class baskets), SINGLE-ASSET (one slice per category), STOCKS (sector groupings), and SCENARIOS (themes like AI, EVs, banking crisis). Each collection is a one-click way to see a meaningful comparison without typing tickers. Save any of them as your own editable set with the fork button.
Screenshot≈1100×900
Capture: the curated collections panel open, showing the category headers (FEATURED Showcase, DIVERSIFIED, etc.) and a representative selection of presets in each. Make sure category labels and emoji badges are readable.
8.3
Read-only preset banner
When a curated collection is active, a banner above the chart shows the collection's name, emoji, and short description. You always know whether you are looking at "your" set or someone else's curation. Click the fork icon in the banner to copy it into an editable user set.
Screenshot≈1200×400
Capture: the preset banner above the chart with name, emoji, and one-line description. Show enough of the chart underneath to give context. The fork icon should be visible.
Share any comparison via two URL formats: a session permalink, or a typeable raw URL.
9.1
Session permalink at /c/{code}
Every session has a 10-character permalink (e.g., /c/x9k2p3jq8r) you can share with anyone. Open it in a different browser, on a phone, or send it to a colleague, and the recipient sees the exact same comparison. No login required on either side.
Screenshot≈1200×500
Capture: browser address bar showing a real /c/{code} URL with the chart loaded below. Optionally show the "Copy Session Link" button in the header tooltip-state.
9.2
Raw URL share mode
You can also share comparisons as readable URLs like /t/AAPL,MSFT,GOOG?preset=1Y. These URLs are typeable, dictation-friendly, and survive without any session storage on the backend, so they work even if you reinstall your browser or share via voice. A purple raw-mode badge above the chart signals when you are in this mode.
Screenshot≈1200×500
Capture: browser address bar with /t/AAPL,MSFT,GOOG?preset=1Y visible, plus the purple raw-mode badge above the chart, plus the chart itself loaded with those three tickers.
A header signal that shows which features are unlocked in the current session.
10.1
Tier badge in the header
Your tier shows as a small icon in the header (a battery-full icon for Pro, a battery icon for Free). It is a quick visual confirmation of which features are unlocked for the current session. Click it to manage your subscription or upgrade.
Two screenshots, side by side≈400×120 each
Capture: header strip showing the Pro tier badge (battery-full icon) and a separate header strip showing the Free tier badge (battery outline icon). Caption each.
A UI signal that confirms the backend is fast on every fetch.
11.1
Response-time toast
Every prices fetch shows a small toast with the actual response time ("Results in 84 ms" or "1.23s") so the elapsed time is visible directly, not inferred. The Go backend serves quant metrics in under 100ms for typical comparisons. The toast also confirms that fresh data has arrived.
Short video≈1100×600 · 3 to 4s loop
Capture: trigger a comparison (e.g., switch presets) and let the toast appear in the bottom-right corner. Show the chart re-rendering in the background while the toast surfaces the elapsed time.
Every setting lives here. Simple controls are one click; deeper ones are one tab away.
12.1
Tabbed control panel
The control panel groups every setting into two tabs: Essentials (tickers, timeframe, custom range, important period) and Configuration (top performers filter, table metrics, multi-period selector, benchmark). The Essentials tab covers the common day-to-day controls. Configuration holds the deeper tuning for columns, metrics, and benchmarks, without burying the everyday controls underneath them.
Two screenshots, stacked≈800×600 each
Capture: the control panel with the Essentials tab active (top), then the same panel with the Configuration tab active (bottom). The tab strip should be visible in both so the structure is obvious.
12.2
Cmd+K command palette
Press Cmd+K (or Ctrl+K on Windows/Linux) to open the control panel as a centered modal. Useful when the side panel is collapsed, when you are on a smaller screen, or simply when you prefer keyboard-first workflows. Press Esc to dismiss.
Short video≈1300×800 · 4 to 5s loop
Capture: the app with the side panel collapsed. Press Cmd+K so the command palette modal opens centered, hold for 2 seconds, dismiss with Esc. Bonus if a key-press overlay shows the shortcut.