Onwards

A soul-searching journey

Interactive Story (2024)

Onwards is a three-part interactive story combining animation, photo manipulations, music and sound design. Built in HTML, CSS, JS, it was imagined and created as a travel diary. It narrates the soul-searching journey of a lost little girl as she enters adulthood.

The Challenge

I aim to make immersive stories through my art.

For the past three years I have been turning my photo manipulations into short animated pieces, coming up with ways to engage the audience in each piece.

But my creative expression has always been limited by technology, especially by file size restrictions when uploading videos and creating NFTs*.

* non-fungible tokens: assets like a piece of art, digital content, or video that have been tokenized via a blockchain.

Visual & Motion Design

I began chapter 1 of "Onwards" with surreal photo manipulations that served as the basis for illustrations.

By utilizing a 2D style, it allowed me to experiment with frame-by-frame animation in Procreate and motion design in After Effects.

+

Sound & Storytelling

To enrich the experience, I recorded some custom sound effects, blending them with a sound library to build a distinct universe for "Onwards."

I wrote the story and hired a voice actor to narrate it, with the intention to give the project an audiobook-like quality.

Interactivity & Marketing

I coded a custom video player using HTML, CSS, and JavaScript, which reacts to user interactions throughout the story. Its features allow users to zoom in, switch between illustration and photo, and input their names for a more immersive experience.

I created a custom font, "Rêverie," based on my handwriting.

I planned and executed a marketing campaign to reveal the piece and announce the edition sell, making sure all visual elements were tied together and experience it as part of this personal travel diary.

A glimpse of ‘Onwards’ Chapter 1: Rebirth