Compare two market frames with the same offer brief and identify the unsupported storage expectation

HTML for this example

Select the code and use your copy shortcut. Changes in this preview are temporary.

<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>ClearCaption · category expectation check</title><style>*{box-sizing:border-box}body{margin:0;background:#f5f0f6;color:#4d3b50;font:16px/1.55 system-ui,sans-serif}main{max-width:960px;margin:auto;padding:24px}h1{font-size:34px;line-height:1.16}h2{font-size:24px}h3{font-size:19px}.eyebrow{letter-spacing:.06em;color:#8b6d8b}.card{padding:20px;margin:18px 0;background:white;border:1px solid #d7c5d7;border-radius:6px}.brief{background:#f1edf7;border-left:6px solid #8d72a1}.tabs{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}button,textarea{font:inherit;color:inherit}button{min-height:44px;padding:10px 14px;border:1px solid #97799d;background:white;border-radius:4px;cursor:pointer}button[aria-pressed=true]{background:#805985;color:white}button:focus-visible,textarea:focus-visible{outline:3px solid #b77527;outline-offset:3px}.expectation{background:#fff7e6;border-left:6px solid #bc9141}.evidence{background:#eef5ef;border-left:6px solid #809e85}label{display:block;font-weight:650;margin:14px 0 6px}textarea{width:100%;min-width:0;max-width:100%;min-height:95px;padding:10px;border:1px solid #ac94b0;border-radius:4px;resize:vertical}.copy p{white-space:pre-wrap;overflow-wrap:anywhere}#status{font-weight:650;color:#80531c}footer{margin:24px 0;color:#866e87}[hidden]{display:none!important}@media(max-width:560px){main{padding:12px}h1{font-size:28px}.card{padding:14px}}</style></head><body><main><p class="eyebrow">FICTIONAL CLEARCAPTION SERVICE · PROVISIONAL POSITIONING</p><h1>What promise does this category make?</h1><section class="card brief"><h2>The exact supplied service brief</h2><p>ClearCaption reviews caption/source-file consistency and supplies a discrepancy list.</p><p><strong>Excluded scope:</strong> it does not store collections or edit images.</p><p>This supports an offered capability. It does not establish superiority, uniqueness, customer findings or a quantified effect.</p></section><section class="card expectation"><h2>Compare category expectations</h2><div class="tabs"><button id="category-a" type="button" aria-pressed="true">A · digital asset management platform</button><button id="category-b" type="button" aria-pressed="false">B · caption consistency review service</button></div><h3 id="category-title">A · digital asset management platform</h3><p id="expectation">Exercise expectation: searchable asset storage and a place to manage a collection.</p><p id="scope-check">Conflict: the supplied brief explicitly excludes collection storage. This frame creates an unsupported storage expectation.</p><p id="category-question">Which expectations would a buyer attach to this frame that the service cannot deliver?</p></section><section class="card evidence"><h2>Follow the positioning record</h2><div class="tabs"><button id="customer" type="button" aria-pressed="true">Customer context</button><button id="alternatives" type="button" aria-pressed="false">Alternatives</button><button id="capability" type="button" aria-pressed="false">Capability</button><button id="value" type="button" aria-pressed="false">Potential value</button><button id="category" type="button" aria-pressed="false">Category</button></div><h3 id="record-title">Customer context · hypothesis</h3><p id="record">Small collection teams reconciling captions before an exhibition.</p><p id="record-evidence">Target hypothesis only. Ask who faces this problem and how they describe it.</p></section><button id="description" type="button" aria-expanded="false" aria-controls="description-view">Read the scope-grounded working description</button><section id="description-view" class="card" hidden><h2>Working description, not a validated position</h2><p>ClearCaption is a caption consistency review service for collection teams preparing exhibition handoffs. It checks captions against supplied source files and returns a discrepancy list for the team to review.</p><p>No proven segment, measured reduction, market leadership or tagline result is claimed. Investigate intended buyers' understanding before treating the frame as settled.</p></section><section class="card"><h2>Your offer and expectation review</h2><div id="fields"></div><div class="tabs"><button id="build" type="button">Build positioning review</button><button id="reset" type="button">Reset typed work</button></div><p id="status" role="status"></p><section id="confirm" hidden><h3>Clear all ten positioning fields?</h3><div class="tabs"><button id="keep" type="button">Keep my record</button><button id="clear" type="button">Clear typed record</button></div></section><section id="review" class="card copy" hidden><h3>Your supplied positioning record</h3><div id="copy"></div><p>Working hypotheses and expectation questions only. No automatic fit judgment, market winner or customer validation has been generated.</p></section></section><footer>Temporary positioning notes only. No fabricated research or saved market record. Method reference: April Dunford's positioning approach; example and layout are original.</footer></main><script>'use strict';const $=id=>document.getElementById(id);for(const id of ['a','b'])$('category-'+id).addEventListener('click',()=>{const a=id==='a';$('category-a').setAttribute('aria-pressed',String(a));$('category-b').setAttribute('aria-pressed',String(!a));$('category-title').textContent=a?'A · digital asset management platform':'B · caption consistency review service';$('expectation').textContent=a?'Exercise expectation: searchable asset storage and a place to manage a collection.':'Exercise expectation: review captions against supplied source files and return discrepancies.';$('scope-check').textContent=a?'Conflict: the supplied brief explicitly excludes collection storage. This frame creates an unsupported storage expectation.':'Closer match to the supplied review scope. This does not establish customer understanding, a validated segment or superiority.';$('category-question').textContent=a?'Which expectations would a buyer attach to this frame that the service cannot deliver?':'Would intended collection teams understand this review task and recognize its relevance?';});const records={customer:['Customer context · hypothesis','Small collection teams reconciling captions before an exhibition.','Target hypothesis only. Ask who faces this problem and how they describe it.'],alternatives:['Alternatives · unresearched hypotheses','Manual spreadsheet checking or copyediting.','Ask what actual buyers would do without this service. Adjacent businesses are not automatically buyer alternatives.'],capability:['Capability · supported by fictional brief','Caption/source-file consistency review with a discrepancy list.','Offered capability is supported by the supplied brief; differentiation and uniqueness against alternatives are unresearched.'],value:['Potential value · hypothesis','Fewer unresolved caption/source mismatches at handoff.','No measured effect or guarantee. Investigate whether the capability creates value in the buyer’s actual situation.'],category:['Category · scope-based candidate','Caption consistency review service.','Closer to the supplied scope than storage platform; intended customer understanding still needs investigation.']};for(const[id,row]of Object.entries(records))$(id).addEventListener('click',()=>{for(const key of Object.keys(records))$(key).setAttribute('aria-pressed',String(id===key));for(const[i,target]of ['record-title','record','record-evidence'].entries())$(target).textContent=row[i];});$('description').addEventListener('click',()=>{const open=$('description-view').hidden;$('description-view').hidden=!open;$('description').setAttribute('aria-expanded',String(open));});const fields=[['offer','Actual offer and supported capabilities · required'],['excluded','Excluded scope'],['evidence','Capability evidence and source'],['context','Customer-context hypothesis'],['own-alternatives','Alternatives with sources or unresearched labels'],['potential','Potential customer value and uncertainty'],['own-a','Category candidate A and possible expectations'],['own-b','Category candidate B and possible expectations'],['check','Expectation versus actual scope questions'],['next','Next buyer research question']];for(const[id,label]of fields){const l=document.createElement('label'),t=document.createElement('textarea');l.htmlFor=id;l.textContent=label;t.id=id;t.addEventListener('input',()=>{$('review').hidden=true;$('status').textContent='Positioning notes changed. Build again to review current words.';});$('fields').append(l,t);}$('build').addEventListener('click',()=>{$('review').hidden=true;if(!$('offer').value.trim()){$('status').textContent='Complete: actual offer and supported capabilities.';return;}$('copy').replaceChildren();for(const[id,title]of fields){const h=document.createElement('h3'),p=document.createElement('p');h.textContent=title;p.textContent=$(id).value.trim()||'Not supplied.';$('copy').append(h,p);}$('review').hidden=false;$('status').textContent='Positioning review assembled from supplied words.';});$('reset').addEventListener('click',()=>{$('confirm').hidden=false;$('keep').focus();});$('keep').addEventListener('click',()=>{$('confirm').hidden=true;$('reset').focus();});$('clear').addEventListener('click',()=>{for(const[id]of fields)$(id).value='';$('review').hidden=true;$('confirm').hidden=true;$('status').textContent='Ten positioning fields cleared. Worked service brief and selected category unchanged.';$('offer').focus();});</script></body></html>