Additional work · Client product · Live

Brand and live ordering for a Maryland food truck

The Crab Trap brings the signature Maryland jumbo lump crab cake to Montgomery County. Its customers are on their phones — standing in line, or deciding whether to drive over — so the whole experience was designed mobile‑first, with the menu and ordering wired directly to the truck's register. Jumbo Lump. No Junk.

Role Brand identity, web design & build, POS integration

Client Food truck — Rockville, MD

Integration Clover POS: live menu, ordering, loyalty, hours

Status Live — mdcrabtrap.com

The site

Built for someone standing in line

The homepage leads with the two things a hungry visitor needs: what this is, and an Order Now button. On a phone, a persistent Order / Call bar stays pinned to the bottom of the screen and every menu row is a tap target.

Fig. 01The brand on one sheet: Maryland-flag palette, Bebas Neue over Barlow, the menu as it lives on the register, and one handle everywhere.

Three square Crab Trap social post templates: cream hero with badge and 'Maryland Crab.', red signature menu post, black 'Find The Trap.' post with Order Ahead button — Fig. 02Social templates in the truck's three registers: cream badge hero, red signature dish, black find-the-trap — every word lifted from the site and menu.

mdcrabtrap.com hero: 'Maryland's Premier Crab Cake Food Truck' in red, cream, and gold — Fig. 03The homepage leads with the two things a hungry visitor needs: what this is, and an Order Now button.

Mobile homepage with pinned Order/Call bar beside the mobile menu — Fig. 04Designed for the line: a persistent Order / Call bar stays pinned at 390px.

Menu page with category chips and menu rows with prices and photos — Fig. 05The menu isn't hardcoded — items and prices come live from the truck's Clover register, so the site can never disagree with the kitchen.

Ordering & implementation

Wired to the register, not a brochure

The site integrates directly with the truck's Clover point of sale: order‑ahead flows through Clover's hosted checkout, loyalty rewards are wired in, and ordering automatically respects business hours — with a one‑tap pause switch the owner can flip when the line gets too long. When ordering is off, every call to action falls back to tap‑to‑call. Local search was treated as a feature: structured data with live opening hours, so the truck shows up correctly when someone searches for crab cakes nearby. Accessibility was iterated on the live product — menu rows are full-width tap targets and text contrast was tuned to WCAG AA during post-launch refinement.

'Find the Trap' section with address, hours, phone, and truck photo — Fig. 06For a food truck, location and hours are the product: Find the Trap keeps them one scroll from anywhere.

Catering page with event packages and request form — Fig. 07The second revenue stream gets its own funnel: catering packages with a request form that emails the owner directly.

The brand

Maryland flag, cream badge, no junk

A Maryland‑flag‑inspired palette of red, black, cream, and gold; Bebas Neue display type; and a circular cream badge built to read on a truck, a sign, and a favicon alike.

Fig. 08Where the badge started: the rough concept before refinement.

Fig. 09The final mark.

The social share card: the truck wrap itself, with QR code, social icons, and 'Jumbo Lump, No Junk!' — Fig. 10The share card is the truck: wrap, QR code, handle, and tagline — when a link gets texted, the brand shows up in full livery.

The Crab Trap food truck in its red, black, and cream livery — Fig. 11The brand in the wild: the truck itself.

Brand & go-to-market

One handle, one voice, everywhere the truck shows up

The marketing system is deliberately small and loud: one handle — @mdcrabtrap — across Instagram, Facebook, TikTok, and X; a share card that's the truck itself; an email-and-rewards capture on the homepage; and structured data with live opening hours so local search works like a marketing channel. The social templates set the site's own copy in the brand's Bebas-and-Maryland-flag voice, so a post, the truck wrap, and the website all read as one thing.

Snag a trap — add 2 oz crab to any dish.
The Crab Trap menu

Reflection

The interface is the queue

A food truck's UX problem is time: every second between hunger and order matters. Wiring the menu to the register, pinning the order bar, and letting the owner pause ordering with one tap all serve the same insight — the site is part of the service line, not a brochure for it.

Competencies demonstrated

Mobile UX Thumb-first IA · pinned actions · tap targets

Integration Clover POS: live menu, checkout, loyalty, hours

Brand Identity from rough concept to final badge

Findability Local SEO · structured data · live hours schema