← everything I built

A practice project · online now

VOLTIC

A launch page for an energy drink that does not exist.

The VOLTIC website. A black energy drink can lit in blue and green, covered in water droplets.

Website

The website

A product launch page, built to find out how good I could make one.

I made the brand up, so nothing on the page belongs to anyone else. The can in the middle is not a photograph. It is a 3D model, which is why it still looks right when you turn it around.

what it does

  • Scroll down and the can turns all the way round. You can also grab it and spin it yourself.
  • The label and the nutrition panel on the back are real typed text, not part of a picture. Images made by AI usually get small print wrong. Typed text does not have that problem.
  • The turn slows down as the back of the can comes round, so there is time to read the panel before the can fades out and the nutrition card takes its place.
  • The water droplets on the can are not photographed either. The page builds those too.
  • Getting the can to turn took two attempts. The first stitched video between two real photographs, which only looked right from the angles the photographs were taken at. Building the can in 3D fixed that.
  • A check for accessibility problems runs automatically at six points down the page, and it stops the site going out if anything fails.
0
Problems found by the automatic accessibility check
33 KB
The size of the file that draws the page
360°
You can look at the can from any angle