A metabolic-health course you actually finish, built from first principles
An interactive 8-module curriculum plus a booking and blog site that teaches gym clients how their own metabolism works, then turns that understanding into a coaching protocol.
The problem
Most health education is either a wall of PDFs nobody reads or a stream of "do this, not that" rules with no reasoning behind them. People follow the rules for a week, hit a question the rules do not answer, and quit. MetFix needed the opposite: a course that teaches metabolic health from the ground up, so a client understands why insulin resistance happens, what mitochondria actually do, and how to read their own blood markers. It had to work on a phone in a gym lobby, track where each person left off, and feed directly into a booking flow so curiosity turns into a consultation. We built it as one system: an interactive curriculum on one side, a booking and blog site on the other, sharing the same brand and the same path to "book an appointment."
What we built
The modules of the system.
Interactive curriculum (8 modules)
Eight self-contained lessons that build from philosophy of science to real interventions: a tale of two sciences, frequentist vs Bayesian evidence, mitochondria and cellular energy, food-to-energy pathways, reactive oxygen species, metabolic flexibility, insulin and metabolic syndrome, and breaking the cycle. Modules 1 and 2 use a tab-based reading layout; modules 3 through 8 are animated HTML5 canvas explainers that draw the biology as you read it (module 3 alone has hundreds of canvas-draw and animation calls).
Learn page with progress tracking
The curriculum hub lists every module, shows checkmarks for what you have finished, and reports an X-of-8 progress count. Progress is saved in the browser via localStorage under metfix-completed-modules, and hitting Next on a module records it as done before moving on. No login, no account, but you still pick up where you left off.
Metabolic Flexibility Assessment tool
A standalone calculator that turns clinical numbers into something a client can act on: a HOMA-IR calculator from fasting glucose and insulin, a Triglyceride/HDL ratio calculator, an explanation of how RQ is actually measured, blood-marker proxies for metabolic flexibility, and a subjective self-assessment. It is the bridge between learning the theory and seeing your own status.
Optional deep dives
Two untracked bonus lessons for people who want the full argument: a Broken Science piece on why the world is blind to this, and a from-scratch walk through the math of Bayes theorem (P(D|H) vs P(H|D)). They sit outside the 8-module count so they never block completion.
Booking and protocol site
The public face at metfixseattle.com: a section-composed landing page (hero, the problem, the solution, the program, consultation, research, FAQ) with a booking modal, a floating consultation button, and a $150 consultation offer that converts a reader into a booked client.
Blog and Daily Fix
A Supabase-backed blog stores articles as either uploaded HTML files or inline HTML, with public read access enforced by row-level security so only published posts are visible. A Daily Fix widget embeds the Broken Science Initiative feed, giving the site a steady drip of fresh, on-brand content without manual updates.
How it fits together
MetFix is two surfaces that share one brand and one goal: get a curious client to book. The curriculum is a set of static, self-contained HTML pages, each module a single file with its own inline canvas animations and logic, so it loads instantly, works offline on a phone in a gym, and needs no server. State that matters (which modules you have finished) lives in the browser via localStorage, which keeps the whole thing zero-backend and zero-login. The booking and blog site is a separate React app (Vite, TypeScript, shadcn-ui, Tailwind) deployed at metfixseattle.com, with Supabase handling the one piece that genuinely needs a database: the blog. Articles live in a Postgres table with row-level security so the public can only read published posts. Both surfaces point at the same booking flow, and the footer of every course page links straight to "Book MetFix Appointment," so learning and converting are never more than one click apart. The content itself is grounded in the MetFix Foundation course and Greg Glassman's Broken Science Initiative, which is why the early modules teach how to evaluate evidence before they teach any biology.
Under the hood
The decisions that mattered.
Static HTML modules with no backend, on purpose
Each of the eight modules is one self-contained HTML file with its own inline styling, content, and animation code. There is no framework, no build step, and no server for the curriculum. That decision came from where it actually gets used: a phone in a gym lobby, often on weak WiFi. Single files load instantly and keep working if the network drops. It also means progress tracking had to be solved without a database, so completion is stored in the browser under the localStorage key metfix-completed-modules. The learn page reads that array on load to draw checkmarks and the X-of-8 count, and each module writes to it on Next before navigating. Simple, durable, and impossible to break with a bad deploy.
Teaching biology with animated canvas, not stock diagrams
Modules 3 through 8 cover cellular energy, metabolic pathways, oxidative stress, fuel switching, and disease mechanism. Static diagrams do not show a process unfolding, so these modules are built on HTML5 canvas with live animation: module 3 alone carries hundreds of canvas-draw, animation-frame, and event-listener calls to render the electron transport chain and ATP production as moving pictures. Canvas on a small screen needed a fallback, so each animated module ships a thumbnail that opens a full-screen 900x650 modal on mobile and a Full Screen button on desktop. The reader sees the animation properly on any device instead of squinting at a shrunk-down canvas.
Front-loading how to evaluate evidence before any biology
Most health courses start with the body. MetFix starts with epistemology: module 1 is a tale of two sciences and module 2 is frequentist vs Bayesian, including the distinction between P(D|H), what a p-value gives you, and P(H|D), what you actually want to know. That ordering is deliberate and comes from the Broken Science Initiative foundation of the material. The point is to give clients a filter so the later modules on mitochondria, insulin, and interventions land as reasoned conclusions, not more rules to memorize. The two heaviest pieces of that argument (the why-the-world-is-blind essay and the full Bayes-theorem math) are pulled out into optional, untracked deep dives so they never block someone from finishing the core eight.
A blog that takes hand-authored HTML, backed by Supabase
The protocol site needed a blog, but the best articles were already written as rich, hand-built HTML pages. Rather than force everything through a rich-text editor, the blog_articles table carries a content_type flag of either html_file or inline_html, so a post can be a reference to an uploaded HTML file or a chunk of inline HTML stored in the row. Row-level security enforces the rules at the database: a single public read policy exposes only rows where is_published is true, so unpublished drafts are invisible to the public site without any application-layer checks. The Daily Fix widget then layers on automatically refreshing content by embedding the Broken Science Initiative feed.
Release log
What we shipped.
All 8 main modules built (2 tab-based, 6 animated canvas), plus the 2 optional deep dives on Broken Science and Bayes theorem.
localStorage progress tracking wired across the learn page and every module, plus the full-screen canvas modal system for phones.
Metabolic Flexibility Assessment shipped with HOMA-IR and Triglyceride/HDL calculators and a subjective self-check.
metfixseattle.com launched on React/Vite with the booking flow, $150 consultation offer, Supabase-backed blog with RLS, and the Daily Fix widget.
The outcome
MetFix runs in production as a complete, deployed system. Gym clients can move through a real curriculum from a phone, see their progress without an account, check their own metabolic markers, and book a consultation, all inside one branded experience at metfixseattle.com (with the course also reachable via metfix.persistenceathletics.com and edu.metfixseattle.com). The architecture is deliberately boring where it should be: static single-file modules that cannot break, browser-stored progress, and a database only where one was truly needed, for the blog. The result is an education product that people actually finish and that ends, by design, at "book an appointment."
Put your business on autopilot