The Runway Lookbook
The whole line stands on stage from the start, the back of the queue soft with depth, and every scroll walks the next look forward into focus.
The Runway Lookbook turns a collection page into a show that has already started. Seven looks stand in line, the front one sharp and in colour, the rest waiting behind it in a soft depth blur. Scroll and the line walks: the next look steps into focus, the front one strides off past the camera, and the shirt and trousers on stage wait in the rail beside them with their prices. The line is a circle, so the show never ends.
How it works
The page opens with all seven looks already lined up like a show about to start. The look up front stands sharp and in full colour, and the queue recedes behind it to the left, each model a step further back, smaller and more out of focus, the way a camera lens holds the front of a line. Every scroll, swipe or arrow key walks the line forward exactly one look: the next model steps up and snaps into focus while the front one walks off past the camera, big and blurred, then quietly rejoins the back of the queue, because the line is a circle and never runs out in either direction. The rail on the right always holds the shirt and trousers being worn on stage with their prices, and it changes the moment the look does, along with the running look counter.
Who it fits
Built here for a fictional menswear label with a Zara feel, it fits any brand that sells outfits rather than single items: menswear and womenswear labels, tailors, uniform makers, even eyewear ranges shot on faces. Five to ten looks is the sweet spot, each needing one cutout model shot and a product shot per piece.
Why it sells
A grid makes every look compete for attention, but a runway gives each one its moment. The depth of field does the selling: your eye always lands on the look in focus, and the blurry queue behind it promises there is more to see. Keeping the wearable pieces one click away in the rail closes the gap between watching the show and buying from it.
Recommended for
- Fashion and menswear labels
- Seasonal lookbooks
- Outfit led collections
- Shop the look pages
Common questions
What happens on each scroll?
Exactly one look. The line steps forward, the next model comes into focus and the front one exits past the camera. Input is ignored while a step is playing, so fast scrolling can never skip a look, and scrolling up walks the line backwards the same way.
How does the depth effect work?
Every model behind the front of the line is scaled down, faded slightly and blurred a little more with each step back, which reads as a camera holding focus on the front. No 3D is involved, which keeps it fast on any machine.
Is the lineup really infinite?
Yes. The looks form a circle: whoever walks off the front fades back in at the far end of the queue, so the show loops forever in both directions instead of hitting a dead end.
Can the rail sell more than two pieces per look?
Yes. The rail is a simple list tied to whichever look is on stage, so a look can carry three or four pieces, each with its own price, wishlist heart and add button.