A two-round fishbowl plan with a complete workshop text and a specific worked observation

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>Fishbowl discussion · listen for a specific move</title><style>
*{box-sizing:border-box}body{margin:0;background:#f3efe7;color:#333e35;font:16px/1.6 system-ui,sans-serif}main{max-width:1060px;margin:auto;padding:28px}h1{font:700 clamp(31px,5vw,48px)/1.12 Georgia,serif;margin:12px 0 18px}h2{font-size:24px;line-height:1.3}h3{font-size:19px}p{margin:8px 0 16px}p,h1,h2,h3,label,button,dd{overflow-wrap:anywhere}div,section,article{min-width:0}.eyebrow{font-size:16px;letter-spacing:.08em;font-weight:750}.panel{background:#fffefa;border:1px solid #c1c7b3;border-radius:8px;padding:22px;margin:22px 0}.scope{background:#3e5946;color:white;padding:20px;border-radius:8px}.question{background:#e4eddf;border-left:5px solid #6c8b59;padding:16px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.roster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0}.participant{background:#ecf2e7;border-top:5px solid #688a56;padding:14px}.participant.observing{background:#f5eddf;border-color:#ad8450}.participant h3{margin:0 0 6px}.participant p{margin:0}.sequence{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:0;list-style:none}.sequence li{padding:12px;background:#eee9de;border-radius:5px}.sequence strong{display:block}.toolbar{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}button,textarea{font:inherit}button{min-height:44px;padding:10px 15px;border:1px solid #607854;border-radius:5px;background:white;color:inherit;cursor:pointer}button[aria-pressed="true"]{background:#3e5946;color:white}button:hover{box-shadow:inset 0 0 0 1px #3e5946}button:focus-visible,textarea:focus-visible{outline:3px solid #b45b24;outline-offset:3px}.exchange{border-left:4px solid #6c8b59;padding:10px 16px;background:#f0f5eb}dl{margin:0}dt{font-weight:750;margin-top:15px}dd{margin:5px 0 15px}label{display:block;font-weight:650;margin:14px 0 6px}textarea{display:block;width:100%;min-width:0;min-height:110px;padding:10px;border:1px solid #7b8c70;border-radius:4px;background:white;color:inherit;resize:vertical}.status{padding:16px;background:#fff0d8;border-left:5px solid #b38142}footer{border-top:1px solid #c1c7b3;padding-top:18px;margin-top:26px}[hidden]{display:none!important}@media(max-width:650px){main{padding:16px}.panel{padding:16px}.grid{grid-template-columns:1fr}.roster{grid-template-columns:1fr 1fr}.sequence{grid-template-columns:1fr}.toolbar button{flex:1 1 140px}}
</style></head><body><main><p class="eyebrow">ORIGINAL FICTIONAL TEACHING PLAN · A–F ARE ROLE LABELS</p><h1>Give listeners a moment to notice.</h1><p>Speakers explore one shared question. Observers record a specific response, source reference or invitation to elaborate. A planned switch gives both groups a speaking role.</p><div class="scope">No discussion or student performance is recorded here. The exchange and observer D note are authored examples. Changing a round changes planned roles, not evidence that anyone has spoken or completed work.</div>
<section class="panel" aria-labelledby="text-title"><h2 id="text-title">Shared workshop text</h2><p><strong>S1.</strong> A community workshop lasts fifty minutes: twenty minutes for an introduction, followed by thirty minutes of practice.</p><p><strong>S2.</strong> Some visitors are new to the tools, while others have used them before.</p><p><strong>S3.</strong> Printed step cards are available at every practice bench.</p><p><strong>S4.</strong> The facilitator can use all twenty introduction minutes for a demonstration, or use ten for a demonstration and ten for questions. Neither plan adds time to the workshop.</p><p class="question"><strong>Discussion question:</strong> How should the facilitator use the first twenty minutes for this mixed-experience group, and why?</p><p>Prepare one relevant text detail and a question for another speaker. Step cards can support a proposal; their availability does not establish that every visitor can use them independently.</p></section>
<section class="panel" aria-labelledby="roles-title"><h2 id="roles-title">Two rounds · the same six labels</h2><div class="toolbar" role="group" aria-label="Planned discussion round"><button id="round-1" type="button" aria-pressed="true">Round 1</button><button id="round-2" type="button" aria-pressed="false">Round 2</button></div><h3 id="selected-round">Round 1</h3><p id="round-focus"></p><div id="roster" class="roster"></div><p id="round-status" role="status" aria-live="polite">Round 1 plan shown. No participation has been marked complete.</p><div class="grid"><div class="question"><strong>Speaking task</strong><p>Refer to the shared text, respond to an earlier contribution when relevant, and make room for others.</p></div><div class="question"><strong>Observing task</strong><p>Record one response to an earlier idea and the words that show it. In this version, hold comments until the switch or debrief.</p></div></div><h3>Proposed, adjustable sequence · 23 minutes</h3><ol class="sequence"><li><strong>4 minutes</strong>Read and prepare</li><li><strong>6 minutes</strong>Round 1</li><li><strong>2 minutes</strong>Switch and review notes</li><li><strong>6 minutes</strong>Round 2</li><li><strong>5 minutes</strong>Debrief</li></ol><p>4 + 6 + 2 + 6 + 5 = 23 minutes. This is a planning example, not a tested optimum or a running timer.</p><p class="question"><strong>Accessible participation:</strong> Everyone can remain seated while the labeled speaking and observing groups change at the agreed cue. Plan accessible text and appropriate contribution methods with learners, including written contributions or supported communication. Physical movement or tapping another student is not required.</p></section>
<section class="panel" aria-labelledby="worked-title"><h2 id="worked-title">Model an observation, not a personality rating</h2><button id="worked" type="button" aria-expanded="false" aria-controls="worked-content">Read worked observation</button><div id="worked-content" hidden><div class="grid"><section><h3>Authored sample exchange</h3><div class="exchange"><p><strong>A:</strong> “I would use twenty minutes for the demonstration so new visitors can see the whole process.”</p><p><strong>B:</strong> “A wants a complete demonstration. S3 says step cards are at every bench, so I would try ten minutes of demonstration and ten for questions. The cards could support the practice afterward.”</p><p><strong>C:</strong> “What might someone new to the tools still need to ask after that shorter demonstration?”</p></div></section><section><h3>Worked note · observer D</h3><dl><dt>Moment observed</dt><dd>B's response after A proposed a full demonstration.</dd><dt>Words or reference</dt><dd>B restated A's proposal and referred to the step cards in S3.</dd><dt>Discussion move</dt><dd>Responding to an earlier idea and using a text detail to explain an alternative.</dd><dt>Question for the debrief</dt><dd>How does B's use of S3 support the shorter demonstration, and what would still need discussion?</dd></dl></section></div><p class="question">“B is a good listener” judges the person. This note identifies words and a discussion move the group can revisit. It supplies no personality label, prose grade or performance score.</p></div></section>
<section class="panel" aria-labelledby="note-title"><h2 id="note-title">Your blank observer note</h2><p>Keep an observable moment separate from your own view of the workshop proposal. These notes are not submitted through this page.</p><div class="grid"><div><label for="moment">Moment observed</label><textarea id="moment"></textarea><label for="words">Words or source reference</label><textarea id="words"></textarea></div><div><label for="move">Discussion move</label><textarea id="move"></textarea><label for="debrief">Question for the debrief</label><textarea id="debrief"></textarea></div></div><label for="ideas">Your own content ideas · separate from observation</label><textarea id="ideas"></textarea><h3>Teacher preparation still to confirm</h3><label for="access">Accessible text and agreed contribution methods</label><textarea id="access"></textarea><label for="switch-cue">Role-switch cue and unresolved preparation needs</label><textarea id="switch-cue"></textarea><div class="toolbar"><button id="reset" type="button">Clear my notes and preparation</button></div><p id="status" class="status" role="status" aria-live="polite">All seven fields start blank. Round and worked-view changes preserve your typing.</p><div id="confirmation" hidden><p>Clear all observer notes, personal ideas and teacher preparation fields? The shared text and teaching plan stay unchanged.</p><div class="toolbar"><button id="confirm-reset" type="button">Clear typed work</button><button id="keep" type="button">Keep typed work</button></div></div></section><footer>Typing is temporary in this open page; reloading clears it. Nothing is stored or submitted. Use actual classroom notes and reflections in the classroom process; this fictional model establishes no learning gain or observed student performance.</footer></main>
<script>(()=>{'use strict';const $=id=>document.getElementById(id);function round(n){$('round-1').setAttribute('aria-pressed',String(n===1));$('round-2').setAttribute('aria-pressed',String(n===2));$('selected-round').textContent='Round '+n;$('round-focus').textContent=n===1?'Focus: explore the two introduction plans using the shared text.':'Focus: consider the proposals and the reasoning heard in round 1; develop or revise a recommendation.';$('roster').replaceChildren();for(const label of ['A','B','C','D','E','F']){const first=['A','B','C'].includes(label),speaking=n===1?first:!first;const a=document.createElement('article');a.className='participant'+(speaking?'':' observing');a.id='participant-'+label;const h=document.createElement('h3');h.textContent=label;const p=document.createElement('p');p.textContent=speaking?'Speaking':'Observing';a.append(h,p);$('roster').append(a);}$('round-status').textContent='Round '+n+' plan shown. No participation has been marked complete.';}$('round-1').addEventListener('click',()=>round(1));$('round-2').addEventListener('click',()=>round(2));$('worked').addEventListener('click',()=>{const open=$('worked-content').hidden;$('worked-content').hidden=!open;$('worked').setAttribute('aria-expanded',String(open));$('worked').textContent=open?'Hide worked observation':'Read worked observation';});$('reset').addEventListener('click',()=>{$('confirmation').hidden=false;$('keep').focus();});$('keep').addEventListener('click',()=>{$('confirmation').hidden=true;$('status').textContent='Kept all your notes, ideas and preparation fields.';$('reset').focus();});$('confirm-reset').addEventListener('click',()=>{for(const field of document.querySelectorAll('textarea'))field.value='';$('confirmation').hidden=true;$('status').textContent='Your seven fields were cleared. The selected round, worked view and shared text are unchanged.';$('moment').focus();});round(1);})();</script></body></html>