Energy & infrastructure · Interface animation

Guiding a first-time user through hydrogen refuelling

The brief carried an unusual requirement: the sequence had to feel calm, about a fuel that is neither.

Client
Hydrogen refuelling · anonymised
Use
Station interface, operating guide
Delivered
2023
Source
Client CAD, rebuilt

Station interface sequence · 8 min · 12,000 frames · EXR and JPEG sequences

The problem

The screen is the entire training

A driver arrives at a hydrogen station having never used one. There is no attendant. Between them and the fuel is a screen, a hose, and a nozzle that locks under pressure.

That screen is the whole of their instruction. If a step is ambiguous, they misconnect. If the graphics look alarming, they hesitate, or drive away and do not come back. Written instructions fail here: they are read too slowly, in the wrong order, and often not in the reader's own language.

The constraint

Calm, about something that is not

The client's requirement was explicit and unusual. The sequence had to feel safe and unhurried, despite the subject being a highly flammable gas held at extreme pressure. The visuals had to lower a first-time user's heart rate rather than raise it.

Accuracy was safety-critical at the same time. Every step had to match the physical sequence exactly, in order, with no gesture a viewer could copy incorrectly. Revisions were frequent and specific.

Two audiences had to be served. Passenger vehicles and heavy vehicles use different equipment and different operators, and there were two formats, the station's own screen and a longer continuous guide in a different aspect ratio.

The approach

Colour only where it carries meaning

The aesthetic was developed for the project: near-white, near-shadowless, no environment to react to. Calm was treated as a safety requirement rather than a style preference, and everything followed from it.

Colour appears only where it means something. The nozzle is blue. The ring turns green when the connection locks. Hydrogen moving through the hose is the only other colour on screen. Everything else, including the operator, is untextured geometry with the mesh left visible, which removes identity, clothing and brand from the frame, and reads as technical rather than as stock footage.

Cloth simulation was deliberately underdriven. In an instructional sequence, anything that moves and is not the instruction is a distraction.

Pacing was treated the same way. The finished guide runs eight minutes across twelve thousand frames, not because there is eight minutes of action in it, but because each movement is slow and each step holds. A viewer following instructions in real time cannot be hurried, and speed reads as urgency.

The sequence

One state change per step

Operator in plain workwear guiding a blue nozzle toward the vehicle receptacle. The nozzle is the only coloured object in the frame.

01 · Connect, blue marks the only object the user must handle

The same nozzle seated in the receptacle with a green ring illuminated, indicating the connection has locked.

02 · Locked, a green ring is the whole confirmation

Operator returning the nozzle to its holster on the station after refuelling.

03 · Return, the step users most often get wrong

The build

Cut for a screen, then re-cut as one film

The station and nozzle were supplied as CAD and rebuilt before animation, the same problem every manufacturing assembly presents: geometry built to be made, not to be moved or rendered close-up.

The step sequences were produced first, as discrete clips for the station screen. The decision to also produce a single continuous guide came afterwards, which meant writing transitions between sequences that had never been designed to connect. Each was then delivered at its own resolution, 1920×960 for the guide and 1210×440 for the station's own display, and in two variants: a passenger vehicle with an everyday driver, and a heavy vehicle with an operator in industrial workwear.

Deliverables

What was supplied

Step sequences for the station interface
Continuous operating guide · 8 min · 12,000 frames
1920×960 and 1210×440
Two audience versions, passenger and heavy vehicle
EXR and JPEG sequences

Result

Where it went

The sequences run at the station as its operating interface, and the continuous guide is available to view on site.

The client is not named and the station itself is not shown. The stills on this page were cleared for release.

Two audiences

Same procedure, different driver

Passenger car being refuelled with a pistol-grip hydrogen nozzle, no operator in frame.

Passenger vehicle variant, different equipment, different handling

Start

Have something similar to explain?

Much of this work sits under NDA. Ask, and we can usually discuss it privately.