Mission debrief · 01 / 03

Topicweave

Topicweave turns a website that lists what you do into one that explains what you know: one shared vocabulary in your own words ties every service, project, article and answer together, so visitors, search engines and AI assistants can follow your expertise. An optional app and a Voice Kit keep it growing, and nothing publishes without you.

Crew levelPlain-English briefings. Switch to Engineer for the technical details.
Client
Product site · self-initiated
Mission type
Website
Content system
Design system
Development
Test flight
Role
Strategist + designer + developer
Year
2026
Platform
Hand-coded · Hostinger
/mission-control · 5 channels

Mission control

Switch channels to run the real build, compare the design file to the finished site, and see it on a phone.

CAM-01 · ChannelREC00:00:00:00
Channel caption.
ChannelsKeys 1–5
Telemetry●
Frame rate--
SignalNominal
Channel1 / 5
Source--
Open the live site
/briefing

The objective

AI answers reward sites that connect the dots, and most expert sites don’t: services on one page, case studies on another, a blog nothing links to. Tracking tools can tell you you’re missing; they can’t build what’s missing. Topicweave installs the missing structure on the site you already have. Name your ideas in your own words, tag each page once, and topic pages, related reading and structured data build from those tags. An optional app reports on your topics, suggests what to write next and lets you capture ideas from your phone, with every draft waiting for your OK. Launch pricing isn’t set yet, so the site invites a few beta sites instead. This mission is that product site plus its prototypes, and a [[Test flight]].

Ten pages coded by hand after an ideation board and wireframes, sharing one look layer: data attributes on the root element pick the accent, typeface, corners and glass, so a design decision is one switch. The signature is a canvas loom: up to 1,700 threads on desktop and 620 on phones that weave the mark, then take a different shape for every section, paused offscreen and a still frame under [[Reduced motion]]. On phones, page changes knit a cloth from the link you tapped and unravel it on the next page. Four clickable prototypes (a dashboard with 17 views, a phone capture app, a CMS tagging panel and the monthly email) run on one set of sample data. No framework.

