mike/oc-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove above-the-line / drama-triangle framework material (Inga's review)

Browse Source 
Inga's feedback: the framework focus is too much to give away on the site —
it belongs in a live session/workshop. Removed both dedicated diagram
sections (above/below the line graphic; drama->empowerment triangles) and
their IP-attribution credits. Reworded the two "How we work" cards to drop
the named models, keeping the plain-language value.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Michael Victory
2026-06-22 06:10:27 -07:00
parent 9b2ccdb865
commit 13625a8db0
1 changed files with 2 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+2 -71
View File
@@ -117,13 +117,13 @@
<article class="card"> <article class="card">
<p class="card-tag">A shared lens</p> <p class="card-tag">A shared lens</p>
<h3>A shared language</h3> <h3>A shared language</h3>
<p>In any tense moment, you're either <strong>above the line</strong> — open, curious, willing to learn — or <strong>below it</strong> — closed, defensive, out to be right. Once a team can name where they are, the hard conversations get easier overnight.</p> <p>When a conversation gets tense, people are either open and curious or closed and out to be right — and most teams have no shared way to name which is happening. We give them one. Once a team can name it, the hard conversations get easier instead of louder.</p>
<p class="outcome">A shared, plain-spoken way to handle friction.</p> <p class="outcome">A shared, plain-spoken way to handle friction.</p>
</article> </article>
<article class="card feature"> <article class="card feature">
<p class="card-tag">The core shift</p> <p class="card-tag">The core shift</p>
<h3>Breaking the blame game</h3> <h3>Breaking the blame game</h3>
<p>Every shop runs the drama triangle: someone stuck as the <strong>victim</strong>, someone <strong>persecuting</strong> and blaming, someone <strong>rescuing</strong> and burning out. It kills change. We move people into the empowered version — a <strong>creator</strong> who owns the outcome, a <strong>challenger</strong> who calls it straight, a <strong>coach</strong> who builds others up.</p> <p>Under pressure, shops fall into blame: someone stuck feeling powerless, someone doing the blaming, someone forever swooping in to rescue — and burning out. It quietly kills change. We move people out of that cycle and into owning the outcome together.</p>
<p class="outcome">Stop the blame cycles that stall every change.</p> <p class="outcome">Stop the blame cycles that stall every change.</p>
</article> </article>
<article class="card"> <article class="card">
@@ -137,75 +137,6 @@
</div> </div>
</section> </section>
<section class="band light diagram" data-bg="light">
<div class="wrap">
<p class="eyebrow">Where it starts</p>
<h2>Above the line, or <em>below it?</em></h2>
<p class="section-intro">Every hard conversation starts here. In any tense moment you're either open and curious &#8212; or closed and out to be right. Naming where you're standing is half the work.</p>
<svg class="line-graphic" viewBox="0 0 720 360" role="img" aria-labelledby="line-title line-desc">
<title id="line-title">Above and below the line</title>
<desc id="line-desc">A horizontal line divides two states. Above the line: open, curious, willing to learn &#8212; a &#8220;by me&#8221; stance. Below the line: closed, defensive, out to be right &#8212; a &#8220;to me&#8221; stance.</desc>
<rect x="0" y="0" width="720" height="180" fill="rgba(232,155,28,0.05)"/>
<rect x="0" y="180" width="720" height="180" fill="rgba(15,23,41,0.04)"/>
<path d="M345,52 L360,38 L375,52" fill="none" stroke="#c47f12" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>
<text x="360" y="92" text-anchor="middle" font-family="'DM Sans',sans-serif" font-size="19" font-weight="700" letter-spacing="2" fill="#c47f12">ABOVE THE LINE</text>
<text x="360" y="119" text-anchor="middle" font-family="'Lora',Georgia,serif" font-size="15" fill="#4a5468">Open &#183; curious &#183; willing to learn</text>
<text x="360" y="143" text-anchor="middle" font-family="'DM Sans',sans-serif" font-size="12.5" font-style="italic" fill="#9a8048">&#8220;by me&#8221; &#8212; I can shape what happens here</text>
<line x1="48" y1="180" x2="672" y2="180" stroke="#0f1729" stroke-width="2"/>
<rect x="316" y="168" width="88" height="24" fill="#f7f4ef"/>
<text x="360" y="184" text-anchor="middle" font-family="'DM Sans',sans-serif" font-size="11" letter-spacing="3" fill="#0f1729">THE LINE</text>
<text x="360" y="246" text-anchor="middle" font-family="'DM Sans',sans-serif" font-size="19" font-weight="700" letter-spacing="2" fill="#5b626d">BELOW THE LINE</text>
<text x="360" y="273" text-anchor="middle" font-family="'Lora',Georgia,serif" font-size="15" fill="#4a5468">Closed &#183; defensive &#183; out to be right</text>
<text x="360" y="297" text-anchor="middle" font-family="'DM Sans',sans-serif" font-size="12.5" font-style="italic" fill="#6b7280">&#8220;to me&#8221; &#8212; this is happening to me</text>
<path d="M345,322 L360,336 L375,322" fill="none" stroke="#5b626d" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<p class="diagram-credit">The &#8220;above / below the line&#8221; model is from The Conscious Leadership Group &#8212; Jim Dethmer, Diana Chapman &amp; Kaley Warner Klemp, <em>The 15 Commitments of Conscious Leadership</em> (2014).</p>
</div>
</section>
<section class="band light diagram" data-bg="light">
<div class="wrap">
<p class="eyebrow">The pattern underneath</p>
<h2>From drama to <em>empowerment.</em></h2>
<p class="section-intro">Not a workshop you sit through &#8212; a lens for what's happening in the room. Under pressure, people fall into three roles that stall change. The work is moving them into the three that carry it.</p>
<svg class="triangles" viewBox="0 0 760 330" role="img" aria-labelledby="tri-title tri-desc">
<title id="tri-title">From the drama triangle to the empowerment dynamic</title>
<desc id="tri-desc">Two separate triangles. On the left the drama triangle points down: Persecutor and Rescuer at the top corners, Victim at the bottom point. On the right the empowerment dynamic points up: Creator at the top point, Challenger and Coach at the bottom corners. An arrow between them marks the shift: Victim becomes Creator, Persecutor becomes Challenger, Rescuer becomes Coach.</desc>
<text x="220" y="40" text-anchor="middle" font-family="'DM Sans',sans-serif" font-size="12" font-weight="700" letter-spacing="2" fill="#5b626d">THE DRAMA TRIANGLE</text>
<text x="540" y="40" text-anchor="middle" font-family="'DM Sans',sans-serif" font-size="12" font-weight="700" letter-spacing="2" fill="#c47f12">THE EMPOWERMENT DYNAMIC</text>
<polygon points="140,105 300,105 220,270" fill="rgba(107,114,128,0.16)" stroke="#6b7280" stroke-width="1.5"/>
<g fill="#6b7280"><circle cx="140" cy="105" r="4"/><circle cx="300" cy="105" r="4"/><circle cx="220" cy="270" r="4"/></g>
<polygon points="540,105 460,270 620,270" fill="rgba(232,155,28,0.18)" stroke="#c47f12" stroke-width="1.5"/>
<g fill="#c47f12"><circle cx="540" cy="105" r="4"/><circle cx="460" cy="270" r="4"/><circle cx="620" cy="270" r="4"/></g>
<g stroke="#0f1729" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<line x1="332" y1="188" x2="424" y2="188"/>
<path d="M414,180 L426,188 L414,196"/>
</g>
<text x="378" y="171" text-anchor="middle" font-family="'DM Sans',sans-serif" font-size="10.5" font-weight="700" letter-spacing="2" fill="#c47f12">THE SHIFT</text>
<g font-family="'DM Sans',sans-serif">
<text x="140" y="84" text-anchor="middle" fill="#4a5468" font-size="13" font-weight="700" letter-spacing="0.5">PERSECUTOR</text>
<text x="140" y="98" text-anchor="middle" fill="#6b7280" font-size="10.5">blaming &#183; &#8220;I'm right&#8221;</text>
<text x="300" y="84" text-anchor="middle" fill="#4a5468" font-size="13" font-weight="700" letter-spacing="0.5">RESCUER</text>
<text x="300" y="98" text-anchor="middle" fill="#6b7280" font-size="10.5">rescuing &#183; &#8220;I'm good&#8221;</text>
<text x="220" y="292" text-anchor="middle" fill="#4a5468" font-size="13" font-weight="700" letter-spacing="0.5">VICTIM</text>
<text x="220" y="306" text-anchor="middle" fill="#6b7280" font-size="10.5">powerless &#183; &#8220;I'm blameless&#8221;</text>
<text x="540" y="84" text-anchor="middle" fill="#c47f12" font-size="13" font-weight="700" letter-spacing="0.5">CREATOR</text>
<text x="540" y="98" text-anchor="middle" fill="#6b7280" font-size="10.5">responsible &#183; visionary</text>
<text x="460" y="292" text-anchor="middle" fill="#c47f12" font-size="13" font-weight="700" letter-spacing="0.5">CHALLENGER</text>
<text x="460" y="306" text-anchor="middle" fill="#6b7280" font-size="10.5">accountable &#183; assertive</text>
<text x="620" y="292" text-anchor="middle" fill="#c47f12" font-size="13" font-weight="700" letter-spacing="0.5">COACH</text>
<text x="620" y="306" text-anchor="middle" fill="#6b7280" font-size="10.5">supportive &#183; encouraging</text>
</g>
</svg>
<ul class="shift-legend" aria-label="How each role shifts">
<li><span class="from">Victim</span> <span class="arr">&#8594;</span> <span class="to">Creator</span></li>
<li><span class="from">Persecutor</span> <span class="arr">&#8594;</span> <span class="to">Challenger</span></li>
<li><span class="from">Rescuer</span> <span class="arr">&#8594;</span> <span class="to">Coach</span></li>
</ul>
<p class="diagram-credit">The Drama Triangle is the work of Dr.&#160;Stephen Karpman (1968). The Empowerment Dynamic (TED*) is the work of David Emerald.</p>
</div>
</section>
<section class="band light who" data-bg="light" id="who"> <section class="band light who" data-bg="light" id="who">
<div class="wrap narrow"> <div class="wrap narrow">
<p class="eyebrow">Who we are</p> <p class="eyebrow">Who we are</p>