Skip to main content

§ masterplan.md

Glass Crypto Watchlist

A translucent crypto dashboard with live sparklines, watchlists and portfolio allocation rings.

All ideas
Glassmorphism

01

App overview and objectives

A portfolio tracker with live prices, layered translucent cards, and honest performance maths including fees and cost basis. Read-only by design: it never touches funds.

02

The problem worth solving

Exchange apps show a balance, not performance. Investors need cost basis, realised versus unrealised gains and fees in one place, without handing anyone withdrawal rights.

03

Target audience

  • Primary — Individual investors holding assets across several venues.
  • Secondary — Accountants preparing tax summaries for clients.

04

Roles and permissions

  • Visitor — read-only public pages, can sign up.
  • Member — owns their own records, cannot see other users' data.

05

Core features

  • Manual and read-only API portfolio import
  • Live price streaming with sparkline cards
  • Cost basis, realised and unrealised gains, fee accounting
  • Price and percentage-move alerts
  • Allocation breakdown by asset and venue
  • Tax-year export as CSV

Deliberately later

  • Multi-currency reporting
  • Tax lot method selection
  • Historical portfolio replay

06

Technical stack

React with a websocket price feed, Postgres for holdings and transactions, server functions to compute performance.

Why: Gain calculations must be deterministic and auditable, so they belong on the server with stored transactions rather than in browser state.

Alternatives: Client-only with local storage (maximum privacy, no cross-device sync) or a full exchange integration platform (richer, far larger compliance burden).

07

Conceptual data model

Holding — user, asset, quantity, venue

Transaction — user, asset, type, quantity, price, fee, timestamp

PriceTick — asset, price, currency, timestamp

Alert — user, asset, condition, threshold, channel, active

ApiConnection — user, venue, read-only key reference, status

08

Integrations

  • Market data websocket provider
  • Read-only exchange APIs
  • Notification delivery

09

UI design principles

  • Frosted translucent panels over a soft gradient or blurred photographic backdrop.
  • Depth through blur and light borders rather than drop shadows.
  • Check contrast on every glass surface; text stays readable over any background.

10

Security considerations

  • Only read-only API keys accepted; reject any key with trade or withdraw scope and say why.
  • Encrypt keys at rest with a managed key service; never expose them to the client after saving.
  • Strong session security and optional two-factor authentication — this is financial data.

11

Development phases

Phase 1 — Prove the core

  • — Manual and read-only API portfolio import
  • — Live price streaming with sparkline cards
  • — Cost basis, realised and unrealised gains, fee accounting
  • — Static content and design system in place
  • — Basic analytics

Phase 2 — Make it real

  • — Price and percentage-move alerts
  • — Allocation breakdown by asset and venue
  • — Tax-year export as CSV
  • — Accounts, sign-in and password reset
  • — Empty, loading and error states everywhere

Phase 3 — Polish and launch

  • — Performance, accessibility and SEO pass
  • — Legal pages, contact route and 404 handling
  • — Wire up: Market data websocket provider
  • — Wire up: Read-only exchange APIs

Phase 4 — Grow

  • — Multi-currency reporting
  • — Tax lot method selection
  • — Historical portfolio replay

12

Challenges and solutions

Risk — Users paste keys with withdrawal permission

Solution — Validate scopes at connection time, refuse and link to instructions for creating a restricted key.

Risk — Price feed cost at scale

Solution — Subscribe only to assets actually held, and batch updates on a throttle.

Risk — Tax accuracy expectations

Solution — State clearly that exports are a working document, not filed advice, and show the calculation method used.

13

Future expansion

  • Team and fund portfolios
  • Automated tax-report partnerships
  • Public performance sharing with hidden amounts

14

Page list (13 pages)

  1. 01 PUBLIC Portfolio — Holdings, allocation and performance.
  2. 02 PUBLIC Markets — Live prices and watchlists.
  3. 03 PUBLIC Alerts — Conditions and delivery channels.
  4. 04 PUBLIC History — Transactions and realised gains.
  5. 05 APP (signed in) Settings — Connections, currency, security.
  6. 06 AUTH Sign up — Create an account with email or a social provider.
  7. 07 AUTH Log in — Return to the account, with error and lockout states.
  8. 08 AUTH Reset password — Request a reset link and set a new password.
  9. 09 APP (signed in) Account settings — Profile, email, password, language and delete account.
  10. 10 PUBLIC Contact — Contact form plus real address, phone and email.
  11. 11 LEGAL & SYSTEM Privacy policy — What data is collected, why, and how to remove it.
  12. 12 LEGAL & SYSTEM Terms of service — Rules of use, liability and account termination.
  13. 13 LEGAL & SYSTEM 404 not found — Friendly dead end with search and links back.

15

Page map

PUBLIC        AUTH               APP (signed in)      LEGAL & SYSTEM
────────────  ─────────────────  ───────────────────  ───────────────────
├─ Portfolio  ├─ Sign up         ├─ Settings          ├─ Privacy policy
├─ Markets    ├─ Log in          └─ Account settings  ├─ Terms of service
├─ Alerts     └─ Reset password                       └─ 404 not found
├─ History
└─ Contact

key flows:
  Portfolio ──▶ History
  Markets ──▶ Alerts
  Portfolio ──▶ Markets
  Settings ──▶ Portfolio