rajin's journals
performative journaling
I put my sticker-covered journal on the web. You can undo the strap, open the cover, and turn the pages.
Why I made it
I like my actual journal as an object: the navy cover, the snap strap, the stickers I've stuck all over it. I wanted to see if I could make that little book feel like a book on a screen. Mostly, I made it for myself.
You can open it and turn the pages, but you won't find my private entries inside. There's a short note on the first page; the rest are blank for now. It's a small art project you can hold with a cursor.
Open the journal
-
Open and Close
The strap releases before the cover swings open; the closed book slowly turns until you interact with it.
-
Turn the Pages
Click, swipe, or use the arrow keys to move through the paper leaves. Escape closes the journal.
-
Room to read
It fits smaller screens too, with a note when a larger display would make the book easier to explore.
How I built it
It's HTML, CSS 3D transforms, and JavaScript. The covers, spine, strap, paper, ribbon, and stickers are separate layers. Each page turns around the binding; the browser only loads artwork for pages near the one you're on.
I worked from a video of the real journal and references for its stickers. The leather grain and metal bits are approximations. The pages themselves stay in HTML, so I can add writing later if I want to.
