Marrow & Oak
Website & Storefront Proposal
No. MO · 2026 · 019
Headless Shopify build & brand site

A storefront
worth the
first sip.

A headless commerce build and editorial brand site that makes Fellow & Field feel as considered online as the coffee tastes in the cup.
Stack
Hydrogen + Shopify
Scope
Site + Store + Subs
Timeline
14 weeks
Prepared for
Dana Okafor · Founder, Fellow & Field Coffee
Fixed project investment
$48,000
01 Where you are today
A great roaster on a rented shelf

Fellow & Field has the hard part solved — a roast people drive across town for, a wholesale list of forty cafés, and a story worth telling. What you don't have is a home for it. Right now the brand lives on a generic Shopify theme three other roasters also use, the subscription is a clumsy bolt-on, and every wholesale order still lands in your inbox as a PDF.

2.1%
Storefront conversion — roughly half of what a focused DTC coffee site should clear
~9%
Of revenue from subscriptions today, on a product built for recurring purchase
3.4s
Mobile load on the current theme — every second past two costs you orders

The headroom here is the good kind of problem. A product this loved, leaking this much intent on a site that fights it, is exactly the brand a rebuild pays for fastest. This proposal lays out the site we'd build, how we'd build it, and what it costs.

02 How we work
Built in the open, shipped in order

We don't disappear for three months and unveil a website. You'll see the work as it forms — in design files you can click and a staging URL that's live from week one. Four principles shape every project we take:

01

Strategy before pixels

We start with the buyer, not the homepage — what a first-time taster needs to feel, what a subscriber needs to stay. Every later decision traces back to that.

02

Design you can interact with

High-fidelity Figma prototypes you click through, not flat mockups. You'll feel the cart, the subscribe flow, and the mobile menu before we write a line of production code.

03

Headless, but never fragile

A Hydrogen storefront on Shopify's commerce engine — fast and bespoke on the front, boringly reliable on the back. Your checkout is Shopify's; your experience is yours.

04

Handed off, not handcuffed

You get the repo, the CMS, and a Loom library on launch day. Edit a blog post or swap a hero without calling us — and call us when you'd rather not.

03 What we're building
Scope & deliverables

One project, three surfaces that share a design system: an editorial brand site, a headless storefront, and a subscription experience that finally fits the product. Here's the shape of it.

> Editorial brand site

Home, our-story, sourcing, and a journal — a content model in Sanity so you publish origin stories and brew guides without a developer.

> Headless storefront

Hydrogen PDP, collections, and cart built on the Storefront API. Roast-level, grind, and bag-size variants done right, with fast filtering.

> Subscription engine

A first-class "coffee on repeat" flow — cadence, swap, skip, and pause — wired through your subscriptions app, not buried in a third-party portal.

> Wholesale portal

A gated re-order area for your forty cafés: net-terms pricing, saved orders, and one-click reorder, so the inbox PDFs stop.

project.scope — technical spec
frameworkHydrogen (React) on Shopify Oxygen
commerceShopify Plus · Storefront API · native checkout
cmsSanity — journal, story pages, brew guides
subscriptionsRecharge / Shopify Subscriptions API
templates14 unique page types // home, PDP, collection, journal, +10
integrationsKlaviyo · Shopify Search · GA4 · accounts
perf_targetLCP < 1.8s · Lighthouse 95+ mobile
a11yWCAG 2.1 AA · keyboard + SR audited
[+] Brand-aligned design system & tokens
[+] Clickable Figma prototype (desktop + mobile)
[+] 14 responsive page templates, hand-built
[+] Sanity CMS schemas + editor training
[+] Product & collection data migration
[+] Subscription + wholesale flows, end to end
[+] SEO foundation, redirects & analytics
[+] Source repo, docs & Loom handoff library
04 The plan
Four phases, fourteen weeks

Each phase ends in something you can hold — a signed-off direction, a prototype, a staging site — and triggers the milestone payment tied to it. Nothing moves to the next phase until you've approved the last.

