Learn Courses preview Course plans by Shane Rounce. Enrolment is not open.
← All courses
Course plan · Enrolment not openApplication engineering · Tutor-led cohort

Build interactive explainers and playful browser tools

With Shane Rounce

I teach build interactive explainers and playful browser tools through a practical project, worked examples and checks that another person can repeat. This is a complete course plan; lesson recordings, workbooks and delivery are still to be produced.

4 weeks20 learning hoursTutor-led cohort

I’m developing this course as part of Learn Courses. This is the full teaching plan, ready to review before I produce the lessons and open enrolment.

IS THIS FOR YOU?

Who I’m building this for

Creative developers and educators.

Before you begin

  • A computer with a current browser and permission to use the project material.
  • Basic familiarity with Git and the relevant development tools. Work takes place in an isolated test environment.
  • No client records, credentials or production changes are needed for the exercises.
PROPOSED COURSE FEE

£295

Provisional planning figure, not an approved price or an offer for sale. I have allowed for a small cohort, group feedback and a capstone review. Cohort size, tutor time, delivery costs and tax treatment need confirming before sale.

Planning price only. Enrolment is closed and no payment is taken.
Explore a sample learning space →

The sample is fictional. It is separate from this course’s future lessons.

A PRACTICAL NEXT STEP

What you’ll be able to do

  • Write an interaction brief that makes a relationship inspectable without promising a simulation proves reality.
  • Implement deterministic state and visible assumptions in a small browser prototype.
  • Add keyboard controls, reduced motion and a readable text alternative.
  • Test boundary values, repeatability and constrained-device performance and label invented data.
THE TEACHING PLAN

Your next 4 weeks

A clear route through the subject, with something to make, test or reflect on at every stage.

01
MODULE 1

Choose one learning question

I explain the decisions behind choose one learning question using worked examples, a deliberately broken case and a corrected version. The lesson distinguishes what the evidence establishes from what still needs checking.

Your practical activity
Write an interaction brief that makes a relationship inspectable without promising a simulation proves reality.
How I’ll check your understanding
Submit the working artefact and a short evidence note for module 1: write an interaction brief that makes a relationship inspectable without promising a simulation proves reality. Include the initial state, the chosen change, a meaningful failure case and the result of the check. I review whether the evidence supports the conclusion and return specific revisions where it does not.
02
MODULE 2

Separate model and presentation

I explain the decisions behind separate model and presentation using worked examples, a deliberately broken case and a corrected version. The lesson distinguishes what the evidence establishes from what still needs checking.

Your practical activity
Implement deterministic state and visible assumptions in a small browser prototype.
How I’ll check your understanding
Submit the working artefact and a short evidence note for module 2: implement deterministic state and visible assumptions in a small browser prototype. Include the initial state, the chosen change, a meaningful failure case and the result of the check. I review whether the evidence supports the conclusion and return specific revisions where it does not.
03
MODULE 3

Make the interaction accessible

I explain the decisions behind make the interaction accessible using worked examples, a deliberately broken case and a corrected version. The lesson distinguishes what the evidence establishes from what still needs checking.

Your practical activity
Add keyboard controls, reduced motion and a readable text alternative.
How I’ll check your understanding
Submit the working artefact and a short evidence note for module 3: add keyboard controls, reduced motion and a readable text alternative. Include the initial state, the chosen change, a meaningful failure case and the result of the check. I review whether the evidence supports the conclusion and return specific revisions where it does not.
04
MODULE 4

Validate the demonstration

I explain the decisions behind validate the demonstration using worked examples, a deliberately broken case and a corrected version. The lesson distinguishes what the evidence establishes from what still needs checking.

Your practical activity
Test boundary values, repeatability and constrained-device performance and label invented data.
How I’ll check your understanding
Submit the working artefact and a short evidence note for module 4: test boundary values, repeatability and constrained-device performance and label invented data. Include the initial state, the chosen change, a meaningful failure case and the result of the check. I review whether the evidence supports the conclusion and return specific revisions where it does not.
PUT IT INTO PRACTICE

Your final project

Build and document a complete practical project for build interactive explainers and playful browser tools. Use an invented organisation or an expressly permitted personal project, join the four module artefacts into one coherent result and demonstrate a normal journey, a failure state and a recovery or revision.

What you’ll produce

  • Module 1 artefact: Write an interaction brief that makes a relationship inspectable without promising a simulation proves reality.
  • Module 2 artefact: Implement deterministic state and visible assumptions in a small browser prototype.
  • Module 3 artefact: Add keyboard controls, reduced motion and a readable text alternative.
  • Module 4 artefact: Test boundary values, repeatability and constrained-device performance and label invented data.
  • A concise project brief, source and rights record, evidence log and handover with known limitations.

What good work looks like

  • Choose one learning question: 20 marks for a correct artefact, justified decisions and repeatable evidence.
  • Separate model and presentation: 20 marks for a correct artefact, justified decisions and repeatable evidence.
  • Make the interaction accessible: 20 marks for a correct artefact, justified decisions and repeatable evidence.
  • Validate the demonstration: 20 marks for a correct artefact, justified decisions and repeatable evidence.
  • Integration and handover: 20 marks for a coherent project, source acknowledgement, appropriate access and a clear explanation of remaining limits. Pass requires at least 70/100 and correction of any privacy, access or destructive-operation defect before completion.

Resources for your learning

  • A worked example and a deliberately broken fixture for choose one learning question.
  • A worked example and a deliberately broken fixture for separate model and presentation.
  • A worked example and a deliberately broken fixture for make the interaction accessible.
  • A worked example and a deliberately broken fixture for validate the demonstration.
  • A build interactive explainers and playful browser tools workbook with evidence prompts and the capstone marking sheet.
  • A transcript, caption file and text-first lesson version for every recording.
  • A downloadable source-and-rights checklist and a sample completed project handover.

A course you can access

  • Provide edited captions, transcripts and a text-first route through every lesson.
  • Use keyboard-operable exercises, visible focus, legible contrast and no essential autoplay or motion.
  • Supply downloadable instructions and low-bandwidth alternatives; avoid timed assessment as a default.
  • Offer equivalent written evidence where live attendance or spoken presentation is a barrier and document support before enrolment.
FINISH WITH SOMETHING USEFUL

How you’ll complete the course

  • Submit all four module artefacts and respond to assessment feedback.
  • Complete the capstone at 70/100 or above with no unresolved access, privacy or destructive-operation defect.
  • Explain a meaningful failure case and the limits of the result in the evidence log.
  • Completion records describe assessed participation; I am not claiming external accreditation.

Completion will describe the work you have done. No external accreditation or professional qualification is claimed.

BEFORE I OPEN ENROLMENT

What I still need to finish

I’ll turn this plan into a delivered course once the teaching material and the learning service are ready.

  • Produce and editorially review the four lessons, worked examples, broken fixtures and marking guidance for build interactive explainers and playful browser tools.
  • Build and test the course-specific workbook and capstone reference project using synthetic or permitted material.
  • Pilot the complete learner journey, including mobile, keyboard, captions, assessment feedback and recovery from interrupted access.
  • Approve the actual price, tax treatment, refund terms, access period, support boundaries and any cohort dates before accepting payment.
  • Implement and test authentication, server-side paid entitlements, webhook reconciliation, private asset access and tenant isolation before unlocking paid lessons.
  • Confirm tutor availability, feedback turnaround, moderation responsibilities and capacity before advertising tutor-led support.
  • Review source licences, sample rights and current official technical guidance before recording or publishing the material.
FURTHER READING

The ideas behind the course

My published articles are background reading for this plan. The full lessons, activities and assessment material still need producing.

EXPLORE THE ACADEMY

See how the learning space feels.

Try the fictional learner demo →