Jeffrey New York's first online store, built from zero: the brand, the site, and the way it told stories. A gallery of a shop, translated to a screen without flattening it into a catalog.
Dries Van Noten, Valentino, Vetements, a Candy Crush shoe story, summer shoes, Loewe. The masthead and footer stayed put.
The floor got regrouped every time the season shifted, and the homepage had to turn over the same way. So the templates for a launch or a new story came first, and the product pages came after.
Built to change as often as the store did
The product page ran one large photograph and little else.
A short row of curated cross-sells sat underneath. Navigation followed the edit instead of a list of categories, the same way the floor did.
Merchandising could lay out a new season without touching the templates underneath: swap the photography, swap the copy, publish. The type hierarchy did not move, which is what kept the site from sliding toward a catalog as the store grew.
Homepage editorial spread
Designer launch as the lead moment
Photography carries the page
Scroll. It fills the mat, then travels the frame
The wordmark, Avenir Next Heavy Italic set wide, worked as a graphic mark before it read as a name. Everything else stayed out of the photography's way.
The palette is narrow on purpose. Charcoal for the type, cream as the ground so the photography reads, a soft gray for captions and meta, and one yellow accent pulled straight from the wordmark for the editorial moments. There is no second accent. The merchandise brings whatever color it needs. The type is one family. Avenir Next Heavy for the wordmark and feature headlines, Demi Bold for subheads and calls to action, Medium for everything else. The weights do the hierarchy on their own, so there is no second typeface.
The markThe chart traces those four pieces from the brand experience at the center out through every surface a customer touched. Denser rays mean more assets on that surface.
Jeffrey eventually sold the business.
Strategy, brand, architecture and content, all working from the same edit as the floor. The type kept the voice steady while everything under it changed every week.
Brand System
Ecommerce Design
UX Architecture
Illustrator
Sketch
InVision
