# Commerce Brand (/templates/commerce-brand)

A warm, product-forward DTC marketing site for a fictional specialty-coffee roastery.

Fieldnote is a fictional specialty-coffee roastery: a warm, tactile, product-forward DTC marketing site concept spanning Home, Collection, Our Story, Journal, and Contact — cream paper and deep espresso ink with one burnt-orange ember accent, token-derived product plates, soft rounded geometry, and a roast-to-order promise carried through every page, composed entirely from blocks in the open registry.

Status: Concept preview · Revision 4
This is a browsable full-site concept. Every section is composed from blocks in the open registry, and one command installs the whole block set — the curated copy shown here is not seeded, so you assemble the pages yourself in the admin.

## Installation

```bash
npx payload-components add-template commerce-brand
```

## Included blocks

- [hero-kinetic](https://www.payload-components.xyz/docs/components/hero-kinetic)
- [logo-cloud-marquee](https://www.payload-components.xyz/docs/components/logo-cloud-marquee)
- [content-showcase](https://www.payload-components.xyz/docs/components/content-showcase)
- [feature-cards-media](https://www.payload-components.xyz/docs/components/feature-cards-media)
- [stats-proof](https://www.payload-components.xyz/docs/components/stats-proof)
- [testimonials-wall](https://www.payload-components.xyz/docs/components/testimonials-wall)
- [pricing-cards](https://www.payload-components.xyz/docs/components/pricing-cards)
- [call-to-action-centered](https://www.payload-components.xyz/docs/components/call-to-action-centered)
- [hero-video](https://www.payload-components.xyz/docs/components/hero-video)
- [content-rows](https://www.payload-components.xyz/docs/components/content-rows)
- [content-image-lead](https://www.payload-components.xyz/docs/components/content-image-lead)
- [faq-card](https://www.payload-components.xyz/docs/components/faq-card)
- [call-to-action-boxed](https://www.payload-components.xyz/docs/components/call-to-action-boxed)
- [hero-basic](https://www.payload-components.xyz/docs/components/hero-basic)
- [content-quote](https://www.payload-components.xyz/docs/components/content-quote)
- [content-stats](https://www.payload-components.xyz/docs/components/content-stats)
- [team-grid](https://www.payload-components.xyz/docs/components/team-grid)
- [content-community](https://www.payload-components.xyz/docs/components/content-community)
- [content-image-frame](https://www.payload-components.xyz/docs/components/content-image-frame)
- [contact-routing-form](https://www.payload-components.xyz/docs/components/contact-routing-form)
- [faq-split](https://www.payload-components.xyz/docs/components/faq-split)

## Page plan

### Home (/)

Fieldnote — Coffee roasted to order
Opens on the kinetic shopfront — the roast-day headline, the film-still plate, and a running shop index — then works down through the shelf, the craft, the proof on an espresso band, and the standing orders.

1. hero-kinetic — shopfront
2. logo-cloud-marquee — stockists
3. content-showcase — range
4. feature-cards-media — craft
5. stats-proof — proof
6. testimonials-wall — notes
7. pricing-cards — subscription
8. call-to-action-centered — cta

### Collection (/collection)

Fieldnote — The Collection
Presents the four coffees as an illustrated shelf, explains what the grind options actually mean, tells one origin story in full, and answers the questions people ask before ordering.

1. hero-video — hero
2. content-rows — products
3. feature-cards-media — grinds
4. content-image-lead — origin
5. faq-card — faq
6. call-to-action-boxed — cta

### Our Story (/story)

Fieldnote — Our Story
Grounds the roastery: the mill, the rule about inventory, a grower in her own words on the espresso band, the sourcing record, the three people at the drum, and the open cupping table.

1. hero-basic — hero
2. content-image-lead — mission
3. content-quote — quote
4. content-stats — sourcing
5. team-grid — roasters
6. content-community — community
7. call-to-action-boxed — cta

### Journal (/journal)

Fieldnote — Journal
A brewing-and-origin journal that keeps the roastery in the conversation: the recent posts, four recipes we would use at home, and one long read from the bench.

1. hero-basic — hero
2. content-rows — articles
3. content-showcase — guides
4. content-image-frame — feature
5. call-to-action-centered — cta

### Contact (/contact)

Fieldnote — Contact
Routes retail, wholesale, and visitor questions to three named desks at the reserved fieldnote.example domain, then answers the practical ones — without collecting any real data.

1. hero-basic — hero
2. contact-routing-form — contact
3. faq-split — faq

## Visual direction

Warm cream paper and deep espresso ink with a single burnt-orange ember accent, soft rounded geometry, token-derived product plates, and a relaxed editorial rhythm.
Tone: Warm, Tactile, Product-forward