1
Weeks 1–3 · Discovery

Strategy & foundations

Buyer and content workshops, information architecture, a moodboard direction, and the design system foundations. You approve a direction we both believe in.

deliverable → IA map · art direction · design tokens
2
Weeks 4–7 · Design

Design & prototype

High-fidelity designs for all 14 templates and a clickable prototype of the core journeys — browse, buy, subscribe — on desktop and mobile.

deliverable → full Figma library · interactive prototype
3
Weeks 8–12 · Build

Headless build & CMS

Hydrogen front end, Sanity content model, subscription and wholesale flows, integrations, and data migration — on a staging URL you can poke at weekly.

deliverable → staging site · CMS · QA pass
4
Weeks 13–14 · Launch

Launch & handoff

Cross-browser QA, performance tuning to target, a controlled DNS cutover, and a handoff session with docs and Looms. Then two weeks of post-launch cover.

deliverable → production launch · handoff · 14-day warranty
05 The investment
Fixed price, paid by milestone
Total project investmentFixed scope, fixed price — no hourly surprises
$48,000USD · all phases included

Billed against the work, not the calendar. Each milestone invoices when its phase is approved, so payment always follows a deliverable you've already seen and signed off.

20%
Discovery
Due at kickoff · reserves the start date
$9,600
25%
Design
On approval of the design library & prototype
$12,000
40%
Build
On delivery of the QA-passed staging site
$19,200
15%
Launch
On production launch & handoff
$7,200
Total fixed projectFour milestone payments · net-14 terms
$48,000

Roast & Roll care plan — optional

After launch: hosting, monitoring, security patches, dependency upkeep, and 3 hours of content or design changes a month. Cancel any time.

$850
PER MONTH
Investment covers the full scope on the preceding pages. Out-of-scope additions are quoted before any work begins and never assumed. Third-party costs (Shopify Plus plan, Sanity, Recharge, Klaviyo) are billed by those vendors directly to you. Pricing held for 30 days from the cover date.
06 Why Marrow & Oak
A small studio that ships

We're a four-person studio — two designers, two engineers — and the people in this proposal are the people who'll build your site. We take three or four projects a year so each one gets the attention a brand like yours deserves. Headless commerce is what we do most.

+38%
Storefront conversion lift for a Brooklyn tea brand after moving them to a Hydrogen build.
0.9s
Mobile LCP shipped for a DTC chocolate maker — down from 4.1s on their old theme.
Subscription revenue for an olive-oil label inside two quarters of a rebuilt subscribe flow.
"They understood our coffee before they touched our website. The build was on time, on budget, and the first thing customers mention now is how good the site feels."— Marcus Vale · Founder, Cedar & Steam Tea
07 The fine print, plainly
Terms

Ownership & handoff

On final payment, all source code, design files, and content are yours — transferred to your repo and accounts. No license to claw back, no lock-in.

Revisions

Two rounds of revisions included in the Design phase. Further changes within scope are folded in; new scope is quoted first, never billed by surprise.

Browser & device support

The latest two versions of Chrome, Safari, Firefox, and Edge, plus iOS and Android — tested on real devices, not just emulators.

Warranty

14 days of free defect fixes after launch. A bug introduced by us is ours to fix, full stop — separate from any care plan.

Timeline & dependencies

The 14-week schedule assumes timely feedback (within ~3 business days) and content ready by the build phase. We'll flag slippage early, both ways.

Validity

This proposal and its pricing are valid for 30 days from the cover date. Your start date is reserved on signature and the Discovery deposit.

Let's build it

Ready to pour Fellow & Field a real home?

Signing below approves the scope, timeline, and the $48,000 fixed project investment and its milestone schedule as set out on the preceding pages, and reserves your kickoff date. We'll send the agreement and the Discovery invoice the same day — and once the deposit lands, week one starts.

DISCOVERY DEPOSIT (20%) TO START  ·  $9,600
Dana Okafor · Fellow & Field Coffee
Date