
DNAnna
A serious game that turns a simulated workday into a personal values profile.
01
The Brief
Anna Zorggroep wanted their employees to explore different roles within the organization and reflect on their own values. The ask was a game that feels like a real workday: you pick a role, work through 8 hours of situations, and every decision you make says something about how you work. No right or wrong answers, just a mirror.
The constraint nobody anticipated: the game had to run on Citrix-managed internal computers. These are locked-down, low-spec machines that the standard PlayCanvas setup and video playback together would bring to a crawl.
02
My Approach
I built the game in PlayCanvas as a single-scene app. All state moves through an event bus: managers for onboarding, choices, reactions, time tracking, video, and the final DNA summary each communicate through named events and never reach into each other directly. That kept the logic clean across about 12 scripts.
Content came from Excel files filled in by Anna's HR team over multiple iterations across the project. I wrote a Python parser that converted those spreadsheets directly into game-ready JSON, so the team could keep refining scenarios in a format they already knew without touching any code.
The Citrix problem came down to one specific conflict: PlayCanvas's GPU render loop and the browser's HTML5 video element were competing for the same resources. The fix was to take direct control of the render loop. During video playback I disabled PlayCanvas's auto-render entirely and let the video element handle its own output. GPU load dropped immediately and the game ran on the restricted hardware.
The rest of the performance work was asset management: situation images load on-demand when a hotspot becomes active and unload after the choice resolves. Role portraits batch-load at game start with deduplication to avoid pulling the same asset twice, then clear on restart to prevent memory buildup.
I also integrated a self-hosted analytics instance that tracks every choice made with the full answer and point breakdown per event. Each play-through gets a unique session ID so the client can correlate a player's full journey end to end.
Fig. 03 · Video
A scenario dialogue playing out with an NPC in one of the facility's departments.
03
The Result
A browser-based serious game hosted on Anna Zorggroep's internal network. Players pick one of 7 healthcare roles (nurse, manager, and others) and work through a simulated shift. Workplace situations appear as hotspots on an isometric facility map spread across multiple departments. Each situation offers three responses, each tied to one of Anna's three organizational values: Lef (Courage), Samen (Together), and Vertrouwd (Trust). Every choice also costs time, so the workday fills up differently depending on what you pick.
At the end, the game shows your DNAnna: a DNA helix visualization of your value breakdown, a full replay of every situation and what you chose, and what the alternatives would have scored.
04
Outcome
The game is live and being used by Anna Zorggroep employees. The client had concerns about the hardware early on but was satisfied with how the game performed after the rendering work. The analytics turned out to be something they hadn't expected but quickly became a feature they valued, giving them real data on how employees respond to the scenarios.
For me the main takeaway was the rendering work. Modern web games can usually rely on the browser handling resource allocation, but Citrix is its own environment. Having to step in and manage the render loop manually gave me a much more concrete understanding of how PlayCanvas and the browser actually share GPU time.
Stills



A scenario card presenting three possible responses. Each option maps to one of the three company values and carries a different time cost.
03 / About
Concept first, medium second
I'm Ramon, a multimedia designer based in Eindhoven. Projects start with a problem: what the thing has to do, and how someone should move through it. The answer has been a 360 film, a VR walkthrough, an explainer animation, a configurator and an AI training platform.
My part is 3D, design and code: modelling and lighting in Blender, interface and motion in XD/Illustrator and After Effects, and the build in PlayCanvas or Next.js.