Site of the Day Teardowns
This archive documents every Awwwards and FWA Site of the Day with an in-depth teardown. Each report examines the concept, visual design, interaction and front-end build behind the award, with performance and asset data measured in a real browser.
- Reports
- 42
- Awwwards
- 24
- FWA
- 26
- Latest
- 2026.09.28
Butter
Butter's home page turns its own marketing copy into the product demo. When a visitor rests the pointer on the effect card labelled Inflate, the word blocks in the headline beside it swells into a row of purple balloon letters. On the Glow card the same word lights up with a yellow-green halo. On Focus the whole sentence blurs away except for a few sharp words, and on Halftone it breaks into red, orange and green dots. Those four cards are the thing Butter sells, effect blocks that snap onto a video, and the home page lets visitors try them on a sentence first. One screen above, a keychain with a key, a carabiner and three tags hangs over the headline, and it swings aside and back like a real one when the pointer brushes past.
Léo Parpeix - Portfolio 2026
Léo Parpeix's portfolio is not a wall of thumbnails but a sculpture studio a visitor can walk into. A plaster daisy with a face stands on the plinth in the middle of the room, and the design drawing for the same flower hangs on the wall to its right. With the finished piece and its drawing in one frame, a visitor sees both the result and the process behind it the moment they arrive. As the visitor scrolls down, the camera moves on into other rooms, such as a library lined with books.
Agrumea Farm
Every jam jar on the Agrumea Farm website gets its label stuck on by the browser. The jar is a photograph of an empty jar and the label is a flat artwork. Behind the scenes the site wraps that artwork around an invisible cylinder, lights it from the left, and paints the result back onto the jar. When a visitor turns the wheel, ten jars slide across the screen in an arc, and the label on each one turns with the direction of travel, the way a real jar rolls across a table. When the visitor rests the pointer on a jar for less than half a second, it turns a full circle on its own and brings the ingredients on the back round to the front.
Realevate
Realevate turns every page change into a trip taken by one photograph. When a visitor presses the Our Selection button in the bottom corner, the whole home page shrinks to less than half its size and sinks to the bottom of the screen. Four cards with vertical titles stand up on top of it. The visitor picks one, the photo on that card first fills the entire screen, then shrinks into a small square, and the giant title of the next page slides out from both sides of the square. At the bottom of that page the visitor clicks Next and the same move plays again. The opening animation follows the same idea, a small square in the middle of a dark blue screen cycles through four photos and finally lands where the home page photo sits.
Meer Mohsin
Meer Mohsin's personal site opens on a portrait of the man himself, with a red, thorn-like sigil pressed over his eyes like a tattoo-style mask. As the visitor scrolls, the sigil lifts off the face and becomes a spinning 3D object. It follows the visitor through all 31 screens of the page and every one of its sections, and at the very bottom it keeps spinning while a closing sound effect plays. That one sigil is what holds a whole page of black and red content together.
No Mercy Michel
No Mercy Michel is an arm-wrestling game in which the Paris studio Merci-Michel sets its own staff up as the opponents. After entering a nickname, the visitor first waits online for a human opponent, and if none turns up, a Merci-Michel employee steps in. Each of the 28 employees has an arm with its own skin tone, tattoos and accessories, so one wears a Rolex while another has a baguette and a pizza tattooed on. Matches are best of three, and the only thing being tested is who can click faster.
Guillaume Colombel
Guillaume Colombel's new portfolio has no list of projects, only a standing stone on an empty plain. To see a project, the visitor has to break the stone open, and its fragments then hang in the air, framing the project cover that was hidden inside. Each of the twelve projects has its own stone with its own veining and its own plain under its own sky, and every turn of the mouse wheel changes the stone and the sky to match the next project.
The Tie-break
The Tie-break turns a collaboration between the American sportswear brand New Balance and the Italian fashion brand Miu Miu into a match of Pong played on a tennis court. Pong is the 1972 arcade game in which two paddles knock a ball back and forth. Every time the visitor wins or loses a point, a ripple spreads across the screen from where the ball went out and uncovers a campaign photograph from the collection. The blurred patch of colour under the court during a rally is the next photograph waiting to be revealed.
Matteo Courquin
Matteo Courquin has turned his portfolio into a computer that boots up. The page opens on a screen of text imitating a computer's start-up check, and when the visitor presses Enter, a huge blackletter CREATIVE DEVELOPER appears one letter at a time. A desktop then fills with draggable windows holding his work, an introduction and his awards. In the gaps between the windows sits a live monitoring panel that records the visitor's mouse speed, clicks and key presses. The whole desktop fits within one screen, so the visitor sees everything without scrolling down.
Moto Finance
Moto Finance's website photographs a payment card as if it were a piece of jewellery. The first screen is an opening film in which a glowing light box slowly descends and lights up a metal card standing on a stone plinth. As the visitor scrolls down, the card first appears edge-on, so thin it is only a line of light, and then turns to face the camera. A ring of photographs of empty rooms, long dining tables and shadowy figures rises around it as it turns. The page uses almost nothing but black, white and grey, and the card is the only star.
Elespacio
Elespacio's new website turns its navigation into a pile of stickers. Six small labels, each leading to a different page, are stacked at the bottom left of the screen, and no two share a shape, a colour or an angle of tilt. The pile holds a tall black card, an ochre card, a blue capsule and an orange one, a dark green square and a lilac card with soft corners. When the cursor rests on one of them, that sticker puffs up. When a visitor opens a page, the sticker for that page swells into a square or a strip, as if someone had just pressed a fresh sticker onto it.