Build report 001 / E-commerce
Verdant Life
A plant-based nutrition brand in Cape Town with paid traffic that wasn't converting. We audited the live store, found a conversion-system problem, and rebuilt it as a hand-coded, offer-first storefront with a custom cart, Stitch payments and real shipping logic, in an 18-day sprint.
The brief
Verdant Life makes quinoa-led, plant-based whole-food nutrition: porridges, baking mixes and pantry staples, made in Cape Town. The product is genuinely good: clean ingredients, real nutritional transparency, and a founder story that lands. Four products from R99 to R139, plus starter bundles at a 20% saving.
But the store was running on a stock theme, and the numbers told a familiar story: paid traffic from Meta was arriving, browsing, and leaving. This wasn't a product problem. It was a conversion-system problem. The site explained the brand, but it didn't remove enough doubt, show enough proof, or make the first purchase obvious enough for a cold, mobile-first visitor.
SED11Q was brought in to diagnose it properly, then rebuild the storefront as a custom site the client fully controls.
01 / The audit
Five questions the site had to answer faster.
We reviewed the homepage, product and collection pages, policies, and the cart and checkout start, plus the technical layer: performance, accessibility, SEO basics, page weight, and tracking. A buyer needs five answers quickly: what is this, is it for me, can I trust it, what should I buy first, and what will it cost me delivered? Those answers existed, just not in a strong enough order.
Shipping promise was inconsistent
The banner advertised free delivery over R750, while the policy listed different regional thresholds. Doubt at the exact moment a buyer calculates value. A R95 fee on a R99 product killed first orders.
One shipping promise, repeated across banner, product, cart, policy and checkout, plus a "you're R__ away from free delivery" progress cue.
No visible proof near the purchase
Food and wellness products need proof from real customers before a first purchase. The site had policies and a story, but no proof close to the decision.
A reviews section, customer photos, a founder trust block, and payment / delivery badges placed near the buy moment.
Product pages educated more than they closed
The ingredient and nutrition detail was a strength, but the purchase decision wasn't framed early enough.
Rebuild product pages around benefit, use case, proof, delivery and FAQ, with Add to Cart and price kept in reach.
Homepage was brand-first, not offer-first
A Meta visitor needs a clear starting product, not a general shop path they have to interpret.
Lead with the starter bundle and a hero product, aligned to the ad message, so the first choice is obvious.
Mobile performance and accessibility
Heavy theme sections, unused script weight, and slow paint times, on traffic that is overwhelmingly mobile and low-patience.
A lean custom build: compressed WebP media, no theme bloat, clean heading order, contrast and keyboard states.
02 / Before & after
From catalogue to guided sales path.
03 / What we built
Every section earns its place in the sales path.
Offer-first homepage
A benefit-led hero leads straight into the range and a single, obvious first order (the starter bundle at a 20% saving) instead of a brand essay.
Custom cart with upsells
A hand-coded localStorage cart with an add-to-cart modal and upsell suggestions, plus a live free-shipping progress indicator that lifts baskets past the R750 threshold.
The checkout bridge
A single PHP bridge rebuilds the cart server-side in WooCommerce with validated SKUs, then hands off to Stitch Express payment links, with a webhook callback confirming each order.
One honest shipping promise
The Courier Guy nationwide, free over R750, one consistent message repeated on the banner, product pages, cart, policy and checkout.
Semantic nutrition tables
Per-100g and per-serving data in proper HTML tables with captions and scoped headers, transparency that's also accessible and indexable.
SEO, metadata and WebP pipeline
Benefit-and-category page titles, Schema.org Organization markup, clean descriptions, and a WebP image pipeline for fast mobile paint.
The architecture
The storefront is fully static, hand-coded HTML, CSS and JavaScript served directly, which is why it's fast. The only stateful work happens in one PHP bridge: when a customer checks out, it rebuilds their cart server-side in WooCommerce with allowed SKUs only, then hands them to a Stitch Express payment flow. A webhook callback confirms the order, and the client manages fulfilment from the WooCommerce dashboard she already knows.
That pattern (static front, one narrow dynamic seam) gives the speed of a static site with the order management of a real commerce backend, and nothing else to maintain or patch.
04 / The result
Live in eighteen days.
Brief on May 23. Live store June 10. Twenty-two bugs logged and closed through the launch window, tracked in writing, not in someone's head. The client owns the code, the content, and the order pipeline outright.
Running a store like this on a template?
If your storefront is a theme with your logo on it, this is what the alternative looks like. Send one message and we'll tell you what a rebuild would involve: scope, price, timeline.