REEL 02 · TC 00:00:00 / 07:00:00
BOYI TAN PRESENTS · AN INTERACTIVE RESEARCH DOCUMENTARY
Who Is at the Helm?
A documentary about interactive media — with interactive nodes inside it. At chosen moments, the director hands the camera to you.
DIRECTED BY BOYI TAN · CARLETON MPAD4400 · MENTORED BY KATIE GRAHAM · 2024.09–2025.01
CUT IN PREMIERE PRO · MOTION IN AFTER EFFECTS · BUILT IN HTML WITH A 360 RIG
DIRECTED BY
Boyi Tan
Director, planner & initiator
FORMAT
Web-based interactive doc
Linear film + parallel 360 video
VOICES
3 expert interviews
Cut into one conversation
MY SCOPE
Full pipeline
Research question · interviews · shoot · edit · interaction build
NOW SCREENING
TC 00:32
THE LINEAR CUT — IN THE HTML BUILD, INTERACTION NODES HAND OVER CONTROL AT CHOSEN TIMESTAMPS WATCH ON YOUTUBE ↗
ONLINE PROTOTYPE
A lightweight online reconstruction of the handoff mechanism.
It uses YouTube-hosted streams instead of the original 3GB local video package, so reviewers can try the linear-to-360 switch directly in the browser.
TRY THE INTERACTIVE WEB DEMO ↗
THE RESEARCH QUESTION — WHO CONTROLS THE FRAME?
TC 01:10
THE DIRECTOR'S FRAME
Traditional film controls your attention — framing, editing, light, and music decide what you see, and when.
The director, cinematographer, and editor hold the helm. Nothing important is ever missed — because you were never free to look away.
THE AUDIENCE'S FIELD
Interactive media — 360 video, VR, games — hands part of that control to the viewer.
You gain exploration and presence. You also gain the freedom to look the wrong way and miss the story entirely.
THE NARRATIVE PARADOX
The freer the audience, the harder it is to hold a narrative together; the tighter the narrative, the less the interactivity means. If interactivity creates this tension — why do we still want it? That question became the film.
DIRECTOR'S STATEMENT
"I didn't want to praise interactivity or condemn it. I wanted to build the tension into the film itself — so the audience feels the trade at the exact moment they take the helm."
ACT I — THREE VOICES, ONE CONVERSATION
TC 02:05
KARL ROEDER
Cinematographer / DP
Traditional film industry — the voice of composed frames, lens language, and camera-held control.
KATIE GRAHAM
Professor & mentor, Carleton
Researches immersive and interactive media, digital technologies, and hybrid forms between them.
VICKY MACARTHUR
MPAD program director
Game design, digital humanities, and AR/VR narrative — the voice of designed agency.
Cut the questions. Keep the argument.
I planned and led all three interviews, then removed my own questions in the edit — so three separate sessions play as one continuous discussion about narrative, agency, immersion, and where 360 belongs.
director's note — the interviewer disappears for the same reason the questions do: the experts should seem to answer each other.
Karl Roeder interview still
FRAME 1A — Karl Roeder in the composed interview frame: the tradition the film interrogates
Interview setup in the lecture hall
FRAME 1B — the lecture-hall interview setup, lit and framed like the cinema it questions
Premiere Pro editing timeline
FRAME 1C — the dialogue cut in Premiere Pro: three sessions interleaved into one track
SHOOTING LOG 10.24 B-ROLL 10.31 INT. KARL 11.01 INT. KATIE 11.11 INT. VICKY 11.20 ROUGH CUT 11.25–28 CODE + 360 12.21 FINAL REFLECTION
ACT II — THE HANDOVER MECHANISM
TC 03:20
Two streams run in parallel. The viewer picks the helm.
At selected moments a button surfaces in the player. Take it, and the composed frame gives way to the 360 record of the same moment — drag to look at the crew, the lights, the room outside the director's cut. Ignore it, and the film simply continues.
director's note — the interaction is optional on purpose. Agency you're forced to use isn't agency.
Linear player with the 360 switch button
FRAME 2A — the director's frame, with the way out visible in the player
360 view revealing the whole interview room
FRAME 2B — the same moment in 360: crew, rig, and room the cut never shows
THE LAST NODE — THE FINAL QUESTION IS YOURS END OF FILM
Final interaction node — choose who answers the last question
FRAME 2C — ASK KARL · ASK KATIE · ASK VICKY: the film ends on the viewer's choice
At the end, one question remains — and the viewer decides who answers it.
"Do you think it's a good idea to use a 360 camera to make this documentary?" Each expert gives a different answer. Which one you hear last is up to you — the film's structure practices what its argument preaches.
SCREEN RECORDINGS — THE WORKING BUILD
DEMO A — interaction capture from the HTML build
DEMO B — switching between the cut and the 360 field
ACT III — THE BUILD, THREE VERSIONS DEEP
TC 04:35
TECHNICAL REPORT — THE 8K PROBLEM INT. BROWSER — NIGHT
STATUS
8K 360 footage loaded locally eats ~3GB of memory — color degrades, playback stutters.
OPTIONS ON THE TABLE
Rebuild in Unreal Engine 5. Compress the footage and lose the point of 8K. Or move playback off the machine entirely.
DECISION
Host the video on YouTube and embed it — Katie's suggestion. Playback holds; the trade is preset quality settings, autoplay limits, and a dependency on the network.
VERSION HISTORY — FROM PROOF OF CONCEPT TO WORKING FILM
Version 1 — local playback proof of concept
V1 — local HTML playback: the mechanism works, the footage doesn't yet
Version 2 — stress test with stock 360 footage
V2 — stress-testing with stock footage: where the memory wall appeared
Version 3 — final build with YouTube embeds
V3 — the shipped logic: YouTube-hosted streams inside the HTML player
Function beat chrome, every time they fought.
CSS styling on the interaction buttons kept shoving the small video window out of position. I simplified the button treatment and kept the playback solid — built with Tianyu Zhang on code support and bug fixes, leaning on W3Schools and ChatGPT for syntax and debugging.
director's note — a prettier button that breaks the player is a worse button.
The shipped player interface
FRAME 3A — the shipped player: plain controls, unbroken playback
FINAL REEL — WHAT THE FILM ARGUES
TC 05:30
01 — THE MEDIUM SERVES
Not every story wants a helm to hand over
Interactivity added for its own sake is decoration. It earns its place only when the choice it offers is meaningful.
02 — THE TRADE IS REAL
360 buys presence with authorship
Karl's position: 360 suits experience and showcase more than strong narrative — the frame is the director's instrument, and 360 gives it up.
03 — GUIDANCE SURVIVES
Attention can still be designed
Katie and Vicky's counter: visual cues, leading lines, and composition keep steering the eye — even inside a frame the viewer controls.
The full 360 field of the interview room
FRAME 4A — the whole room, crew and all: everything a composed frame is built to leave out
DIRECTOR'S CUT — COMMENTARY TRACK
TC 06:10
TRACK 01
Agency is a design material
Deciding when the viewer gets control — and when they don't — is the same judgment as deciding what a user can touch in an interface.
TRACK 02
Constraints wrote the architecture
A 3GB memory wall turned into a hosting decision, a UI compromise, and a network dependency — engineering trades made to protect the experience.
TRACK 03
The director never disappears
Even in 360, someone chose the nodes, the room, the question. Handing over the helm is itself a directed act — that's the film's answer.
"Interaction isn't a feature you add. It's control you choose to give away — on purpose, at the right moment."
— WHY THIS REEL LIVES IN A UX PORTFOLIO
DIRECTED & EDITED BY BOYI TAN · CAM A BOYI TAN
CREW OWEN WALLACE · ARUSH PERERA — CODE SUPPORT & BUG FIXES TIANYU ZHANG
MENTORED BY KATIE GRAHAM · MPAD4400 DIRECTED STUDIES · CARLETON UNIVERSITY
Hold the frame × Hand over the helm × Keep the story
© 2026 Boyi Tan Roll credits: About · Resume · boyitan0011@gmail.com · LinkedIn