Yodo Coffee

YODO roasts single origin coffee from Costa Rica and ships it from Miami, selling 200g whole bean bags such as TABA and NAJO in the $20 to $30 range alongside a subscription option. The brand states it holds no warehouse inventory, roasting each lot to order and working direct with growers on the Nicoya Peninsula. Coffee is sold direct to consumer and through a network of roughly 25 stockists across the United States and Canada. The store runs on Shopify.

Website Design

A Mac OS 9 desktop, rebuilt in a browser. The homepage opens as a working desktop simulation, complete with a menu bar reading Sleep, Restart and Shut Down, a startup chime prompt, and draggable windows labelled About This YODO, The Catalog, Stockists, Origin and Instagram. Each window behaves like a Finder folder, listing files such as README.txt, SOURCING_TRIP.png and stockist_nyc.png with fake kilobyte sizes.

Shop templates drop the costume. Once a shopper clicks into the catalog or a product page, the interface reverts to a plain, conventional Shopify layout in black text on white. The retro treatment is confined to the homepage and its windows rather than applied throughout.

A kraft and near-black palette. The desktop background and footer run in a warm taupe close to #8a877e, text sits in a near-black #211F1A, and panels lighten to an off-white #F2F0EA. These tones match the kraft paper coffee bags photographed on the product pages.

Shopping Experience

The catalog reads like a spreadsheet. Inside its desktop window, the product list appears as a table of Name, Price and Order columns rather than a conventional image grid, before the shopper reaches the standard bag photography on the shop page itself.

A one-time or subscription choice at the buy box. Each product page offers a one-time purchase alongside a discounted subscription that auto-renews and can be skipped or cancelled, set directly beside the Add to Cart button.

Standard Shopify checkout. Express options for Shop Pay, PayPal and Google Pay sit above the card fields, with a summary column listing the single item and its subtotal.

Brand Storytelling

A joke file among the real ones. The desktop includes a decaf.txt document that cannot be opened, its tooltip reading “nice try,” a small aside on a brand that otherwise centers caffeine and freshness.

Surf report as sourcing metaphor. A widget styled as a morning surf report for Nosara sits beside the origin notes, tying the Costa Rican coastline directly to the sourcing story rather than treating it as decoration alone.

Notable Features

A Spotify window on the desktop. A Now Playing panel links out to a YODO Sessions playlist, framed as another open application rather than a simple embedded player.

Stockists as a card catalog. The store locator lists partners such as Happier Grocery in New York and Basquet in Miami in a record format, with fields for city, address and stock status rather than a plain list or map pin.

Yodo Coffee Shop Page Example

Yodo Coffee Product Page Example

Yodo Coffee Checkout Page Example

Yodo Coffee Footer Example