&Points & Prompts Design exploration

Rethinking P&P's navigation — and leveling up the polish

Three clickable directions, each answering the same two questions: where does site navigation live (and how do you jump between sub-sections of dense pages like Points Strategy), and what does a more polished P&P look like — benchmarked against point.me-class fintech/travel tools. Every mockup uses the real demo wallet ($2,805 across 4 programs), real card names, and the true-value ¢/$1 framing. Each is responsive and has a light/dark toggle.

July 20, 2026 · Exploration only — no production changes · Data verified 2026-07-13

Direction A

Expandable left nav — "Heritage"

The sidebar stays, but every top-level item can expand: Points Strategy → 1 Earn / 2 Use / 3 Activate, Wallet → Cards & Points / Monthly Budget, Ask AI → New chat + 3 recents, Programs → its four tabs. Sub-sections of any page are one click away from anywhere.

SolvesFast in-page jumping on dense pages without leaving the familiar sidebar model.
TradeoffsRecents shrink to 3; the sidebar gets busier; two-level nav needs discipline as pages grow.
LookHeritage: warm paper, Fraunces serif display, double-rule page headers, navy + gold. The most "P&P classic" of the three, executed tighter.
Open — Strategy Wallet Ask AI Dark ↗
Direction A desktop Direction A mobile dark
Desktop light · mobile dark
Direction B — Jeremy's leaning

Top nav + AI-only sidebar — "Precision"

Site navigation moves to a slim top bar. The left sidebar now belongs to Ask P&P AI alone: New chat + 10 visible recents with snippets, grouped by day. Dense pages get sticky section tabs (1 Earn · 2 Use · 3 Activate) that follow you as you scroll.

SolvesChat history finally gets room; the chat surface feels like a first-class AI product (Claude/ChatGPT pattern); sub-section access is always visible, not buried in a drawer.
TradeoffsTop nav caps at ~6 items — Methodology/Updates/Status compete for space; mobile needs a sheet menu.
LookPrecision: point.me-class polish — cooler neutrals, tabular numerals, KPI cards, hairline tables, serif reserved for one display moment per page.
Open — Ask AI Strategy Wallet Dark ↗
Direction B desktop Direction B mobile dark
Desktop light · mobile dark
Direction C

Icon rail + context panel — "Atlas"

A compact icon rail holds the six site destinations; a second panel is contextual per page — on Ask AI it's your chat recents, on Wallet/Strategy it's the sub-sections ("On this page"). One consistent slot serves both of the sidebar's old jobs. Mobile gets a native-feeling bottom tab bar.

SolvesResolves the nav-vs-chat conflict structurally — the panel is always the "local" layer, the rail always the "global" layer.
TradeoffsTwo columns cost ~320px; icon-first nav has a learning curve; most divergent from today's app.
LookAtlas: deep green primary with gold as the brand spark, larger radii, gradient hero KPIs — the most "new product" energy.
Open — Strategy Wallet Ask AI Dark ↗
Direction C desktop Direction C mobile dark
Desktop light · mobile dark
Designer's recommendation: ship Direction B's information architecture (top nav + AI-only sidebar + sticky section tabs) with its Precision visual language, borrowing Direction A's warmer paper background so the brand doesn't go cold. B is the only model where the Ask surface reads as a true AI product and dense pages get always-visible section jumping — and it's the closest to point.me's calm, data-forward professionalism. Direction C is the boldest long-term idea; A is the safest incremental step.

How to review

Open each direction and click through the three surfaces (Ask AI, Wallet, Strategy) using its own navigation — the nav is the prototype. Try the theme toggle in each, and resize to phone width (or open on your phone) to judge the mobile answer: drawer (A), sheet menu (B), bottom tabs (C).

Built as a static exploration for Jeremy — no changes to the production repo. Wallet figures ($2,805 · Amex MR 12,345 · Chase UR 60,000 · United 40,000 · Hyatt 25,000) and all ¢/$1 math mirror verified P&P data from 2026-07-13.