Dynamic Poster: Interstellar

Designing a poster that visualizes space, time, and emotion through motion.

Project Overview

This interactive poster was created using only HTML, CSS, and JavaScript. The goal was to translate the emotional core of Interstellar into a dynamic experience, with subtle movement and depth inspired by themes of time, space, and connection.

Inspiration & Research

I began by rewatching Interstellar to reconnect with the emotion and narrative. I noted how the themes of sacrifice, gravity, and human bonds could influence visuals like colors, layout, and interaction.

Want a quick refresher on Interstellar’s plot and feel?

Watch the Trailer

Define the Challenge

The challenge: How can I express the abstract concept of time distortion and emotional distance through a single visual interface? This guided all following design decisions.

Moodboard & Visual Direction

Before diving into the prototype, I went looking for visual inspiration that matched the tone of Interstellar. I explored minimalist space posters and paid attention to how they used composition, color, and silence to create emotion. These three visuals stood out and helped shape my direction, guiding the look and feel of my final design.

Inspiration 1 Inspiration 2 Inspiration 3

Moodboard

Moodboard

Sketch & Concept

Through rapid sketching, I generated multiple ideas. I explored contrasts between Earth and space, symbolic representations of time, and the emotional distance between Murph and Cooper.

Poster Idea 1 Poster Idea 2 Poster Idea 3

Prototype in Code

I built the poster entirely with HTML, CSS, and JavaScript without relying on any frameworks or libraries. The animations were custom-coded to mimic gravitational pull and the slow, continuous distortion of time and space, matching the tone of the film.

Each element was positioned and animated manually, using keyframes, transforms, and transitions to create a sense of depth and motion directly in the browser.

Final Design

The final version of the poster brings the story of Interstellar to life through subtle movement and atmospheric pacing. Every animation and transition was carefully timed to reflect both the vast emptiness of space and the emotional closeness between characters.

What I Learned

This project taught me how storytelling can be translated into code. Even minimal interfaces can create emotional impact when movement and layout are used with intention.

← Back to all projects