Flip Through my Journal!


DEC 2024
Contribution: Interaction Design
Technology: JavaScript, HTML, CSS 

Slowly scroll horizontally on trackpad to view

Overview

An exploration of bringing materialistic properties to digital interfaces, featuring my personal journal pages over the years. 

Process

I scanned each of my journal pages and and edited them together in Photoshop. While digital pictures may suffice, I felt that manually scanning each page would capture the flip book effect more genuinely. While the scan didn’t go perfectly (blurry in the middle on each page) and I have old pictures, I liked the flawed, yet human outcome nonetheless. I created the “flip” effect by distorting the flipped page and placing the next page in the background. The flipbook effect is created by following horizontal scroll behavior from the user and matching it to each page.