# Storefront 004 — Storefront Work Archive — Dropout Studio

[Canonical page](https://dropoutstudio.co/storefront-library/storefront-004)

The proven editorial base, running unchanged while its own design direction is chosen. — showcased storefront design work by Dropout Studio.

The proven editorial base, running unchanged while its own design direction is chosen.

Category: E-Commerce

Status: work in progress. Storefront design showcase, not a listing to buy.

Your brand deserves a storefront that starts from a proven base instead of a blank canvas. Introducing Storefront 004 — an editorial Shopify experience that today ships the Warm Editorial Luxe frontend unchanged, designed to merchandise clearly, convert reliably, and take on a bespoke design direction next.

## What it included

- The Warm Editorial Luxe frontend, running unmodified on the shared backend.
- Full-bleed photographic hero with a centered serif wordmark and floating discovery card.
- Left category rail with live counts plus pill sort and column-density controls.
- Editorial featured-product modules with save badges and pre-order flows.
- Predictive search with product, collection, and article result tabs.
- Wishlist, recently viewed, and order history for repeat revenue.
- A clean slate for a bespoke frontend without rebuilding the commerce layer.
- Installable mobile app for loyal and repeat shoppers.
- Cloudflare edge delivery with Shopify-backed real-time data.

## Conversion ingredients

- Proven Base — The finished editorial frontend, unchanged, with nothing experimental in the way
- Editorial Sequencing — Story-led flow that keeps attention high and click paths clear
- Category Rail — Persistent collection navigation with counts on every commerce page
- Design Runway — A blank frontend brief on top of commerce plumbing that already works
- PWA Ready — App-like revisit experience with offline route fallback
- Edge Runtime — Global edge delivery for consistently snappy browsing

## Best-fit teams

- teams who want the proven 002 frontend
- a starting point for a bespoke design
- no surprises, no custom frontend yet

## Stack signals

- Hydrogen
- React
- Typescript
- Tailwind CSS
- Shopify
- GraphQL
- shadcn/ui

## Pages included

- home — Photographic hero, curated rails, and editorial featured-product modules
- collection views — Category rail with pill sort and column-density controls
- product detail — Variant picker, order summary card, and pairs-well-with recommendations
- search — Predictive search overlay plus full results page
- account center — Orders, returns, addresses, profile, and subscriptions in one place
- wishlist — Save list flow designed to bring buyers back
- content + support — Blog, contact, FAQ, and policy pages for trust and clarity
- system pages — Sale, offline, sitemap, and not-found routes for resilient ops

## Screenshots

- [Storefront 004 homepage hero — the unchanged editorial base: full-bleed photography, centered serif wordmark, and a floating collection discovery card](https://dropoutstudio.co/_app/immutable/assets/sf-004-home.jsMWxhcO.avif)
- [Storefront 004 all products collection — centered serif title with a left category rail, pill sort and column controls, and rounded product cards](https://dropoutstudio.co/_app/immutable/assets/sf-004-collection.BoEvbq8X.avif)
- [Storefront 004 product detail — left category rail, large square product image, and a variant picker beside an order summary card](https://dropoutstudio.co/_app/immutable/assets/sf-004-product.eMR6QgSw.avif)
- [Storefront 004 homepage featured product module — editorial split card with a save badge, pre-order button, and view product call to action](https://dropoutstudio.co/_app/immutable/assets/sf-004-home-mid.cD0rGJha.avif)
- [Storefront 004 search results — serif slash heading, underlined query field, and product, collection, and article filter pills](https://dropoutstudio.co/_app/immutable/assets/sf-004-search.CgjagpcL.avif)
- [Storefront 004 wishlist page — empty state in a dashed panel with a heart icon tile and a start shopping button](https://dropoutstudio.co/_app/immutable/assets/sf-004-wishlist.BCXkeGK8.avif)
- [Storefront 004 product page scrolled — pairs well with related product rail beneath a floating pill navigation bar](https://dropoutstudio.co/_app/immutable/assets/sf-004-product-scrolled.DlXjtrVH.avif)
- [Storefront 004 account orders page — account required sign-in gate in a dashed panel with a lock icon tile](https://dropoutstudio.co/_app/immutable/assets/sf-004-account.D_C8zvXx.avif)

Last updated: July 9, 2026

Live walkthroughs (published showcase count): 0

[View storefront demo](https://storefront-004.beyourahi.workers.dev/)

[Storefront Work Archive](https://dropoutstudio.co/storefront-library)

[Explore E-commerce](https://dropoutstudio.co/services#e-commerce)

[Site context](https://dropoutstudio.co/llms.txt)