OpenClaw Bot
136 lines
7.4 KiB
HTML
136 lines
7.4 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<meta name="theme-color" content="#f3eee4" />
|
||
<meta name="rank-version" content="2.3.0-prioritix" />
|
||
<title>Ranker / Prioritix — sort the messy layer inside an idea</title>
|
||
<link rel="stylesheet" href="/styles.css?v=2.3.0-prioritix" />
|
||
</head>
|
||
<body>
|
||
<main class="page-shell">
|
||
<section class="hero" aria-labelledby="hero-title">
|
||
<nav class="topline" aria-label="Ranker navigation">
|
||
<a class="brand" href="#top" aria-label="Ranker home"><span>R</span>Ranker</a>
|
||
<div class="nav-links">
|
||
<a href="#try">Try it</a>
|
||
<a href="#proof">Output</a>
|
||
<a href="#why">Why</a>
|
||
</div>
|
||
</nav>
|
||
|
||
<div class="hero-grid" id="top">
|
||
<div class="hero-copy">
|
||
<p class="eyebrow">Prioritix for ideas: features, validation, feedback, risks, audiences, and next moves</p>
|
||
<h1 id="hero-title">Sort the messy layer inside an idea.</h1>
|
||
<p class="lede">Ranker / Prioritix takes the piece of an idea that needs ordering — features, functionality, validation questions, feedback themes, risks, experiments, or audiences — and returns a defended next-step map.</p>
|
||
<div class="hero-actions">
|
||
<a class="button primary" href="#try">Sort an idea layer</a>
|
||
<button class="button ghost" type="button" id="loadSampleTop">Load sample</button>
|
||
</div>
|
||
<div class="promise-row" aria-label="What Ranker returns">
|
||
<span>Do first</span>
|
||
<span>Validate next</span>
|
||
<span>Park safely</span>
|
||
<span>Expert reflections</span>
|
||
</div>
|
||
</div>
|
||
|
||
<article class="artifact-card" aria-label="Sample ranked feedback map">
|
||
<div class="artifact-head">
|
||
<span>Ranked Feedback Map</span>
|
||
<b>Fastest useful progress</b>
|
||
</div>
|
||
<ol class="mini-ranking">
|
||
<li><strong>Manual offer critique</strong><small>High signal, easy to test, clear buyer pain.</small></li>
|
||
<li><strong>Pricing calculator</strong><small>Useful, but generic unless paired with judgement.</small></li>
|
||
<li><strong>Client dashboard</strong><small>Park it. Too much machinery before proof.</small></li>
|
||
</ol>
|
||
<div class="mini-brief">
|
||
<strong>Pattern noticed</strong>
|
||
<p>Your strongest wedge is judgement, not automation. Test whether people want their offer criticized before building a platform around it.</p>
|
||
</div>
|
||
</article>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="decision-tool" id="try" aria-labelledby="try-title">
|
||
<div class="tool-intro">
|
||
<p class="eyebrow">MVP · idea-layer sorting · no account · no dashboard swamp</p>
|
||
<h2 id="try-title">Send the messy idea layer to Prioritix</h2>
|
||
<p>Paste the rough idea plus the layer you need sorted: features, functions, validation questions, feedback themes, risks, audiences, experiments, possible next moves, or a raw Scattermind Concept Map JSON export. Ranker will extract sortable items when it can; use the optional box only if you already have a cleaner list.</p>
|
||
</div>
|
||
|
||
<form class="rank-form" id="rankForm">
|
||
<label>
|
||
<span>Paste the idea + messy layer / Concept Map JSON <b>required</b></span>
|
||
<textarea name="idea" rows="8" required placeholder="Example: I’m building a tool that helps freelancers package their services and decide what to sell first. Maybe offer critique, pricing calculator, proposal generator, landing page copywriter, client persona mapper, and some kind of dashboard later? I only have a week and want the fastest useful proof.
|
||
|
||
Or paste a Scattermind Concept Map JSON object here; Ranker will preserve source provenance and extract the build order."></textarea>
|
||
</label>
|
||
|
||
<label>
|
||
<span>Sortable items, if you want to separate them <em>optional</em></span>
|
||
<textarea name="optionsText" rows="7" placeholder="Optional. One per line is easiest, but bullets and half-thoughts are fine.
|
||
Validation questions:
|
||
- Will freelancers pay for critique before software?
|
||
- Which offer type hurts enough to buy help?
|
||
Feedback themes:
|
||
- They want templates
|
||
- They distrust generic AI copy
|
||
Features:
|
||
- Offer critique
|
||
- Pricing calculator"></textarea>
|
||
</label>
|
||
|
||
<fieldset class="mode-picker">
|
||
<legend>What should the judgement optimize for?</legend>
|
||
<label><input type="radio" name="mode" value="progress" checked /> <span>Fastest useful progress</span></label>
|
||
<label><input type="radio" name="mode" value="mvp" /> <span>Best MVP order</span></label>
|
||
<label><input type="radio" name="mode" value="validation" /> <span>Fastest validation</span></label>
|
||
<label><input type="radio" name="mode" value="revenue" /> <span>Revenue potential</span></label>
|
||
<label><input type="radio" name="mode" value="risk" /> <span>Safest proof order</span></label>
|
||
<label><input type="radio" name="mode" value="learning" /> <span>Biggest assumption test</span></label>
|
||
<label><input type="radio" name="mode" value="originality" /> <span>Most original</span></label>
|
||
</fieldset>
|
||
|
||
<label>
|
||
<span>Constraints the feedback should respect <em>optional</em></span>
|
||
<input name="context" placeholder="Example: one week, solo builder, no paid ads, must be useful on mobile" />
|
||
</label>
|
||
|
||
<div class="form-actions">
|
||
<button class="button primary" type="submit">Create Prioritix map</button>
|
||
<button class="button ghost" type="button" id="loadSample">Use sample</button>
|
||
</div>
|
||
</form>
|
||
</section>
|
||
|
||
<section class="results" id="results" aria-live="polite" hidden></section>
|
||
|
||
<section class="proof-section" id="proof" aria-labelledby="proof-title">
|
||
<div>
|
||
<p class="eyebrow">The artifact</p>
|
||
<h2 id="proof-title">A decision brief, not a vibes table.</h2>
|
||
</div>
|
||
<div class="proof-grid">
|
||
<article><strong>Ranked order</strong><p>Clear first-pass order with do / test / defer / park labels.</p></article>
|
||
<article><strong>Reason per item</strong><p>Every option gets a plain-language reason and concern.</p></article>
|
||
<article><strong>Expert reflections</strong><p>Product expert, scattermind simplifier, and structured operator lenses.</p></article>
|
||
<article><strong>Next 48 hours</strong><p>The output ends with a concrete move instead of more thinking fog.</p></article>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="why-section" id="why" aria-labelledby="why-title">
|
||
<p class="eyebrow">Positioning</p>
|
||
<h2 id="why-title">Scattermind evaluates one idea. Ranker / Prioritix sorts the layer that needs order.</h2>
|
||
<p>Sometimes that layer is features. Sometimes it is validation questions, feedback, risks, audiences, claims, experiments, or next moves. The point is not “features first”; the point is a defensible order before more development.</p>
|
||
</section>
|
||
</main>
|
||
|
||
<div class="toast" id="toast" hidden></div>
|
||
<script src="/app.js?v=2.3.0-prioritix" type="module"></script>
|
||
</body>
|
||
</html>
|