Open to new projects · Denmark
← All work

Film promo · Motion · Booking UX · 2026

Afterimage

A launch site with ticket booking for a fictional near-future thriller. The key art reacts to the cursor, headlines decode out of code, and a full booking flow ends with an e-ticket.

Open live site ↗Watch the teaser ↗
Mara VoskuijlMara VoskuijlDr. Ines CalderElias TrendElias TrendTomas CalderJune OkaforJune OkaforAgent WrenElena MarrowElena MarrowDirector

Cast & crew · in cinemas October 23

Role
Art direction, UI/UX, motion, front-end
Tools
Figma, Claude Code
Scope
Promo site, booking, teaser
Concepts
5 posters, 3 type directions
Afterimage poster next to the seat map and e-ticket screens

The story

Afterimage is a thriller about a device that can recover the last image a person saw. A widow uses it on her husband and finds a woman who should not have been there.

The film, the studio, the cast and the cinemas are all invented, so the project could cover a whole launch: poster concepts, a teaser, a promo page and a booking flow that works like a real cinema's.

The look is a dark lab at night: cyan light from the retina reader, a touch of magenta glitch, thin wide-spaced titles and monospace labels that read like machine output.

3steps from seat to ticket
8seats per order
10 minseat hold
20 steaser built from stills

The idea

Motion with a meaning

Digits drift out of the reader, headlines decode, a live lens follows the cursor and reveals a second face. Every effect comes from the film's device.

Booking is the point

People come to buy tickets, so the promo page always leads to a session and the order summary never leaves the screen.

Honest errors

Seat holds, sold-out sessions and form errors explain what happened and how to fix it.

Calm for some

With reduced motion switched on, every effect stays still and the site still works.

From poster to e-ticket

Booking takes three steps in one panel, after choosing a session.

  1. Step 1

    Find a session

    Pick a city and a date, then a time. Sold-out times are struck through.

  2. Step 2

    Choose seats

    A seat map of the hall; up to 8 seats, the price updates with every tap.

  3. Step 3

    Checkout

    Seats are held for 10 minutes. Card, Apple Pay or Google Pay with formatted inputs.

  4. Step 4

    E-ticket

    Hall, time, row and seats, an order number and a QR code to scan.

Design system

A night palette with two light sources: cyan from the retina reader and a magenta glitch.

Night#07090D
Lab#13181F
Bone#E9E6DF
Reader cyan#4FD8E8
Glitch#D13FA0
Titles · Josefin Sans Thin

AFTER IMAGE

Labels · JetBrains Mono

RETINA 7F·3A — LAST IMAGE RECOVERED

Text · Archivo

A device that shows the last thing a person saw.

Get tickets · $29.50Watch teaserIMAX · 16+14:3017:1020:45

The promo site

The story, the cast and the showtimes, all on one page that leads to tickets.

afish.vercel.app
Home with the title and the glowing retina reader
01

Key art

The reader glows, digits drift out of it and a lens follows the cursor to reveal a second face.

afish.vercel.app/#facts
Film facts strip and the story headline
02

Film facts & story

Premiere date, runtime, rating and cities in one strip, then the story headline decoding letter by letter.

afish.vercel.app/#story
Story section with a synopsis
03

The story

A short synopsis in large type next to the full plot.

afish.vercel.app/#cast
Cast and crew with four portraits
04

Cast & crew

Four portraits in the same corridor light, each with a retina scan on hover.

afish.vercel.app/#tickets
Showtimes with city chips, dates and sessions
05

Find your screening

City, date and session, with the chosen show waiting above the Choose seats button.

From seat to ticket

The three booking steps, and the concepts that came before the site.

Seat map with two seats selected
Choose seatsTaken seats greyed out, up to 8 per order.
Checkout with a 10-minute hold timer
CheckoutContact, payment method and card details, with a hold timer.
E-ticket with seats and a QR code
E-ticketEverything needed at the door, and a QR code to scan.
Three poster concepts
Poster conceptsRetina scan, broken memory and the title as an image: three of five directions.
The same poster in three type directions
Type directionsClinical thriller, psychological noir and Hollywood classic on the same poster.

On a phone

The poster moves below the title, and the booking panel becomes a full-screen sheet.

Afterimage home on a phone
Home
Seat map on a phone
Seats
E-ticket on a phone
E-ticket

Decisions & details

The parts that took the most thought.

Challenge

Effects that don't get in the way

What I did

Every effect is quick and stops once read. The booking panel has no motion at all, so buying a ticket is calm.

Challenge

A seat map that works with a thumb

What I did

On a phone the map becomes a full-screen sheet with large seats and the summary pinned at the bottom.

Challenge

Finding the look first

What I did

Five poster concepts and three type directions were tested on the same text before any page was built.

See it liveOpen afish.vercel.app ↗Move the cursor over the key art, then book two seats and get your e-ticket.

What I did

  • Concept & art directionInvented the film, its key art and its look; tested five poster concepts and three type directions.
  • UI & UX designDesigned the promo page and the booking flow: showtimes, seat map, checkout and e-ticket.
  • MotionCode background, boot sequence, decoding headlines, retina scans and a live lens, plus a 20-second teaser.
  • Front-endBuilt it with Claude Code, with seat holds, form validation and a reduced-motion mode. Published on Vercel.
Next projectLinnea →
I reply within a day Based in Denmark · CET Open to product, web & apps Remote or on-site in Europe UI / UX · Web · Mobile Ukrainian · Polish · English

Have a project in mind?

Let's make it clear and beautiful

Tell me about it in a few lines. I usually reply within a day.

  • I reply within a day
  • Based in Denmark · CET
  • Open to product, web & apps
  • Remote or on-site in Europe
  • UI / UX · Web · Mobile
  • Ukrainian · Polish · English
© 2026 Alina YakuninaPodo Hotel photo: Htwzzz, CC BY-SA 4.0, via Wikimedia CommonsDesigned in Figma, built in code