Mission parameters
    /palette · tap to copy

    Color tokens

    Six tokens run the whole system. Signal orange is the only accent.

    Display · Archivo Expanded 900Grab it.
    Body · GeistWebsites with the parts people remember.
    Mono · JetBrains MonoFrame / 510-visuals
    1280 × 872 · X 412
    ALT 38,400 km
    /systems · 6 deployed

    Systems deployed

    Open a system to see what it does, why it matters and, in Engineer mode, how it works.

    What it does

    Colored threads weave the logo, then take a new shape for every section: scattered pieces, a ring of topics, a map, a finished cloth. It’s the idea of connecting what you know, drawn.

    Why it matters
    A signature image people remember, and one that explains the product before a word is read.
    Under the hood

    One canvas, drawn by hand. The thread count follows the screen (620 on phones, up to 1,700 on desktop), the pixel budget is capped on 4K screens, it pauses offscreen and in hidden tabs, and [[Reduced motion]] gets one still frame.

    Curious how it works?

    Switch Crew level to Engineer for the technical breakdown.

    What it does

    Every page and every prototype shares one look: lilac accent, Fraunces headlines, square corners, glass panels.

    Why it matters
    The look was chosen by trying options side by side, so each choice had to stay a single switch, not a hunt through stylesheets.
    Under the hood

    The settled choices live as data attributes on the root element and one stylesheet keys off them, the same idea as [[Variables]] in Webflow. Changing the accent or the corners everywhere is one value.

    Curious how it works?

    Switch Crew level to Engineer for the technical breakdown.

    What it does

    On a phone, tapping a link knits a cloth of threads out from your finger, and the next page unravels it.

    Why it matters
    Page changes are where a phone feels cheap. This one feels like the brand.
    Under the hood

    The woven cloth repeats every four cells, so it’s one small tile drawn once and filled across every settled cell in a single call; only threads still in flight are drawn one by one. Bigger screens get a plain fade.

    Curious how it works?

    Switch Crew level to Engineer for the technical breakdown.

    What it does

    The app groups search data by the vocabulary you signed off, so you see which ideas are growing and which have no proof yet.

    Why it matters
    A wall of URLs tells an owner nothing. Their own topics do.
    Under the hood

    Seventeen dashboard views on hash routes, one shared sample data file, light and dark. The health score shows its weights on screen, so it’s never a mystery.

    Curious how it works?

    Switch Crew level to Engineer for the technical breakdown.

    What it does

    Talk for a minute on your phone. It comes back as a draft in your words, tagged, and Publish stays locked until you approve it.

    Why it matters
    The fear with AI writing is that it sounds generic and goes out on its own. The lock answers both.
    Under the hood

    The phone prototype walks record, review and publish. Approving flips the button to Publish; there is no path that skips it.

    Curious how it works?

    Switch Crew level to Engineer for the technical breakdown.

    What it does

    Tag an entry with the ideas it proves and publish: the topic page, related reading and the structured data all update from that one field.

    Why it matters
    “Tag once, linked everywhere” is abstract until you see one field turn into ten links.
    Under the hood

    The links are written into the CMS as real references, not painted on by a script. [[JSON-LD]] is built from the same tags, so what search engines read always matches the page.

    Curious how it works?

    Switch Crew level to Engineer for the technical breakdown.

    /impact · 5 problems solved

    Problems solved

    What the site does for the people who run it and the people who visit it.

    SOLVED-01For visitors

    Build what trackers only report

    Before
    AI-visibility trackers tell expert businesses they’re missing from the answers, then leave them to fix it.
    Now
    An install that builds the missing structure on the site they already have: a vocabulary, tagged pages, topic pages and structured data.
    Result
    The site gets clearer with every entry, instead of another report about why it isn’t.
    Under the hood

    Tags are native CMS references, so the links survive without any script.

    SOLVED-01For visitors

    Make the mechanism obvious

    Before
    Vocabularies, tagging and structured data sound like a developer project.
    Now
    The loom draws the idea section by section, from scattered pieces to a finished cloth, and the tag-once demo shows one field becoming ten links.
    Result
    The idea lands in seconds, with no jargon on screen.
    Under the hood

    Every section names the shape it wants; the loom reads it and re-forms as you scroll.

    SOLVED-01For visitors

    Keep it in their voice

    Before
    Owners expect AI drafts to sound generic, and worry something will publish without them.
    Now
    A Voice Kit filled in about 15 minutes from their own writing and a short recording, and a review queue where Publish stays locked until they approve.
    Result
    Drafts start from their own sentences, and they stay the author.
    Under the hood

    Every piece moves Draft → In review → Approved; zero auto-publishing is the rule, not a setting.

    SOLVED-01For visitors

    Earn trust by not overselling

    Before
    Most “get found by AI” pitches promise rankings and citations nobody can guarantee.
    Now
    “AI visibility, honestly”: two signals shown as signals, sample data labeled in every prototype, and no promised outcomes.
    Result
    The site reads like the expert, not the salesperson.
    Under the hood

    No logos, testimonials, customer counts or rankings anywhere; every simulated screen says so.

    SOLVED-01For visitors

    A beta instead of a guess

    Before
    Launch pricing isn’t set, and a price list would have been a guess.
    Now
    A beta: a few sites get the install now, by hand, far below the launch price, for honest feedback. Every call to action says Join the beta, and a public roadmap shows what’s coming.
    Result
    Early sites get a fair deal, and the product meets real sites before it launches.
    Under the hood

    Pricing shows the packages with TBD and a time calculator, so the value is clear before the price is.

    /manifest · what shipped

    Mission manifest

    Everything this mission delivered, planned and mocked up first, then built from the ground up.

    0 / 0 pages shipped · hover a tile

    Every page, designed then built

    A static site that uploads anywhere, plus four clickable prototypes on one set of sample data, ready to become the real app.

    Mission · planet
    Role

    Strategist + designer + developer

    Platform · Year

    CMS collections

    0 collections

      Mission type

      0 disciplines

      Drag the tags
      Mission parameters

      All met

        Status

        Live

        Self-initiated identity

        ↗
        /telemetry

        By the numbers

        30

        terms: your expertise, in your own words, signed off by you

        –60
        6

        categories hold the whole vocabulary

        10

        minutes to fill the Voice Kit, so every AI draft starts in your voice

        –15
        12

        a month saved by editing your own CMS instead of emailing a developer

        hrs
        /stack · 0 tools

        Tools in orbit

        Every tool this mission ran on. Pull one out of orbit and let go; it finds its way back.

        Hover a tool

        Tools in orbit

        /observatory · from this mission

        Observations from this mission