Sokongan aliran kerja
Gunakan apabila pelajar memerlukan bantuan untuk mendiagnosis masalah dan memilih tindakan berguna seterusnya.
Pemulihan berpandu
Ubah kekeliruan menjadi laluan terstruktur dan bukannya membuang pelajar ke halaman polisi atau barisan sokongan.
HTML/CSS/JS
Berfungsi sebagai prototip web berdiri sendiri, penyematan Rise, objek web Storyline, atau komponen halaman sokongan.
Kenapa corak ini wujud
Penyelesaian masalah biasanya adalah di mana pembelajaran menjadi nyata.
Orang jarang memerlukan sokongan apabila semuanya berjalan dengan sempurna. Mereka memerlukan sokongan apabila proses itu rosak, arahan tidak sepadan dengan realiti, alat berkelakuan aneh, atau langkah seterusnya tidak jelas.
Prototip ini memberikan pelajar laluan berpandu melalui saat yang kelam kabut itu. Daripada memaksa mereka mencari melalui dokumen panjang, ia membantu mereka mengenal pasti isu, menyemak kemungkinan punca, dan memilih tindakan praktikal seterusnya.
Matlamatnya bukan untuk menggantikan sokongan manusia. Matlamatnya adalah untuk mengurangkan kekeliruan yang boleh dielakkan dan membantu orang bergerak ke hadapan dengan lebih yakin.
Prototip langsung
Ikuti aliran penyelesaian masalah.
Pilih isu, semak kemungkinan punca, dan semak langkah seterusnya yang disyorkan. Model yang sama ini boleh disesuaikan untuk pengenalan, sokongan aplikasi, panduan aliran kerja, pemeriksaan keselamatan, atau triage operasi.
Langkah 01 · Kenal pasti isu
Masalah apa yang dilihat oleh pelajar?
Mulakan dengan menamakan isyarat. Aliran penyelesaian masalah yang berguna bermula dengan masalah yang boleh sebenarnya diperhatikan oleh pelajar.
Langkah 02 · Semak kemungkinan punca
Apa yang harus mereka semak terlebih dahulu?
Aliran penyelesaian masalah yang terbaik menolak punca yang mudah sebelum menghantar orang ke laluan sokongan yang lebih berat.
Langkah 03 · Pilih tindakan berguna seterusnya
Apa yang harus berlaku seterusnya?
Langkah terakhir harus membantu pelajar bertindak, pulih, atau meningkatkan dengan konteks yang berguna.
Nota reka bentuk
Sokongan penyelesaian masalah harus terasa seperti bantuan, bukan kerja rumah.
Mulakan dengan isyarat
Gunakan bahasa yang pelajar benar-benar akan kenali: “Saya melihat ralat,” “skrin tidak sepadan,” atau “saya tidak pasti apa yang perlu dilakukan seterusnya.”
Pastikan pemeriksaan ringan
Minta pemeriksaan yang paling mudah dan berguna sebelum meningkatkan, memulakan semula, atau menghantar pelajar ke dinding dokumentasi.
Tingkatkan dengan konteks
Jika pelajar memerlukan bantuan, pastikan aliran menangkap apa yang berlaku, apa yang mereka periksa, dan di mana proses terputus.
Paling baik digunakan untuk
Di mana prototaip ini sesuai.
Sokongan aplikasi atau alat
Pandu pelajar melalui skrin biasa, ketidakpadanan, keadaan ralat, dan langkah seterusnya.
Kesediaan operasi
Bantu orang pulih apabila aliran kerja sebenar tidak sepadan dengan versi latihan.
Sokongan prestasi
Tukar bantuan kerja statik menjadi laluan keputusan yang mengarahkan pelajar ke tindakan berguna.
Sokongan pengurus
Berikan pengurus laluan mudah untuk mendiagnosis halangan bimbingan, keyakinan, atau aliran kerja.
Kod permulaan
Salin struktur aliran penyelesaian masalah yang asas.
Permulaan ini sengaja kecil. Gunakan ia sebagai asas untuk halaman HTML yang dihoskan, penyematan Rise, objek web Storyline, atau halaman sokongan dalaman.
<div class="troubleshooting-flow">
<h3>What issue are you seeing?</h3>
<button data-next="instructions">
Instructions do not match the situation
</button>
<button data-next="tool">
The tool is not behaving as expected
</button>
<button data-next="confidence">
I am unsure what to do next
</button>
<div class="troubleshooting-result" aria-live="polite">
<h4>Next step</h4>
<p>Choose an issue to see guidance.</p>
</div>
</div>
<script>
const guidance = {
instructions: "Compare the current situation to the expected flow and identify where it diverges.",
tool: "Refresh, verify the tool state, and capture the exact error or screen.",
confidence: "Use a short example or decision guide before restarting the full learning experience."
};
document.querySelectorAll("[data-next]").forEach(function(button) {
button.addEventListener("click", function() {
const key = button.getAttribute("data-next");
document.querySelector(".troubleshooting-result p").textContent = guidance[key];
});
});
</script>Makmal Reka Bentuk
Penyelesaian masalah adalah pembelajaran pada saat diperlukan.
Gunakan corak ini apabila pelajar tidak memerlukan modul lain. Mereka memerlukan laluan yang jelas melalui momen yang kelam.