Urteilsintensive Entscheidungen
Verwenden Sie es, wenn mehrere Optionen vertretbar sind, aber jede unterschiedliche betriebliche Konsequenzen hat.
Design Lab-Muster
Decision Tradeoff Visualizer
Ein wiederverwendbares Interaktionsmuster, das Lernenden hilft, plausible Entscheidungen zu vergleichen, indem gezeigt wird, wie jede Wahl Geschwindigkeit, Klarheit, Risiko, Vertrauen und Aufwand beeinflusst.
Sichtbare Konsequenzen
Lernende sehen Trade-offs, anstatt eine einfache richtige oder falsche Antwort zu erhalten.
HTML/CSS/JS
Funktioniert als eigenständige Web-Interaktion, eingebettete Ressource, Rise-Block oder Storyline-Webobjekt.
Warum dieses Muster existiert
Die meisten Entscheidungen am Arbeitsplatz sind keine klaren Multiple-Choice-Momente.
In der realen Arbeit wählen Menschen oft zwischen Optionen, die alle einigermaßen vernünftig sind. Eine Wahl kann schnell, aber riskant sein. Eine andere kann Vertrauen aufbauen, erfordert aber mehr Aufwand. Eine weitere kann Unsicherheit verringern, aber den Workflow verlangsamen.
Der Decision Tradeoff Visualizer verwandelt diese Spannung in den Lernmoment. Anstatt den Lernenden zu sagen, ob sie richtig oder falsch waren, hilft er ihnen zu sehen, was sich durch ihre Entscheidung ändert.
Live-Vorschau
Wählen Sie eine Antwort und vergleichen Sie die Trade-offs.
Szenario: Ein Lieferpartner berichtet, dass die App-Anweisungen unklar sind, bevor er eine zeitkritische Route startet. Sie müssen entscheiden, welchen Unterstützungsweg Sie empfehlen.
Szenario
Unterstützungsentscheidung
Was würden Sie zuerst empfehlen?
Die Person ist bereit zu starten, aber sie ist sich unsicher, welche App-Anweisung gilt. Der Weg ist zeitkritisch, und Raten könnte zu Verwirrung führen.
Ausgewogene Wahl
Klärung vor Handlung
Diese Wahl fügt eine kleine Pause hinzu, verbessert jedoch die Klarheit und verringert das Risiko, basierend auf der falschen Annahme Anweisungen zu geben.
Geschwindigkeit
68
Klarheit
92
Risikokontrolle
86
Vertrauen
88
Aufwandseignung
74
Coaching-Hinweis
Nützliche Unterstützung beginnt oft damit, Mehrdeutigkeit zu reduzieren. Eine klärende Frage kann verhindern, dass eine schnelle Antwort teuer wird.
Designnotizen
Verwende dies, wenn das Lernziel besseres Urteilsvermögen und nicht das Abrufen von Antworten ist.
Mach die Trade-offs real.
Verwende Dimensionen, die in der tatsächlichen Arbeit wichtig sind, wie Risiko, Vertrauen, Qualität, Geschwindigkeit, Aufwand, Vertrauen oder Kundenimpact.
Vermeide falsches Gleichgewicht.
Nicht jede Wahl muss gleich gültig sein. Einige Optionen können schwächer sein, aber das Feedback sollte erklären, warum.
Coach die Entscheidungslogik.
Es geht nicht darum, den Lernenden mit einer Punktzahl zu belohnen. Es geht darum, zu zeigen, was sich durch ihre Entscheidung ändert.
So passt du es an
Tausche das Szenario, die Optionen, die Metriken und die Coaching-Hinweise aus.
Passe dieses Muster für Führungsentscheidungen, Kundenservice, Sicherheit, Einarbeitung, Fehlersuche, Anwendungsrichtlinien, Coaching-Gespräche oder operative Triage an.
Schreibe das Szenario
Schaffe einen Moment, in dem mehr als eine Option plausibel erscheint.
Wähle die Dimensionen
Wähle 4 bis 6 Trade-off-Dimensionen, die im Arbeitsablauf wichtig sind.
Bewerte jede Entscheidung
Gib jeder Wahl ein deutliches Profil, damit die Konsequenzen sichtbar werden.
Coach die Logik
Erkläre die Entscheidungslogik, nicht nur das Ergebnis.
Starterblock
Kopierbares HTML, CSS und JavaScript.
Verwende diesen Starterblock als leichtgewichtiges Muster für deine eigene entscheidungsbasierte Interaktion im Szenario.
<div class="tradeoff-widget" data-tradeoff-widget>
<div class="tradeoff-question">
<p>Scenario</p>
<h3>What would you recommend first?</h3>
</div>
<div class="tradeoff-options">
<button type="button" data-choice="quick">Give a quick answer so they can keep moving.</button>
<button type="button" data-choice="verify">Ask one clarifying question first.</button>
<button type="button" data-choice="escalate">Escalate immediately.</button>
</div>
<div class="tradeoff-feedback">
<h4 data-title>Clarify before acting</h4>
<p data-body>This choice adds a small pause, but improves clarity and reduces risk.</p>
<div class="tradeoff-bars">
<div class="bar" data-metric="speed"><span>Speed</span><strong>68</strong><div><i style="width:68%"></i></div></div>
<div class="bar" data-metric="clarity"><span>Clarity</span><strong>92</strong><div><i style="width:92%"></i></div></div>
<div class="bar" data-metric="risk"><span>Risk control</span><strong>86</strong><div><i style="width:86%"></i></div></div>
</div>
</div>
</div>Design Lab
Interaktionen erstellen, die Entscheidungen leichter verständlich machen.
Verwenden Sie dieses Muster, wenn Lernende Konsequenzen vergleichen müssen, nicht eine perfekte Antwort auswendig lernen.
Zurück zum Design Lab