Publish business-plans hub + Essay Helper plan + PDF
This commit is contained in:
parent
57b97f4aa3
commit
a189196eef
Binary file not shown.
|
|
@ -0,0 +1,585 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Essay Helper — Business Case</title>
|
||||
<style>
|
||||
:root {
|
||||
--paper: #f4f2ec;
|
||||
--paper-raised: #fffefb;
|
||||
--ink: #1d2028;
|
||||
--ink-soft: #5c616e;
|
||||
--indigo: #333e8f;
|
||||
--indigo-deep: #212a5e;
|
||||
--indigo-tint: #ebedf8;
|
||||
--gold: #9a6a12;
|
||||
--gold-tint: #f3ecdc;
|
||||
--good: #2e6b53;
|
||||
--line: #ded9cd;
|
||||
--line-soft: #e8e4d9;
|
||||
--shadow: 0 1px 2px rgba(29, 32, 40, .05), 0 10px 30px rgba(29, 32, 40, .07);
|
||||
|
||||
--serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
|
||||
--sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
--mono: "SF Mono", "JetBrains Mono", ui-monospace, "Menlo", "Consolas", monospace;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--paper: #15171c;
|
||||
--paper-raised: #1e212a;
|
||||
--ink: #ece9e2;
|
||||
--ink-soft: #9aa0ae;
|
||||
--indigo: #98a2ef;
|
||||
--indigo-deep: #bcc3f7;
|
||||
--indigo-tint: #242a44;
|
||||
--gold: #d7a44c;
|
||||
--gold-tint: #2c2718;
|
||||
--good: #6bbd97;
|
||||
--line: #2f333f;
|
||||
--line-soft: #262a34;
|
||||
--shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 12px 32px rgba(0, 0, 0, .34);
|
||||
}
|
||||
}
|
||||
:root[data-theme="light"] {
|
||||
--paper: #f4f2ec; --paper-raised: #fffefb; --ink: #1d2028; --ink-soft: #5c616e;
|
||||
--indigo: #333e8f; --indigo-deep: #212a5e; --indigo-tint: #ebedf8; --gold: #9a6a12;
|
||||
--gold-tint: #f3ecdc; --good: #2e6b53; --line: #ded9cd; --line-soft: #e8e4d9;
|
||||
--shadow: 0 1px 2px rgba(29,32,40,.05), 0 10px 30px rgba(29,32,40,.07);
|
||||
}
|
||||
:root[data-theme="dark"] {
|
||||
--paper: #15171c; --paper-raised: #1e212a; --ink: #ece9e2; --ink-soft: #9aa0ae;
|
||||
--indigo: #98a2ef; --indigo-deep: #bcc3f7; --indigo-tint: #242a44; --gold: #d7a44c;
|
||||
--gold-tint: #2c2718; --good: #6bbd97; --line: #2f333f; --line-soft: #262a34;
|
||||
--shadow: 0 1px 2px rgba(0,0,0,.4), 0 12px 32px rgba(0,0,0,.34);
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
html { -webkit-text-size-adjust: 100%; }
|
||||
body {
|
||||
margin: 0;
|
||||
background: var(--paper);
|
||||
color: var(--ink);
|
||||
font-family: var(--sans);
|
||||
font-size: 17px;
|
||||
line-height: 1.6;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-rendering: optimizeLegibility;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.wrap { max-width: 1060px; margin: 0 auto; padding: 0 28px; }
|
||||
.doc { max-width: 720px; }
|
||||
|
||||
/* ---- Spine / margin-note grid ---- */
|
||||
.rule {
|
||||
padding: 60px 0;
|
||||
border-top: 1px solid var(--line);
|
||||
}
|
||||
.rule:first-of-type { border-top: none; }
|
||||
.marginal {
|
||||
display: grid;
|
||||
grid-template-columns: 168px minmax(0, 1fr);
|
||||
gap: 34px;
|
||||
align-items: start;
|
||||
}
|
||||
.note {
|
||||
font-family: var(--serif);
|
||||
font-style: italic;
|
||||
font-size: 15px;
|
||||
line-height: 1.45;
|
||||
color: var(--indigo);
|
||||
padding-left: 14px;
|
||||
border-left: 2px solid var(--indigo);
|
||||
position: sticky;
|
||||
top: 28px;
|
||||
}
|
||||
.note b { font-style: normal; font-weight: 600; display: block; color: var(--ink-soft); font-family: var(--sans); font-size: 11px; letter-spacing: .13em; text-transform: uppercase; margin-bottom: 7px; }
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.marginal { grid-template-columns: 1fr; gap: 16px; }
|
||||
.note { position: static; border-left: none; padding-left: 0; border-top: 2px solid var(--indigo); padding-top: 10px; }
|
||||
}
|
||||
|
||||
/* ---- Type ---- */
|
||||
h1, h2, h3 { font-family: var(--serif); font-weight: 600; text-wrap: balance; letter-spacing: -.01em; }
|
||||
.eyebrow {
|
||||
font-family: var(--sans);
|
||||
font-size: 11.5px;
|
||||
font-weight: 700;
|
||||
letter-spacing: .18em;
|
||||
text-transform: uppercase;
|
||||
color: var(--indigo);
|
||||
}
|
||||
.section-h { font-size: 30px; line-height: 1.15; margin: 0 0 6px; }
|
||||
.lede { font-size: 20px; line-height: 1.5; color: var(--ink); font-family: var(--serif); }
|
||||
p { margin: 0 0 16px; }
|
||||
.doc p:last-child { margin-bottom: 0; }
|
||||
strong { font-weight: 650; }
|
||||
em.q { font-family: var(--serif); font-style: italic; color: var(--indigo); }
|
||||
|
||||
/* ---- Hero ---- */
|
||||
.hero {
|
||||
padding: 64px 0 54px;
|
||||
position: relative;
|
||||
}
|
||||
.hero::after {
|
||||
content: "";
|
||||
position: absolute; left: 28px; right: 28px; bottom: 0; height: 1px;
|
||||
background: linear-gradient(90deg, var(--indigo), transparent 62%);
|
||||
}
|
||||
.brandline { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 26px; }
|
||||
.mark { font-family: var(--serif); color: var(--indigo); font-size: 22px; }
|
||||
.kicker { font-family: var(--sans); font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft); }
|
||||
.kicker .conf { color: var(--gold); }
|
||||
h1.title { font-size: clamp(46px, 8vw, 82px); line-height: .98; margin: 0 0 20px; letter-spacing: -.025em; }
|
||||
h1.title em { font-style: italic; color: var(--indigo); }
|
||||
.thesis {
|
||||
font-family: var(--serif);
|
||||
font-size: clamp(21px, 3.2vw, 29px);
|
||||
line-height: 1.32;
|
||||
max-width: 20ch;
|
||||
margin: 0 0 26px;
|
||||
}
|
||||
.thesis .u { color: var(--indigo); font-style: italic; }
|
||||
.sub { font-size: 18px; color: var(--ink-soft); max-width: 54ch; margin: 0 0 30px; }
|
||||
|
||||
.chips { display: flex; flex-wrap: wrap; gap: 9px; }
|
||||
.chip {
|
||||
font-family: var(--mono);
|
||||
font-size: 12px;
|
||||
letter-spacing: .01em;
|
||||
padding: 6px 11px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid var(--line);
|
||||
background: var(--paper-raised);
|
||||
color: var(--ink-soft);
|
||||
display: inline-flex; align-items: center; gap: 7px;
|
||||
}
|
||||
.chip .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--good); }
|
||||
.chip.hero-chip { border-color: color-mix(in srgb, var(--indigo) 40%, var(--line)); color: var(--ink); }
|
||||
|
||||
/* ---- Metrics band ---- */
|
||||
.band {
|
||||
background: var(--indigo-deep);
|
||||
color: #f3f2ee;
|
||||
padding: 44px 0;
|
||||
}
|
||||
:root[data-theme="dark"] .band, .band { color: #f3f2ee; }
|
||||
.band .eyebrow { color: color-mix(in srgb, #fff 78%, var(--indigo)); }
|
||||
.metrics {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 30px 24px;
|
||||
margin-top: 22px;
|
||||
}
|
||||
.metric .n {
|
||||
font-family: var(--mono);
|
||||
font-variant-numeric: tabular-nums;
|
||||
font-size: clamp(32px, 4.6vw, 46px);
|
||||
font-weight: 600;
|
||||
line-height: 1;
|
||||
color: #fff;
|
||||
letter-spacing: -.02em;
|
||||
}
|
||||
.metric .n .u { font-size: .5em; color: color-mix(in srgb, #fff 68%, var(--indigo)); margin-left: 4px; }
|
||||
.metric .l { font-size: 13.5px; line-height: 1.4; margin-top: 9px; color: color-mix(in srgb, #fff 74%, var(--indigo-deep)); }
|
||||
@media (max-width: 620px) { .metrics { grid-template-columns: repeat(2, 1fr); } }
|
||||
|
||||
/* ---- Problem cards ---- */
|
||||
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 6px; }
|
||||
@media (max-width: 760px) { .cards { grid-template-columns: 1fr; } }
|
||||
.card {
|
||||
background: var(--paper-raised);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 12px;
|
||||
padding: 22px 20px;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
.card .cn { font-family: var(--mono); font-size: 12px; color: var(--indigo); letter-spacing: .05em; }
|
||||
.card h3 { font-size: 20px; margin: 12px 0 8px; line-height: 1.2; }
|
||||
.card p { font-size: 15px; color: var(--ink-soft); margin: 0; line-height: 1.55; }
|
||||
|
||||
/* ---- How it works ---- */
|
||||
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 8px; counter-reset: s; }
|
||||
@media (max-width: 760px) { .steps { grid-template-columns: 1fr; } }
|
||||
.step { position: relative; padding-top: 40px; }
|
||||
.step::before {
|
||||
counter-increment: s;
|
||||
content: counter(s);
|
||||
position: absolute; top: 0; left: 0;
|
||||
width: 30px; height: 30px; border-radius: 50%;
|
||||
background: var(--indigo); color: #fff;
|
||||
font-family: var(--mono); font-size: 14px; font-weight: 600;
|
||||
display: grid; place-items: center;
|
||||
}
|
||||
.step h3 { font-size: 17px; margin: 0 0 6px; }
|
||||
.step p { font-size: 15px; color: var(--ink-soft); margin: 0; }
|
||||
|
||||
/* ---- Moat / feature list ---- */
|
||||
.feat { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; margin-top: 8px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--line); }
|
||||
@media (max-width: 700px) { .feat { grid-template-columns: 1fr; } }
|
||||
.fitem { background: var(--paper-raised); padding: 20px; }
|
||||
.fitem h3 { font-size: 17px; margin: 0 0 6px; display: flex; align-items: baseline; gap: 9px; }
|
||||
.fitem h3 .fm { font-family: var(--serif); color: var(--indigo); font-style: italic; }
|
||||
.fitem p { font-size: 14.5px; color: var(--ink-soft); margin: 0; line-height: 1.55; }
|
||||
|
||||
.keystone {
|
||||
background: var(--indigo-tint);
|
||||
border: 1px solid color-mix(in srgb, var(--indigo) 30%, var(--line));
|
||||
border-radius: 14px;
|
||||
padding: 28px 26px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.keystone .eyebrow { color: var(--indigo); }
|
||||
.keystone h3 { font-size: 24px; margin: 10px 0 10px; line-height: 1.2; }
|
||||
.keystone p { font-size: 16px; margin: 0; color: var(--ink); max-width: 60ch; }
|
||||
.keystone .proof {
|
||||
margin-top: 18px; padding-top: 16px; border-top: 1px dashed color-mix(in srgb, var(--indigo) 40%, var(--line));
|
||||
font-family: var(--mono); font-size: 13px; color: var(--ink-soft); line-height: 1.7;
|
||||
}
|
||||
.keystone .proof b { color: var(--indigo); font-weight: 600; }
|
||||
|
||||
/* ---- Comparison table ---- */
|
||||
.tablewrap { overflow-x: auto; margin-top: 8px; border: 1px solid var(--line); border-radius: 12px; }
|
||||
table { border-collapse: collapse; width: 100%; min-width: 640px; font-size: 14.5px; }
|
||||
thead th { background: var(--paper-raised); }
|
||||
th, td { text-align: left; padding: 13px 15px; border-bottom: 1px solid var(--line-soft); }
|
||||
th:first-child, td:first-child { position: sticky; left: 0; background: var(--paper-raised); font-weight: 500; color: var(--ink); min-width: 210px; }
|
||||
thead th { font-family: var(--sans); font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-soft); font-weight: 700; white-space: nowrap; }
|
||||
thead th.us { color: var(--indigo); }
|
||||
tbody tr:last-child td { border-bottom: none; }
|
||||
td.c { text-align: center; font-family: var(--mono); }
|
||||
.yes { color: var(--good); font-weight: 700; }
|
||||
.no { color: color-mix(in srgb, var(--gold) 80%, var(--ink)); }
|
||||
.part { color: var(--ink-soft); }
|
||||
col.uscol { background: var(--indigo-tint); }
|
||||
|
||||
/* ---- Roadmap ---- */
|
||||
.timeline { margin-top: 8px; border-left: 2px solid var(--line); }
|
||||
.phase { position: relative; padding: 0 0 26px 26px; }
|
||||
.phase:last-child { padding-bottom: 0; }
|
||||
.phase::before {
|
||||
content: ""; position: absolute; left: -7px; top: 4px;
|
||||
width: 12px; height: 12px; border-radius: 50%;
|
||||
background: var(--paper); border: 2px solid var(--indigo);
|
||||
}
|
||||
.phase.now::before { background: var(--indigo); }
|
||||
.phase .when { font-family: var(--mono); font-size: 12px; letter-spacing: .04em; color: var(--indigo); text-transform: uppercase; }
|
||||
.phase h3 { font-size: 18px; margin: 4px 0 5px; }
|
||||
.phase p { font-size: 15px; color: var(--ink-soft); margin: 0; }
|
||||
.tag-now { font-family: var(--mono); font-size: 10.5px; color: var(--good); border: 1px solid color-mix(in srgb, var(--good) 45%, var(--line)); border-radius: 999px; padding: 2px 8px; margin-left: 8px; vertical-align: middle; text-transform: uppercase; letter-spacing: .06em; }
|
||||
|
||||
/* ---- Pricing ---- */
|
||||
.tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 8px; }
|
||||
@media (max-width: 760px) { .tiers { grid-template-columns: 1fr; } }
|
||||
.tier { background: var(--paper-raised); border: 1px solid var(--line); border-radius: 12px; padding: 22px; box-shadow: var(--shadow); }
|
||||
.tier.hl { border-color: var(--indigo); box-shadow: 0 0 0 1px var(--indigo), var(--shadow); }
|
||||
.tier .tn { font-family: var(--sans); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft); }
|
||||
.tier.hl .tn { color: var(--indigo); }
|
||||
.tier .tp { font-family: var(--serif); font-size: 26px; margin: 10px 0 4px; }
|
||||
.tier .tp span { font-size: 14px; color: var(--ink-soft); font-family: var(--sans); }
|
||||
.tier ul { margin: 14px 0 0; padding: 0; list-style: none; }
|
||||
.tier li { font-size: 14px; color: var(--ink-soft); padding: 5px 0 5px 20px; position: relative; }
|
||||
.tier li::before { content: "✎"; position: absolute; left: 0; color: var(--indigo); font-family: var(--serif); }
|
||||
|
||||
/* ---- Risks ---- */
|
||||
.risks { display: grid; gap: 12px; margin-top: 8px; }
|
||||
.risk { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; background: var(--paper-raised); border: 1px solid var(--line); border-radius: 10px; padding: 16px 18px; }
|
||||
@media (max-width: 700px) { .risk { grid-template-columns: 1fr; gap: 6px; } }
|
||||
.risk .r { font-weight: 600; font-size: 15px; }
|
||||
.risk .m { font-size: 14.5px; color: var(--ink-soft); }
|
||||
.risk .m b { color: var(--good); font-weight: 600; }
|
||||
|
||||
/* ---- Ask / CTA ---- */
|
||||
.ask { background: var(--indigo-deep); color: #f4f3ef; border-radius: 16px; padding: 40px 34px; margin-top: 8px; }
|
||||
.ask h2 { color: #fff; font-size: 28px; margin: 6px 0 12px; }
|
||||
.ask p { color: color-mix(in srgb, #fff 80%, var(--indigo)); max-width: 56ch; font-size: 16px; }
|
||||
.ask .eyebrow { color: color-mix(in srgb, #fff 74%, var(--indigo)); }
|
||||
.asks { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
|
||||
.asks .a { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); border-radius: 10px; padding: 12px 15px; font-size: 14.5px; color: #fff; }
|
||||
.asks .a b { display: block; font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: color-mix(in srgb, #fff 72%, var(--indigo)); margin-bottom: 3px; }
|
||||
|
||||
footer { padding: 40px 0 64px; border-top: 1px solid var(--line); }
|
||||
.foot-note { font-size: 12.5px; color: var(--ink-soft); line-height: 1.6; max-width: 78ch; }
|
||||
.foot-note b { color: var(--ink); font-weight: 600; }
|
||||
|
||||
:focus-visible { outline: 2px solid var(--indigo); outline-offset: 3px; border-radius: 3px; }
|
||||
|
||||
.reveal { opacity: 0; transform: translateY(14px); transition: opacity .7s ease, transform .7s ease; }
|
||||
.reveal.in { opacity: 1; transform: none; }
|
||||
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } }
|
||||
|
||||
/* ---- Print / Save-as-PDF: a clean, self-contained document to email or attach ---- */
|
||||
@media print {
|
||||
/* Force the light palette so the PDF is legible regardless of the viewer's theme. */
|
||||
:root, :root[data-theme="dark"], :root[data-theme="light"] {
|
||||
--paper: #ffffff; --paper-raised: #ffffff; --ink: #1d2028; --ink-soft: #555966;
|
||||
--indigo: #2f3a86; --indigo-deep: #212a5e; --indigo-tint: #eceef8; --gold: #8a5f10;
|
||||
--good: #2e6b53; --line: #d8d3c6; --line-soft: #e7e3d8; --shadow: none;
|
||||
}
|
||||
* { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
body { font-size: 12.5px; }
|
||||
/* Reveal everything — the on-scroll animation must never hide print content. */
|
||||
.reveal { opacity: 1 !important; transform: none !important; }
|
||||
.note { position: static; }
|
||||
.hero { padding: 8px 0 20px; }
|
||||
h1.title { font-size: 52px; }
|
||||
.thesis { font-size: 22px; }
|
||||
.rule { padding: 22px 0; }
|
||||
.band, .ask { border-radius: 0; }
|
||||
/* Keep coherent blocks whole across page breaks. */
|
||||
.card, .fitem, .step, .metric, .keystone, .risk, .tier, .phase, .ask, .marginal, tr { break-inside: avoid; }
|
||||
thead { display: table-header-group; }
|
||||
section.rule, .band { break-inside: auto; }
|
||||
a { color: var(--indigo); text-decoration: none; }
|
||||
}
|
||||
</style>
|
||||
|
||||
<header class="hero">
|
||||
<div class="wrap">
|
||||
<div class="brandline">
|
||||
<span class="mark">✎</span>
|
||||
<span class="kicker">Business Case · <span class="conf">Confidential</span> · 2026</span>
|
||||
</div>
|
||||
<h1 class="title">Essay <em>Helper</em></h1>
|
||||
<p class="thesis">The AI writing coach that <span class="u">never invents a source.</span></p>
|
||||
<p class="sub">A trustworthy writing tutor that lives inside Microsoft Word — it reviews a student's draft, coaches their citations, and leaves feedback in the margin, without ever fabricating a fact or doing the thinking for them.</p>
|
||||
<div class="chips">
|
||||
<span class="chip hero-chip"><span class="dot"></span> Shipped · v1.4</span>
|
||||
<span class="chip">155 tests green</span>
|
||||
<span class="chip">Live model-safety evals passing</span>
|
||||
<span class="chip">Working software, not a concept</span>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap marginal reveal">
|
||||
<aside class="note"><b>The one line</b>Feedback at the scale of AI, with the integrity of a good teacher.</aside>
|
||||
<div class="doc">
|
||||
<p class="lede">Every student needs a patient reader who will tell them where their argument is thin and where a claim needs a source. Almost none of them get one in time. Generic AI fills the gap — but it hallucinates facts, invents citations, and quietly writes the essay for them, which is worse than no help at all.</p>
|
||||
<p><strong>Essay Helper is the alternative built for education specifically:</strong> an AI coach that is architecturally incapable of inventing a source, that coaches instead of ghost-writing, and that meets students where they already write. It is built, tested, and shipped today.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap marginal reveal">
|
||||
<aside class="note"><b>The problem</b>Three failures sit between a student and honest, timely feedback.</aside>
|
||||
<div class="doc">
|
||||
<h2 class="section-h">Good feedback doesn't scale. Bad AI does.</h2>
|
||||
<p class="sub" style="max-width:58ch">The tools students actually reach for are the ones least suited to learning.</p>
|
||||
<div class="cards">
|
||||
<div class="card">
|
||||
<div class="cn">01</div>
|
||||
<h3>Teachers can't be everywhere</h3>
|
||||
<p>One instructor, thirty drafts, one week. Substantive, per-paragraph feedback on argument and evidence simply doesn't fit the hours available.</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="cn">02</div>
|
||||
<h3>Generic AI makes things up</h3>
|
||||
<p>Ask a chatbot to check a citation and it will happily invent an author, a year, a page number. In academic work, a fabricated source isn't a bug — it's misconduct.</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="cn">03</div>
|
||||
<h3>Or it just does the work</h3>
|
||||
<p>The path of least resistance is "write my essay." That trades a grade for the learning, and leaves institutions fighting an integrity crisis instead of teaching.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap marginal reveal">
|
||||
<aside class="note"><b>What it is</b>It opens in the pane beside the document and works on the real draft.</aside>
|
||||
<div class="doc">
|
||||
<h2 class="section-h">A coach in the margin of the page</h2>
|
||||
<p>Essay Helper is a Microsoft 365 Word add-in. The student describes the assignment in a short chat, picks how they want to be coached, and hits <em class="q">Review</em>. It reads the whole draft and leaves comments anchored to the exact sentences that need them — the same place a teacher's pen would land.</p>
|
||||
<div class="steps">
|
||||
<div class="step"><h3>Understand the assignment</h3><p>A quick conversation captures the prompt, level, and rubric — and whether it's an essay, worksheet, lab report, or reflection.</p></div>
|
||||
<div class="step"><h3>Review the draft</h3><p>It flags weak arguments, unsupported claims, and citation problems — anchored to the sentence, in the document.</p></div>
|
||||
<div class="step"><h3>Coach, don't ghost-write</h3><p>Depending on the mode, it asks the guiding question, gives the mechanical fix, or — in Corrections mode — answers directly and labels exactly where the answer came from.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="band">
|
||||
<div class="wrap reveal">
|
||||
<div class="eyebrow">Where we are today</div>
|
||||
<div class="metrics">
|
||||
<div class="metric"><div class="n">0</div><div class="l">Sources ever invented — guaranteed by construction, not by a prompt</div></div>
|
||||
<div class="metric"><div class="n">155<span class="u">✓</span></div><div class="l">Automated tests green, plus live model-safety evals passing</div></div>
|
||||
<div class="metric"><div class="n">6</div><div class="l">Coaching modes, from Socratic to direct answers</div></div>
|
||||
<div class="metric"><div class="n">5</div><div class="l">Assignment types the review adapts itself to</div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap marginal reveal">
|
||||
<aside class="note"><b>Why it wins</b>The guarantee is a property of the code, so it can't be jailbroken away.</aside>
|
||||
<div class="doc">
|
||||
<h2 class="section-h">The moat is trust — and it's built in</h2>
|
||||
<div class="keystone">
|
||||
<div class="eyebrow">The core guarantee</div>
|
||||
<h3>It never invents a source.</h3>
|
||||
<p>Most AI safety is a polite request in a prompt that a clever user can talk around. Ours isn't. A separate validation layer inspects every citation the model produces and <strong>drops any that don't point to a source the student actually supplied</strong> — before it ever reaches the page. The promise holds even if the model misbehaves.</p>
|
||||
<div class="proof"><b>How it holds:</b> answers live in plain comments; citations travel a separate, validated channel. The model can offer an answer from its own knowledge — clearly tagged <em class="q">"verify this"</em> — but it can never manufacture a <b>source</b>. That boundary is covered by automated tests and by live evals run against the real model.</div>
|
||||
</div>
|
||||
<div class="feat">
|
||||
<div class="fitem"><h3><span class="fm">Aa</span> Adapts to the assignment</h3><p>An essay is judged on thesis and evidence; a worksheet on grounded answers; a lab report by its sections. One tool, the right expectations.</p></div>
|
||||
<div class="fitem"><h3><span class="fm">✎</span> Coaches, in six stances</h3><p>Socratic, mechanics-only, editor, critical, encouraging — and Corrections mode, which answers directly and tags every answer's provenance.</p></div>
|
||||
<div class="fitem"><h3><span class="fm">“”</span> Honest by design</h3><p>It labels an own-knowledge answer versus a grounded one, and every screen carries the reminder: <em class="q">double-check answers — this tool can be wrong.</em></p></div>
|
||||
<div class="fitem"><h3><span class="fm">↳</span> In the flow of writing</h3><p>No new app to learn. It works in Word, where the draft already lives — comments land on the sentence, feedback survives across sessions.</p></div>
|
||||
<div class="fitem"><h3><span class="fm">§</span> Private by architecture</h3><p>The AI key and every model call stay on the server. The student's add-in never carries a secret, and never talks to the model directly.</p></div>
|
||||
<div class="fitem"><h3><span class="fm">↔</span> Portable core</h3><p>The engine is separated from Word by design — the same reviewer can front a Google Docs or web client with no change to the guarantee.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap marginal reveal">
|
||||
<aside class="note"><b>The field</b>Everyone does one job. Essay Helper is the only one doing this one.</aside>
|
||||
<div class="doc">
|
||||
<h2 class="section-h">No one else coaches <em style="font-style:italic;color:var(--indigo)">and</em> stays honest</h2>
|
||||
<div class="tablewrap">
|
||||
<table>
|
||||
<colgroup><col><col class="uscol"><col><col><col><col></colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th> </th>
|
||||
<th class="us">Essay Helper</th>
|
||||
<th>Grammarly</th>
|
||||
<th>Generic AI chat</th>
|
||||
<th>Turnitin</th>
|
||||
<th>Human TA</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>Feedback on argument & evidence</td><td class="c"><span class="yes">●</span></td><td class="c"><span class="no">○</span></td><td class="c"><span class="yes">●</span></td><td class="c"><span class="no">○</span></td><td class="c"><span class="yes">●</span></td></tr>
|
||||
<tr><td>Coaches without writing it for them</td><td class="c"><span class="yes">●</span></td><td class="c"><span class="part">◐</span></td><td class="c"><span class="no">○</span></td><td class="c"><span class="no">○</span></td><td class="c"><span class="yes">●</span></td></tr>
|
||||
<tr><td>Never invents sources or facts</td><td class="c"><span class="yes">●</span></td><td class="c"><span class="part">—</span></td><td class="c"><span class="no">○</span></td><td class="c"><span class="part">—</span></td><td class="c"><span class="yes">●</span></td></tr>
|
||||
<tr><td>Works inside the document</td><td class="c"><span class="yes">●</span></td><td class="c"><span class="yes">●</span></td><td class="c"><span class="no">○</span></td><td class="c"><span class="no">○</span></td><td class="c"><span class="part">◐</span></td></tr>
|
||||
<tr><td>Respects academic integrity</td><td class="c"><span class="yes">●</span></td><td class="c"><span class="part">◐</span></td><td class="c"><span class="no">○</span></td><td class="c"><span class="yes">●</span></td><td class="c"><span class="yes">●</span></td></tr>
|
||||
<tr><td>Available 24/7, at scale</td><td class="c"><span class="yes">●</span></td><td class="c"><span class="yes">●</span></td><td class="c"><span class="yes">●</span></td><td class="c"><span class="yes">●</span></td><td class="c"><span class="no">○</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<p style="font-family:var(--mono);font-size:12px;color:var(--ink-soft);margin-top:12px">● full ◐ partial ○ no — not applicable</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap marginal reveal">
|
||||
<aside class="note"><b>Why now</b>The demand and the fear arrived in the same year.</aside>
|
||||
<div class="doc">
|
||||
<h2 class="section-h">A market that just became urgent</h2>
|
||||
<p>Generative AI went from novelty to default in classrooms in under two years. Institutions now face the same question at every level: <strong>how do we let students use AI without letting it fabricate, plagiarize, or replace the learning?</strong> The tools on offer are either general-purpose chatbots with none of those guardrails, or plagiarism <em>detectors</em> that police students rather than help them.</p>
|
||||
<p>Essay Helper is positioned exactly in that gap — an AI that administrators can approve <em>because</em> of how it's built. The buyer (a department, school, or university) is actively shopping for a safe, aligned writing tool, and there is no incumbent that both coaches and guarantees integrity.</p>
|
||||
<div class="cards" style="margin-top:22px">
|
||||
<div class="card"><div class="cn">Reach</div><h3>Hundreds of millions</h3><p>of students write assignments in Word or Docs every term — the surface the product already runs on.</p></div>
|
||||
<div class="card"><div class="cn">Timing</div><h3>Mainstream, now</h3><p>AI use in coursework is no longer fringe; policy and procurement are catching up fast.</p></div>
|
||||
<div class="card"><div class="cn">Gap</div><h3>No safe incumbent</h3><p>Coaching tools ignore integrity; integrity tools ignore coaching. We do both.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap marginal reveal">
|
||||
<aside class="note"><b>How it earns</b>Free for the student; licensed by the institution that needs the guarantee.</aside>
|
||||
<div class="doc">
|
||||
<h2 class="section-h">Business model</h2>
|
||||
<p class="sub" style="max-width:58ch">Land with individual students; expand to the institutions that need a tool they can sanction. Figures below are an illustrative starting model.</p>
|
||||
<div class="tiers">
|
||||
<div class="tier">
|
||||
<div class="tn">Student · Free</div>
|
||||
<div class="tp">$0</div>
|
||||
<ul><li>Core review in Word</li><li>A few reviews a month</li><li>Socratic & mechanics coaching</li></ul>
|
||||
</div>
|
||||
<div class="tier hl">
|
||||
<div class="tn">Pro</div>
|
||||
<div class="tp">$8<span> / student / mo</span></div>
|
||||
<ul><li>Unlimited reviews</li><li>All six coaching modes</li><li>Corrections & conciseness controls</li></ul>
|
||||
</div>
|
||||
<div class="tier">
|
||||
<div class="tn">Institution</div>
|
||||
<div class="tp">Site license</div>
|
||||
<ul><li>Per-seat or per-FTE pricing</li><li>Admin controls & SSO</li><li>Teacher-facing analytics</li></ul>
|
||||
</div>
|
||||
</div>
|
||||
<p style="font-size:14px;color:var(--ink-soft);margin-top:16px">The institutional license is the revenue engine: it's sold on the one thing individuals can't buy elsewhere — a writing AI the institution can <em>vouch for</em>.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap marginal reveal">
|
||||
<aside class="note"><b>What's next</b>The hard part — a shipped, safe engine — is already done.</aside>
|
||||
<div class="doc">
|
||||
<h2 class="section-h">Roadmap</h2>
|
||||
<div class="timeline">
|
||||
<div class="phase now"><div class="when">Shipped</div><h3>The product, live<span class="tag-now">Done</span></h3><p>In-Word review, citation coaching, six modes, five assignment types, Corrections mode, conciseness controls, the no-fabrication guarantee, and the honesty disclaimer — all built, tested, and merged.</p></div>
|
||||
<div class="phase"><div class="when">Next</div><h3>History-aware review</h3><p>Compare a draft against its earlier versions — praise real revision, catch regressions, and coach the arc of the writing, not just the snapshot.</p></div>
|
||||
<div class="phase"><div class="when">Then</div><h3>Google Docs & teacher analytics</h3><p>Bring the same guaranteed engine to Docs (the core is already client-agnostic), and give instructors a view of where their class struggles.</p></div>
|
||||
<div class="phase"><div class="when">Later</div><h3>Institutional platform</h3><p>Rostering & LMS integration, admin dashboards, more citation styles and languages — the surface a site license is sold on.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap marginal reveal">
|
||||
<aside class="note"><b>Clear-eyed</b>The real risks, and why each is already contained.</aside>
|
||||
<div class="doc">
|
||||
<h2 class="section-h">Risks & mitigations</h2>
|
||||
<div class="risks">
|
||||
<div class="risk"><div class="r">The model drifts or misbehaves over time.</div><div class="m"><b>Contained:</b> the citation guarantee is a code-level validator, not a prompt, and behavior is gated by live evals against the real model before anything ships.</div></div>
|
||||
<div class="risk"><div class="r">Dependence on the Microsoft Word platform.</div><div class="m"><b>Contained:</b> the reviewing engine is deliberately separated from the Word client — the same core can serve Docs or web with the guarantee intact.</div></div>
|
||||
<div class="risk"><div class="r">Institutions are slow, cautious buyers.</div><div class="m"><b>Turned into an edge:</b> caution is exactly why they'll choose the tool built to be safe. We land free with students while the institutional sale matures.</div></div>
|
||||
<div class="risk"><div class="r">"Isn't this just ChatGPT?"</div><div class="m"><b>Answered by the demo:</b> ask both to check a citation. One invents an author; ours refuses and asks for the real one. The difference is the product.</div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="rule">
|
||||
<div class="wrap reveal">
|
||||
<div class="ask">
|
||||
<div class="eyebrow">The ask</div>
|
||||
<h2>Let's put it in front of real students</h2>
|
||||
<p>The engineering risk is behind us — the product is built, safe, and shipped. What it needs now is a first classroom and a short runway to the next surface. Three things unlock the next stage:</p>
|
||||
<div class="asks">
|
||||
<div class="a"><b>Greenlight</b>A pilot with 2–3 design-partner classes this term</div>
|
||||
<div class="a"><b>Focus</b>A short push to Google Docs + teacher analytics</div>
|
||||
<div class="a"><b>Backing</b>Support to court the first institutional buyer</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
<div class="wrap">
|
||||
<p class="foot-note"><b>About this document.</b> Every product, architecture, and engineering claim reflects the current, shipped codebase (Essay Helper v1.4): the no-fabrication validation layer, the six coaching modes and five assignment types, the 155 passing automated tests, and the live model-safety evals. <b>Market sizing, pricing, and financial figures are illustrative planning assumptions</b> for discussion — not audited data or forecasts. Prepared as an internal business case · Confidential.</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
(function () {
|
||||
var els = document.querySelectorAll('.reveal');
|
||||
if (!('IntersectionObserver' in window)) { els.forEach(function (e) { e.classList.add('in'); }); return; }
|
||||
var io = new IntersectionObserver(function (entries) {
|
||||
entries.forEach(function (en) { if (en.isIntersecting) { en.target.classList.add('in'); io.unobserve(en.target); } });
|
||||
}, { threshold: 0.12 });
|
||||
els.forEach(function (e) { io.observe(e); });
|
||||
})();
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,101 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Business Plans & Pitches — Zoe Cross</title>
|
||||
<style>
|
||||
:root {
|
||||
--paper: #f4f2ec; --paper-raised: #fffefb; --ink: #1d2028; --ink-soft: #5c616e;
|
||||
--indigo: #333e8f; --indigo-deep: #212a5e; --indigo-tint: #ebedf8; --gold: #9a6a12;
|
||||
--good: #2e6b53; --line: #ded9cd; --shadow: 0 1px 2px rgba(29,32,40,.05), 0 12px 32px rgba(29,32,40,.08);
|
||||
--serif: "Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
|
||||
--sans: system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
|
||||
--mono: "SF Mono","JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root { --paper:#15171c; --paper-raised:#1e212a; --ink:#ece9e2; --ink-soft:#9aa0ae;
|
||||
--indigo:#98a2ef; --indigo-deep:#20264a; --indigo-tint:#242a44; --gold:#d7a44c;
|
||||
--good:#6bbd97; --line:#2f333f; --shadow:0 1px 2px rgba(0,0,0,.4), 0 14px 34px rgba(0,0,0,.36); }
|
||||
}
|
||||
* { box-sizing: border-box; }
|
||||
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans);
|
||||
font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
|
||||
.wrap { max-width: 900px; margin: 0 auto; padding: 0 26px; }
|
||||
header.top { padding: 72px 0 34px; position: relative; }
|
||||
header.top::after { content:""; position:absolute; left:26px; right:26px; bottom:0; height:1px;
|
||||
background: linear-gradient(90deg, var(--indigo), transparent 60%); }
|
||||
.kicker { font-size:12px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--indigo); display:flex; align-items:center; gap:9px; }
|
||||
.kicker .mk { font-family:var(--serif); font-size:18px; }
|
||||
h1 { font-family:var(--serif); font-weight:600; font-size: clamp(38px, 6.5vw, 60px); line-height:1.02; letter-spacing:-.02em; margin:18px 0 12px; }
|
||||
h1 em { font-style:italic; color:var(--indigo); }
|
||||
.sub { font-size:18px; color:var(--ink-soft); max-width:60ch; margin:0; }
|
||||
.meta-line { margin-top:16px; font-family:var(--mono); font-size:12.5px; color:var(--ink-soft); display:flex; gap:16px; flex-wrap:wrap; }
|
||||
.meta-line b { color:var(--ink); font-weight:600; }
|
||||
|
||||
.list { padding: 30px 0 20px; display:flex; flex-direction:column; gap:16px; }
|
||||
.entry { display:grid; grid-template-columns: 1fr auto; gap:16px 20px; align-items:center;
|
||||
background:var(--paper-raised); border:1px solid var(--line); border-radius:14px; padding:22px 24px; box-shadow:var(--shadow); }
|
||||
@media (max-width:640px){ .entry { grid-template-columns:1fr; } }
|
||||
.entry .body { min-width:0; }
|
||||
.tags { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:9px; }
|
||||
.tag { font-family:var(--mono); font-size:11px; letter-spacing:.03em; padding:3px 9px; border-radius:999px; border:1px solid var(--line); color:var(--ink-soft); }
|
||||
.tag.type { color:var(--indigo); border-color:color-mix(in srgb, var(--indigo) 34%, var(--line)); }
|
||||
.tag.live { color:var(--good); border-color:color-mix(in srgb, var(--good) 40%, var(--line)); display:inline-flex; align-items:center; gap:6px; }
|
||||
.tag.live .dot { width:6px; height:6px; border-radius:50%; background:var(--good); }
|
||||
.entry h2 { font-family:var(--serif); font-weight:600; font-size:24px; line-height:1.15; margin:0 0 5px; letter-spacing:-.01em; }
|
||||
.entry p { margin:0; font-size:15px; color:var(--ink-soft); line-height:1.5; }
|
||||
.entry .updated { margin-top:9px; font-family:var(--mono); font-size:11.5px; color:var(--ink-soft); }
|
||||
.actions { display:flex; gap:10px; align-items:center; }
|
||||
@media (max-width:640px){ .actions { justify-content:flex-start; } }
|
||||
.btn { font-family:var(--sans); font-size:14px; font-weight:600; text-decoration:none; border-radius:9px; padding:10px 15px; white-space:nowrap; display:inline-flex; align-items:center; gap:7px; transition:background .15s ease, color .15s ease, border-color .15s ease; }
|
||||
.btn.open { background:var(--indigo); color:#fff; border:1px solid var(--indigo); }
|
||||
.btn.open:hover { background:var(--indigo-deep); }
|
||||
.btn.pdf { background:transparent; color:var(--indigo); border:1px solid color-mix(in srgb,var(--indigo) 45%,var(--line)); }
|
||||
.btn.pdf:hover { background:var(--indigo-tint); }
|
||||
|
||||
footer { padding: 30px 0 70px; border-top:1px solid var(--line); margin-top:14px; }
|
||||
.foot { font-size:13px; color:var(--ink-soft); line-height:1.6; }
|
||||
a:focus-visible, .btn:focus-visible { outline:2px solid var(--indigo); outline-offset:3px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header class="top">
|
||||
<div class="wrap">
|
||||
<div class="kicker"><span class="mk">✎</span> Zoe Cross · Living Index</div>
|
||||
<h1>Business Plans <em>&</em> Pitches</h1>
|
||||
<p class="sub">Every plan and pitch, in one place — always the current version, each with its live page and a PDF to attach or print.</p>
|
||||
<div class="meta-line"><span><b>1</b> document</span><span>Updated <b>27 Aug 2026</b></span><span>zoe-pitches.mosaic.site</span></div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="wrap">
|
||||
<div class="list">
|
||||
|
||||
<article class="entry">
|
||||
<div class="body">
|
||||
<div class="tags">
|
||||
<span class="tag type">Business Plan</span>
|
||||
<span class="tag">EdTech · AI</span>
|
||||
<span class="tag live"><span class="dot"></span> Live</span>
|
||||
</div>
|
||||
<h2>Essay Helper</h2>
|
||||
<p>The AI writing coach that never invents a source — problem, product, moat, market, model, roadmap, and the ask. Built on shipped, tested software.</p>
|
||||
<div class="updated">Updated 27 Aug 2026</div>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<a class="btn open" href="./essay-helper/">Open →</a>
|
||||
<a class="btn pdf" href="./essay-helper/Essay-Helper-Business-Case.pdf">PDF ↓</a>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="wrap">
|
||||
<p class="foot">Confidential — internal planning documents. Product and engineering claims reflect current work; market and financial figures are illustrative planning assumptions.</p>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue