Dementia In New Light
An award-winning, freely accessible learning platform built from Cracked: new light on dementia—a cinematic journey through stigma, care culture, and what it means to value people living with dementia.
- React
- Redux
- SQL
Engagement
Role & team
Developer · Forge Media & Design
- Team context
- Primary Developer on project, built from designs created by design team, senior-reviewed PRs, 2-3 other developers worked on tasks depending on capacity.
- My contribution
- Full lifecycle — owned the majority of implementation; paired on 3D animations.
Context
Overview
An award-winning, freely accessible learning platform built from Cracked: new light on dementia—a cinematic journey through stigma, care culture, and what it means to value people living with dementia.
Dementia in New Light is a freely accessible digital learning experience created by a research team behind the production Cracked: new light on dementia. Rather than a traditional course, it wraps learners in a cinematic environment of video, animation, and audio—moving from darker tones toward light as topics deepen, echoing the idea that new understanding can emerge from difficult subjects.
The curriculum spans five main topics and twenty-seven sub-topics—covering areas such as relationships, the culture of dementia care, loss, and paths toward transforming and thriving. Within each section, learners encounter multimedia resources and reflective activities co-designed with people living with dementia, family carers, health care practitioners, and educators. The goal is not only to inform, but to shift how society thinks about dementia: to surface the harm of stigma, honour complex identities and relationships, and point toward communities where people living with dementia are included and can flourish.
Launched in 2022, the experience extends the impact of the original stage production into a scalable, shareable resource for students, practitioners, families, and the public. Headphones are recommended for the full audiovisual experience.
Process
Challenges
01
Custom plugins
Because of the varied media that was being used on the site, plugins had to be customized or rebuilt to allow for end-user management in the CMS. An example being a plugin that I rebuilt to take user entered text in the Strapi backend, and turn it into an SVG animation that mimic a cursivley written letter, accompanied by an audio track.
02
Deep content hierarchy without losing learners
Shipped a guided curriculum—not a landing page—across five topics and 27 modules with media and reflection at every level. Wired the content tree to React navigation and clear progress so users stay oriented in a deep module stack.
03
Performance and perceived load on real-world devices
The app loads like a rich client—progress on first visit, video, audio, and WebGL throughout—so first paint and transitions had to stay fast on weak devices and institutional Wi‑Fi. Shipped module-level lazy loading, sensible codecs and prefetch, and fallbacks so performance doesn’t collapse in the field.
04
Scope growth under co-design
Built CMS schemas, a shared component library, and feature flags so new modules and branching could land without replatforming navigation or progress.
05
Narrative pacing and state in an SPA
Orchestrated routes, media, motion, and reflection state in React so story beats land as one flow—and stay coherent on refresh, back, and deep links.
06
CMS flexibility for a research client, not a marketing team
Researchers own lesson updates through headless content into a custom React app—the work was schema and workflow, not another editor. Polymorphic blocks, preview, and guardrails let non-developers publish safely; each new module type extended the content model and the UI contract together.
07
Learner accounts, progress, and resumability
Shipped accounts with cross-device progress, CMS-safe completion sync, and motivating progress UI that respects a sensitive topic—not gamification for its own sake.