Skip to main content
jed_llorente.
get in touch.
Back to projects
// Web Design & Brand Presence • 3.5 Months (Production)

Solace Goods: Minimalist Direct-to-Consumer E-Commerce Storefront

High-converting direct-to-consumer e-commerce brand experience with slide-out cart drawer, dynamic bundle checkout, and perfect mobile UX.

Launch live application Source code archives
// BENCHMARK TELEMETRY & DELTA GAINS

Performance & Precision Metrics.

Measured across production runtimes comparing unoptimized baseline vs. final deployed build.

E-Commerce Conversion Rate +181%
Baseline: 1.18%
Production: 3.32%
Unit metric: Storefront Conversions
Average Order Value (AOV) +51%
Baseline: $48.00
Production: $72.50
Unit metric: Smart Bundle Drawer
Cart Abandonment Rate -33.8%
Baseline: 74.2%
Production: 49.1%
Unit metric: Frictionless Drawer Checkout
Mobile TTFB & Checkout Speed -93.8%
Baseline: 1.8s TTFB
Production: 110ms TTFB
Unit metric: High-Speed Cloud Hosting
// SYSTEM TOPOLOGY & PIPELINE

Architectural Dataflow.

Sequential execution pipeline from data ingestion to user presentation.

[01] DEPLOYED

Custom WooCommerce Theme

Zero Heavy Third-Party Plugins

↳ PHP 8.2 / WP
[02] OPTIMIZED

Tailwind Asset Pipeline

Tree-Shaken CSS Under 18KB

↳ Vite JIT
[03] HYDRATED

Slide-Out Cart Drawer

Instant Subtotal & Upsell Bundles

↳ Alpine.js
[04] ENABLED

Stripe Express Gateway

Apple Pay & Google Pay 1-Click

↳ Stripe Elements
[05] CACHED

Cloudflare Edge Cache

Sub-120ms Global Page Delivery

↳ Edge CDN / SSL
// IMPLEMENTATION ARTIFACTS

Interactive Code Walkthrough.

Key implementation logic, state machine controllers, and event dispatchers.

ℹ Instantaneous cart mutations without page reloads or layout shift.
1
export function addItemToDrawer(sku: string, quantity: number) {
2
CartStore.updateOptimistic(sku, quantity);
3
fetch('/wp-json/wc/store/v1/cart/add-item', { method: 'POST', body: JSON.stringify({ id: sku, quantity }) });
4
}
// ENGINEERING WRITEUP & SPECIFICATION

Implementation Deep Dive.

Brand Identity & Storefront Engineering

Solace Goods is an artisan lifestyle apparel and accessories brand requiring a modern digital storefront that elevated product photography while keeping checkout lightning-fast.

Technical Highlights

  • Engineered a custom WooCommerce theme bypassing heavyweight e-commerce plugins in favor of clean REST endpoints.
  • Implemented an instant slide-out cart drawer with live subtotal calculation and one-click express checkout via Apple Pay and Stripe.
  • Integrated structured product schema (JSON-LD) for enhanced Google Rich Snippets and merchant search visibility.