
The Apothecary
Interactive Animation

Synopsis
The Apothecary is an interactive animated adventure where you can follow the story of the staff in this wacky medieval hospital. Immerse in the story not only through the animation, but also with minigames where you can perform the medical procedures happening on-screen!
Our patients’ lives are in your hands!
About the project
What happens when an apothecary employs a cast of misfit healers who wreak havoc and medical liability everywhere they go and a director who has to clean up their mess?
For this project I wanted to create an interactive branching narrative inspired by my love for animation, flash games and medical horror stories. The goal was to create a prototype of my concept, where the viewer assume an active role in the viewing process, making decision and overcoming checkpoints to move the story forward. I chose the subject of a medieval hospital – an apothecary – because the concept itself is quite comical and possesses opportunity for me to create a narrative suitable for my project.
Development Work
Narrative Design
I first tackled the narrative elements, and the first thing was to define the structure of my story, how the events would play out, what was the sequence of events and how can I create a story loop that could be adapted into different episodes of this show. For the pilot episode, I fleshed out the branching narrative and milestones of the story, and I experimented with different order placement of the animation and interactive elements, to see how it would work best logically.

Character Design
For the main cast, I wanted each character to have a color that represent them and their personality complex. And for the supporting cast, I wanted their appearance and color palette to match with their role and social class.
But the overall philosophy was to simplify the design as much as I can so I could optimize time in the animation process.

Character Sketches




Character Turnaround




Animation Pipeline
The animation process was also the most time-consuming aspect of this project, and it consists of posing the individual body parts for each characters, swapping out the correct asset, adding in the backgrounds that I made from Blender, and adding in the lip-syncing using the lip-sync feature from Adobe Animate. I also worked a lot with my supervisor during this stage to make sure the animation were effective and took his suggestions to keep improving it.
Storyboard

Background Design

Blocking

Composition

Animation

Full Scene

Minigame Design
I first tested lo-fi prototypes with friends. Originally, the games were unlosable for a casual feel, but that led to drawn-out gameplay and waning interest. Introducing a timer mechanic greatly improved the experience. After refining the code, I added graphics matching the animation’s style, implemented scene transitions for smoother flow, and incorporated sound effects and music—particularly effective for the medical-themed games.
Prototype

Final Game




