FlashFXDocumentation
Ctrl+K
Landing Page
Documentation is work in progress and not completeEditor
29 sections · 6 groups

FlashCC

FlashCC turns a written post into a social carousel, and then keeps the record of how that carousel did. Two halves, and the split matters: the editor is a Photoshop-style canvas that makes the artwork, and the pipeline is what happens after — schedule it, mark it posted, type the numbers in, and find out which structural choices actually worked.

What follows is the full reference: what the app is, how each part works, and where the bodies are buried. It is written from the source rather than from memory, and where the code and its own comments disagree that is noted rather than smoothed over — section 29 collects the lot.

Start with section 1 — What it is

Orientation

What the product is, how to run it, and the rules it is built on.

  1. 01What it isFlashCC turns a written post into a social carousel and keeps the record of how that carousel performed.
  2. 02Running itThe dev commands, the two ports, the Vite proxy that removes the need for CORS, and why no configuration is an error state.
  3. 03The invariantsFive rules the codebase is built on: nothing is derived, presets run once, one painter, pure modules stay DOM-free, and two colour systems never mix.

The canvas

The document model and the editor that manipulates it.

  1. 04The data modelDoc, Slide and Layer in artboard pixels — array order is z-order, and framework and styleId are stamped once so analytics can attribute performance.
  2. 05The canvasFour nested elements, artboard-space hit testing, cursor-anchored zoom, the tool and drag modes, snapping, keyboard and snapshot history.
  3. 06Text measurement and fittingThe per-character advance table, greedy wrapping with pre-wrap semantics, and the size ladder that fits text to its box without ever clamping.
  4. 07Colour and contrastWhy inversion is not contrast, the WCAG maths, the softened poles, and the 168-point sweep that proves bestText always clears 4.5:1.
  5. 08GradientsGradients are stored as data rather than a CSS string, and each layer kind renders one differently — with two that ignore gradients entirely.
  6. 09Changing format (reflow)Why proportional scaling is the wrong answer to a format change, and the split rule reflow.ts uses instead.

Making a deck

Everything between a blank brief and a finished carousel.

  1. 10The four frameworksProblem, Showcase, Educational and Story — the slot structures that are the product’s core IP, and the tests that police their writing.
  2. 11GenerationbuildSlides runs once and returns plain layers — the geometry constants, how a composition is chosen, and what each of the eight compositions produces.
  3. 12Styles and themesFifteen styles — ten flat and five gradient — and the contrast tests each has to clear, including bg-on-accent for the CTA block.
  4. 13OnboardingFive questions stored under flashcc:v3:prefs, and why a custom ground can never produce an unreadable deck.
  5. 14AI draftingThe key lives on the server and never reaches the bundle — the request flow, the system prompt constraints, and the two-pass slot alignment.
  6. 15Bulk createThree dashes separate carousels, a blank line separates slides — and the parsing rules that stop an em dash in prose from splitting a deck.
  7. 16Media and fontsThe 24-image pool and its re-encoding rules, and the six-font upload cap with namespaced families.
  8. 17Screen flowThe eight screens from welcome to studio, where the document is actually minted, and the deliberate delays.

The product

What happens after the artwork is finished.

  1. 18The pipelineA Post is not a Doc — the structural snapshot is copied at creation so the version that earned the numbers is the one that went out.
  2. 19AnalyticsEverything is a ratio against the median of your own recent posts, and six dimensions of attribution derived from data already stored.
  3. 20The librarySearch runs over a flattened blob written at save time, matching is AND not OR, and facets are derived rather than entered.
  4. 21ExportWhat each platform does to a deck after upload, the pre-flight rules, and why export renders through headless Chromium rather than a canvas library.

Infrastructure

Storage, sync, accounts, billing, the schema and the tokens.

  1. 22PersistenceThe localStorage keys, and the two load-bearing distinctions: saveDoc vs putDoc, and deleteDoc vs dropDoc.
  2. 23SyncLast write wins on the record’s own updatedAt, deletion competes on the same terms as an edit, and the pull is deliberately full rather than incremental.
  3. 24AuthMagic link only, an origin-pinned redirect, and why the profile row is created by the client rather than a trigger.
  4. 25BillingThe browser can only ask for a Checkout link; entitlement is decided by a signature-verified webhook reading raw bytes.
  5. 26DatabaseThree tables keyed on (user_id, id), two timestamps for a reason, and the column-level GRANT that is the actual paywall.
  6. 27Design tokensThe surface ladder, white-alpha lines, hierarchy by value step, and the transition rule that makes hover 0ms on purpose.
  7. 28Testing296 tests across 17 files, written as design guards — several encode an argument that would otherwise be lost.

Reality check

What is known to be wrong, ordered by consequence.

  1. 29Known defectsTwenty defects found by reading the code, ordered by consequence. None are fixed — D1 is the most consequential.

Looking for FlashFX?

FlashCC is a separate app. The motion and animation editor is documented under the Editor tab.

FlashFX editor documentation