Running the Web UI
The Web UI gives you a browser-based interface for creating and editing scenarios, rendering projections, and viewing results. It has two main parts: the Setup Panel (where you edit configurations) and the Projection Shell (where you view results).
Starting the Editor
Section titled “Starting the Editor”From your Net Worth Navigator directory:
.venv\Scripts\python.exe admin_app.py.venv/bin/python admin_app.pyThe editor listens on http://localhost:8010.
Windows Firewall: If Windows Security warns that the firewall has blocked Python, click Allow access and uncheck Public networks. This is safe — the editor only listens on your local machine.
Key URLs
Section titled “Key URLs”| URL | Purpose |
|---|---|
| http://localhost:8010/setup | Scenario Setup Panel — create and edit scenarios |
| http://localhost:8010/projection.html | Projection Shell — view rendered scenarios |
| http://localhost:8010/compare.html | Compare Page — side-by-side scenario comparison |
| http://localhost:8010/definitions.html | Parameter definitions reference |
The Projection Shell
Section titled “The Projection Shell”After rendering a scenario, open projection.html at http://localhost:8010/projection.html. The shell page provides:
- Scenario & Mode selectors at the top — switch between your plans and Deterministic / Historical / Monte Carlo views
- KPI strip — key numbers at a glance (starting net worth, net worth at retirement, retirement age, end-of-plan net worth)
- Interactive chart — the main projection chart with zoom controls (Full / 10yr / 25yr / 50yr), scroll-wheel zoom, and event label toggles
- Tabbed panels under the chart:
| Tab | Shows |
|---|---|
| Accounts | Year-by-year balance breakdown per account type with per-person ownership |
| Cash Flow | Income, spending, contributions, taxes, surplus routing |
| Tax | Federal and state tax breakdown per year, with cumulative summary |
| Simulation | Monte Carlo / Historical outcome distributions and yearly results |
| Portfolio | Investable assets only (taxable, traditional IRA, Roth) |
| Gantt | Timeline of all life events with milestone and span semantics |
| Liabilities | Debt payoff trajectory chart and amortization table |
| Cash Reserve | Cash balance vs targets, phase boundaries, below-target highlights |
| Assumptions | Formatted summary of your scenario’s configuration |
| Scenario Parameters | Full parameter listing with diff highlighting vs the default scenario |
- Toolbar buttons: Open Scenario Page, Compare Scenarios, Help (?), Scenario Setup
The Scenario Setup Panel
Section titled “The Scenario Setup Panel”The Setup Panel at /finances/config/setup is how you create and edit scenarios. Its six tabs are:
- Metadata — scenario identity, people, plan years, cash targets, assumptions, and collapsed advanced withdrawal, tax, RMD, and simulation settings
- Social Security — each person’s claim-age benefit table
- Income & Contributions — income, contribution method, employer match, routing, and ownership shares
- Accounts — data source selection and opening balances: Manual Entry, Monarch Money, or CSV Import
- Events — the editable event-driven timeline, including retirement, Social Security claiming, and end-of-plan timing
- Raw TOML — direct text editor for the complete configuration file
Sample scenarios are read-only; clone one before saving edits.
Global action bar (at the bottom) — save, validate, render the current scenario, or render all scenarios.
The Compare Page
Section titled “The Compare Page”Open /finances/config/compare.html (or click “Compare Scenarios” in the shell toolbar). Select two or more scenarios to compare side by side:
- Total Net Worth — overlay of each scenario’s trajectory
- Investable Portfolio — assets-only comparison
- Net Worth Delta — difference from the baseline scenario
- KPI table — side-by-side metrics with delta highlighting
Help Mode
Section titled “Help Mode”Click the ? button in the projection page toolbar to enable help mode. Info icons (ℹ️) appear next to each KPI box and tab label. Hover or tap to read explanations in plain language. Help mode persists across page loads via your browser’s local storage.