Interactive Demos

Content Tools, Built in React

Ten interactive components that demonstrate content operations as infrastructure. Every demo runs client-side. The React is the content.

10
Live Demos
4
New Components
0
External APIs
20
Anti-Slop Rules
Featured Tool

Anti-Slop Detector

Paste any text and score it against 20 anti-slop rules. Corporate filler words, passive voice, and vague openers get flagged in real time. The full version includes educational breakdowns of each violation type.

Try the full Anti-Slop Detector →
100
maximum slop
can your content pass?
VOICE TOOLS

Core Demos

Demos 01-06: Core content infrastructure

ALL DEMOS

Full Showcase

All 10 interactive components

CORE DEMOS
// 01 — TERMINAL BOOT SEQUENCE

the aios-image aesthetic rendered as a live React component. every content image starts from this design system.

Shawn AI/os command
// 02 — HOOK STYLE SWITCHER

same topic, five different openers. hook style is a content operation — you choose it, you don't discover it.

what if your content strategy was a git repo?
why it works: Opens with curiosity. Forces the reader to answer internally before scrolling.
// 03 — CONTENT PIPELINE

content moves through stages, not steps. each stage is a transformation with its own rules and output format.

Idea
Draft
Voice
Format
Publish
[idea] raw thought captured in daily log
// 04 — PALETTE EXPLORER

three color schemas mapped to content types. each palette is infrastructure, not decoration.

$ content generate --palette=terminal
[OK] palette loaded: Terminal
primary: #4EC373
accent: #D2A53C
// Technical content, system outputs, boot sequences
bg #0D0D0D
primary #4EC373
secondary #C9D1D9
accent #D2A53C
muted #484F58
// 05 — VOICE DNA TRANSFORM

voice normalization is a content operation. it takes generic AI output and applies your voice DNA rules.

BEFORE — AI DEFAULT
In today's fast-paced digital landscape, leveraging AI tools for content creation has become essential for modern marketers looking to scale their operations.
AFTER — VOICE DNA
most people use AI to write faster. I use it to build systems that write themselves.
remove corporate fillerlowercase openerfirst person, not thirdspecific > vague
// 06 — POST ANATOMY

a LinkedIn post is five sections, not one blob. click any section label to see why it works.

[HOOK]
I mass-deleted 200 contacts from my CRM last week.
[TENSION]
they were leads I'd been nurturing for 6 months. zero replies. zero opens. zero signal. but every CRM dashboard said "pipeline healthy" because the count was high.
[INSIGHT]
here's what nobody tells you about outbound: a big list isn't a pipeline. a sent email isn't a touchpoint. a "maybe" isn't a lead. vanity metrics in your CRM are the content equivalent of follower count.
[PROOF]
after the purge: • reply rate went from 2% to 11% • booked meetings doubled • pipeline value actually went up fewer leads. better leads. same effort.
[CTA]
your CRM is lying to you. go delete something. shawn ⚡ the gtme alchemist 🧙‍♂️
click a section label in the post to see the annotation
ADVANCED DEMOS
// 07 — CONTENT PILLAR MAP

six content pillars, each with its own cadence, platform, and format. click any pillar to expand. this is the editorial calendar as infrastructure.

[primary]
Building + Sharing
3-4x per week
[gtm-workflows]
Plays Series
1x per week
[tools-frameworks]
Skill/System Shares
2x per week
[engagement]
GTM Memes
2-3x per week
[x-native]
Micro-Tips
daily
[substack]
Newsletter
1x per week
// 08 — RECURSIVE CONTENT LOOP

one insight becomes five pieces of content. same idea, different format, different platform. click any branch to see the transformation rules.

one insight
LI
LinkedIn Post
X
X Thread
SS
Substack Essay
TT
TikTok Script
IMG
Image Asset
// 09 — ANTI-SLOP DETECTOR

paste any text and see it scored against 20 anti-slop rules. corporate filler words, passive voice, and vague openers get flagged in real time. lower score = cleaner copy.

100
maximum slop
slop score (0-100, lower = better)
INPUT TEXT (type or paste below):
CORPORATE FILLER (19 found):
"innovative" "new""cutting-edge" "modern""revolutionize" "change""seamless" "smooth""comprehensive" "complete""robust" "strong""synergy" "collaboration""empower" "help""utilize" "use""streamline" "simplify""paradigm" "model""ecosystem" "system""stakeholders" "people involved""best-in-class" "top""disruptive" "different""scalable" "growable""value-add" "useful""game-changer" "big shift""thought leader" "person who writes"
PASSIVE VOICE (2 found):
"has been""will be"
VAGUE OPENERS (3 found):
"In today's""It's no secret""As we all know"
corporate filler (8pts each)
passive voice (6pts each)
vague opener (10pts each)
try the full version →
// 10 — PLATFORM FORMATTER

one block of raw content, four platform-native outputs. click each tab to see how the same content adapts — different format, same voice.

platform: LinkedIn
chars: 808
limit: 3,000 chars
I built a content system that takes one draft and turns it into posts for four platforms. Here's how it works: 1. Write one raw draft in markdown — just the core idea, no formatting. 2. Run it through the voice normalizer — removes corporate filler, applies lowercase style, adds specific numbers. 3. The formatter splits it into platform-specific outputs: LinkedIn gets the long-form with hashtags, X gets a compressed thread, Substack gets the deep-dive with headers, TikTok gets a 60-second script with timestamps. The whole pipeline runs from a single git push. No content calendar. No scheduling tool. No copy-pasting between tabs. Three files. Four platforms. Zero manual formatting. The system is the content strategy. --- #ContentOS #ContentStrategy #BuildInPublic #GTMEngineering #AIContent
LINKEDIN FORMAT RULES:
Hook in first two lines (above the fold)
Short paragraphs with line breaks for readability
Bullet points for scannable lists
3-5 hashtags at the bottom
Sign-off with identity marker
ShawnOS.ai|theGTMOS.ai|theContentOS.ai