Print or save as PDF: use your browser’s Print dialog.

One portal.
Every surface a consulting business needs.

How I turned scattered business data into a knowledge system that compounds — with markdown, vanilla JS, and AI. A case study in building a business operating layer you own.

Illustration: scattered papers, notes, and small screens around a desk flow into one monitor showing a clean dashboard with teal accents.

Running a design consultancy means juggling CRM, finances, strategy, operations, and marketing at once. The default is fragmentation: a spreadsheet here, a slide deck there, context buried in email. This page is the story of the opposite — a single portal where raw inputs become structured knowledge, and knowledge becomes insights and decisions.

Three stacked planes: raw inputs as scattered shapes, a middle grid of organized knowledge, and top-level dashboards for decisions.

The three-layer model

Layer 1

Inputs

Raw business data from many sources — scattered across tools by default. The portal gives them a home.

CRM / contactsDex, LinkedIn exports, event tagging
Financial dataMonarch CSV, invoices, running costs, budget
StrategyBMC, competitor swipes, persona research
OperationsPipeline deals, session notes, tasks, OKRs
MarketingEmail copy, social, elevator speeches, brand voice, lead magnets

Layer 2

Knowledge

Markdown is the source of truth. Ten-plus sync scripts compile it into portal data. The AI maintains it — you direct.

Offers catalogmessaging/offers.md → priced, linked pages
Competitive landscapeSwipe notes → normalized cards
Personas & strategyBMC, positioning, research hub
Pipeline & contactsStaged deals, qualification, tags
Session resourcesNotes → tasks, messaging, library
Finance viewsCategorized, date-ranged transparency

Layer 3

Insights & decisions

The portal is not a dashboard you stare at. It’s a system you operate through.

Pricing emulatorModel scenarios before a proposal call
Engagement calculatorScope and price in real time
Finance dashboardRevenue, variance, running costs, pipeline forecast
Pipeline kanbanEst. value feeding projections
OKRs & 90-day trackerOn track at a glance
Discovery configStructured qualification on sales calls
Email sequencesKit-ready copy, PDF export for review

Layer 1 — detail

What goes in

CRM / contacts — Contacts from Dex, LinkedIn exports, and event tags land as data the portal can browse and qualify.
Financial data — Monarch Money exports, invoice metadata, running-cost configs, and budget JSON power revenue and spend views.
Strategy — Business Model Canvas, competitor swipe files, and persona work become linked strategy pages.
Operations — Pipeline markdown, cohort session notes, Linear-linked tasks, and OKR docs stay authoritative in the repo.
Marketing — Elevator speeches, stories, email sequences, social campaigns, and brand voice live as markdown and JSON sources.

Key point: Inputs start life in specialist tools. The portal is the layer where they converge — same navigation, same design system, same truth.

Layer 2 — detail

What gets organized

Offer definitions in markdown sync to a browsable catalog with positioning and cross-links.
Session and cohort notes propagate into task lists, resource stubs, and portal HTML exports.
Competitor research normalizes into a matrix-friendly data shape for the competitive landscape page.
Financial CSVs and configs drive filtered dashboards — business vs personal, hygiene rules, duplicate handling.
Contacts merge snapshot data with browser-side qualification (stage, score, next action) without locking you into one SaaS UI.

Key point: Knowledge is compiled, not copy-pasted. One edit in source can refresh every surface that depends on it.

Layer 3 — detail

What comes out

Pricing & engagement tools — Emulators and calculators turn offer math into something you can use on a live call.
Finance transparency — Paid, invoiced, and pipeline-estimated revenue in one bar; rolling charts and client rollups when you need depth.
Planning surfaces — OKRs and a 90-day tracker connect execution to the quarter you’re in.
Sales readiness — Discovery configuration and proposals index support consistent qualification and packaging.
Campaign ops — Email sequences with export paths for signoff; social content synced from structured JSON.

Key point: The output isn’t “more reports.” It’s decision-grade views you open when you’re about to act.

How it’s built

Architecture (compact)

Sources (MD, JSON, CSV) → Sync scripts (Node CLI) → Portal data (*.js manifests) → 50+ static HTML pages (vanilla JS) ↑ └── AI skills (Cursor): maintain sources, run syncs, process sessions

Blueprint-style pipeline: sources and markdown flow through sync tooling into compiled portal data and static HTML pages.

50+Portal pages across strategy, finance, sales, messaging, ops, cohort, system
5×2Design palettes × light/dark modes
28JS modules · 0 frameworks
10+Sync scripts from markdown & exports
15+Cursor skills for recurring workflows

Design system

One token file, every page

Palette and mode are orthogonal: pick a brand axis (Atelier, Courage, Minimal, HL, Blueprint) and a luminance axis (light / dark). tokens.css holds the custom properties — change a token, and the whole portal moves together.

Atelier

Courage

Minimal

Blueprint

Light mode Dark mode — persisted per user; system fallback when unset.

Before & after

Before

Strategy in a Google Doc updated twice a year. Pipeline in a spreadsheet. Finances in Monarch with no unified business view. Messaging scattered across drafts. Session notes in a folder nobody reopens.

After

One portal. Pull up the one-sheet before a call. Check pipeline and finance in the same session. Draft an email sequence and export it for Kit. Process a cohort session and watch tasks, messaging, and resources stay in sync.

Principles

—Markdown is the source of truth — portable, diffable, AI-friendly.
—Compile, don’t copy — one edit propagates everywhere via sync scripts.
—AI maintains; you direct — the model handles tedious syncing; you own the decisions.
—Own your infrastructure — no SaaS lock-in; everything lives in a git repo you control.
—Every exploration adds up — sessions and research feed back into the knowledge base instead of evaporating in chat.

Abstract geometric composition: nested rectangles within a circle and radiating lines, Bauhaus-inspired.

Get the starter kit

Build your own Business OS

Want this system for your own practice? Get the open-source starter kit — fork the repo, then make it yours. Markdown stays the source of truth; AI keeps it in sync; you own every file.

The Business OS starter repo — static portal shell, design tokens, and sync scripts, ready to fork
The walkthrough — the three-layer model and how the pipeline fits together
An architecture map — remix the layers for your own inputs and surfaces
A demo example — a generated portal you can compare before you build

One email with the links. No spam, unsubscribe anytime.