PREPARING EXPERIENCE

My 2021 - 2026

Productivity

A visualization of over 600 workfiles created during my undergraduate.

My 2021 - 2026

Productivity

A visualization of over 550 workfiles created during my undergraduate.

An undergraduate degree isn't just awarded; it is built, block by block, in the quiet moments of focus and the chaotic hours of deadlines. Have you ever wondered what the actual architecture of your time looks like? Here is five years of my academic life, translated into data, geometry, and color.

Act 1: The Cubes

Here lies every single workfile I've created across five years of undergraduate courses. In total, there are 567 files, each one a cube in this 3D space. Each cube representing an assignment, a report, a piece of code. Hovering on the cube to take a glance.

Watch as the cubes reorganize themselves by academic term. Fall 2021 through Winter 2026, in total 8 semesters,

Now the cubes take on the colors of their courses. Within this dataset, there are 34 unique of them.

The cubes rise from the plane. Height now encodes version count. A tall tower may mark an assignment revised dozens of times;

Finally, the cubes spread into a true calendar. Each cell is a day, its warmth showing how many files were born that day. Empty spaces are the gaps, weekends, holidays, the quiet days between bursts of creation.

Act 2: The Strips

Every file has a type, and every type tells a story. Here are the sixteen different file formats I've worked with across five years of coursework. From the digital paint of .kra to the rigorous proofs of .tex, each format is a lens into the skills and tools demanded by my education.

Lines begin to weave between file types and the courses that demanded them. .java belongs to algorithms and data structures; .blend to art; .elm to functional front-end design.

Datawise, .tex is the most demanding, with 22 courses connecting to it. On the other end, the NLP course connected to 5 different file types.

Now the strips stretch into bars, ranked by sheer volume.

.tex leads at 122 files, the backbone of every proof, every report and assignment. .md and .docx follow close behind.

But totals flatten time. Watch the bars melt into a flowing stream, semester by semester. Hovering over the legend to reveal each stream.

Act 3: The Bubbles

Freshman year, each track is an assignment that total file versions are over 100, each bubble a burst of file saves. Notice how the bubbles cluster at the right edge the deadline.~61% of all edits happen within the last 12 hours and ~22% when there are 12-24 hours left. The classic pattern of a beginner:

all panic, no pacing.

Four years later, the last year. The courses are harder, machine learning, NLP, the projects are larger. But look at the bubble distribution. The right edge still dominates. The tools improved; the habits didn't.~37% of all edits happened within the last 12 hours.

Now all 59 major assignments compress into a single dense grid. Five years, near 24,000 commits, squeezed into one view. I am, and apparently always have been, a deadline-driven student.

~54% of all edits were made within the last 12 hours. ~73% within the last 2 days.

When exactly does the work happen? This heatmap maps ~43,000 file edits across days of the week and hours of the day. Sunday evenings burn brightest. 8pm, the undisputed peak of productivity. Weekends are not spared: a full third of all edits happen on Saturday and Sunday. In the contrast, morning time are almost wasted.

.blend

The engine for 3D modeling and rendering. Where geometric concepts meet visual art.

.kra

Used for digital painting and 2D illustration.

.hs

Purely functional programming. A strict, math-driven approach to logic and types.

The blueprints of C/C++, defining structures and interfaces before the actual logic.

Low-level, procedural systems programming. Dealing directly with memory and hardware.

.cpp

Object-oriented systems programming. Building complex, performance-critical software.

.elm

Functional frontend language. Used to build no-runtime-exception web frontend.

.ipynb

Interactive data science environment. Blending live Python and markdown.

.py

Highly readable scripting. The go-to tool for algorithms, automation, and ML.

.java

Object-oriented architecture. The standard for enterprise-level coursework.

.docx

Standard word processing.

.pptx

Slide deck creation. The medium for presenting project pitches and final defenses.

.xlsx

Grid-based spreadsheet data. Used for basic data logging and tabular organization.

.tex

Code-driven typesetting for mathematical proofs and thesis formatting.

.md

Lightweight, plain-text formatting. Good for documentation, READMEs, and quick notes.

.txt

Raw, unformatted sequences of characters.

.tex

.md

.docx

.py

.hs

.ipynb

.java

.txt

.elm

.pptx

.kra

.xlsx

.cpp

.blend

Data Methodology

The dataset was sourced organically from my school account's OneDrive version history spanning Fall 2021 to Winter 2026. Files are filtered and only keeps "workfile" types as shown in Act 2.

A single "commit" or "version" represents an autosave snapshot triggered by OneDrive file modifications. For each single file, OneDrive only keeps the lastest 500 versions, however, these files don't occupy major of the dataset. While minor sync discrepancies exist, they preserve the true macroscopic rhythm of my academic journey.

In Act 3, an assignment is represented by a bunch of files' version history that grouped manually. And all assignments displayed here are considered "major assignment" which means they have over 100 versions in total. The deadline is determined by the lastest version's creation time of that assignment's files. Manual data correction was made to handle obvious errors, such as when an assignment is opened after the deadline and a new version is created.

This dataset collected don't represent my full undergraduate academic journey as not every course and project is stored by OneDrive.

Colophon

Designed and developed with React and Next.js. The 3D environment is rendered using Three.js and React Three Fiber. The original Landing scene was modeled using Blender and textures were baked by Cycles - Blender's ray-trace based production render engine.

Data processing and vector visualizations were mathematically generated via D3.js, while complex state transitions and morphing animations were strictly orchestrated by GSAP. Typography is set in Roboto Serif.

You are welcome to checkout the GitHub Repo for this website. Also the Epilogue on my BLOG! Don't hesitate to star if you like this project!

Assets & Credits

The following 3D models from SketchFab are used in the landing scene under CC BY 4.0:

"Minimalist Desk" by ElOsitoAzul(adapted)
"Plain Mug" by LightSwitch(modified)
"Small plant in a pot" by Jsdpk(modified)
"Graduation" by Cyberluna(modified)

The McMaster University logo and shield are trademarks of McMaster University. Used for personal, non-commercial purposes as a student of the university.