Concept: a coffee bar and morning bakery with two shops in Burlington, VT. The site is built from the shop's printed paper goods: a stamped kraft bag, pastry-case price cards, the old punch card and the gift card. One blue rubber-stamp mark repeats across the images. Every texture, card, stamp, rotation and shadow is baked into the image files by bake.py, so the page itself only uses native modules, two fonts and the color tokens. No Code Block on this site. Assets are in img/ next to this page.
Buttons: square corners (radius 0). Primary = solid brand with white text. Secondary on dark = white outline. On the brand-blue module the button is solid white with ink text. No page background is cream or beige; kraft brown only appears inside images.
| Item | Settings |
|---|
| Spotlight banner | On, top of every page, brand bg, white text, 3 messages rotating every 4s:
1. "Pastries sell out by 11. Order ahead and we'll hold yours." → Online Ordering
2. "Pennant Rewards: earn on every coffee, at the counter or online. Join" → Loyalty page
3. "Gift cards go out by email in a couple of minutes. Send one" → Gift Cards page |
| Navigation | Sticky ON, overlaid OFF, white. Logo img/logo.png (640×164, transparent). Links: Pastry case (anchor to module 2), Rewards (Loyalty page), Gift cards (Gift Cards page), Locations (anchor to module 8). Primary CTA "Order ahead" → Online Ordering. Cart ON. Favicon img/stamp-mark.png. |
| Mobile CTA banner | On, mobile only, brand bg: "Order ahead" → Online Ordering |
| Pop-up | Image img/popup.webp (1000×620, punch card crop). Heading "Get a pastry on us". Text "Join Pennant Rewards and your first pastry is free with any drink." Button "Join Pennant Rewards" → Loyalty page. Show once per visitor, on the homepage only. The offer itself has to be set up in Toast Loyalty before this goes live (or change the copy). |
| Footer | Toast default, Text color bg. Logo img/logo-white.png. Locations, hours and phone from Toast data: Pine Street, 418 Pine St, (802) 555-0142, every day 6:30a to 3p; North Winooski, 236 N Winooski Ave, (802) 555-0167, Mon to Sat 6:30a to 2p, Sun 7a to 2p. Links: Order online, Pennant Rewards, Gift cards, Email list (Email Marketing page), Instagram. Add "Concept design by Coursed" if the footer text field exists. |
| # | Module | Settings | Assets | Copy |
|---|
| 1 | Welcome | Background image, text box bottom-left, box color = Text #10201A, white text, 2 buttons. Tallest height that doesn't crop the cup. | hero.webp 2400×1300. Cold grade and blue ring stamp baked in (stamp sits bottom-right so the text box never covers it). | H: The ovens go on at four.
Text: Two coffee shops in Burlington with a bakery in the back. Get here early, or order ahead and we'll hold it for you.
Buttons: ORDER AHEAD (solid → Online Ordering), SEE THE PASTRY CASE (white outline → anchor module 2) |
| 2 | Menu Items | White bg, 3 across on desktop, item image + name + description + price ON, 1 button. Anchor: Pastry case. | Upload these as the POS item images: case-bun.webp, case-knot.webp, case-croissant.webp, case-ham.webp, case-donut.webp, case-scone.webp (1000×1000, price card + shadow baked in). | H: The pastry case
Text: Baked every morning in small trays. When a tray is gone, that's it until tomorrow.
Items (POS): Sesame Morning Bun 4.75, Cardamom Knot 4.50, Butter Croissant 4.25, Ham & Cheddar Croissant 6.50, Cider Donut 3.25, Blueberry Scone 4.00
Button: ORDER PASTRIES AHEAD (solid → Online Ordering) |
| 3 | Single Image + Text | Surface #E8EEEB bg, image left, text left-aligned, no button | bag-stamp.gif 560×560, 305 KB, loops: stamped bag, fresh bag, stamp comes down, lifts. Static fallback bag.webp. | H: Every bag gets a stamp
Text: Somebody at the counter inks it by hand while your drink is being made. The bags are plain brown paper, and they compost. |
| 4 | Menu Group | White bg, list layout, 2 columns, no images, POS group "Coffee Bar" | none (POS) | H: Coffee bar
Drip 3.25, Cortado 4.25, Latte 5.25, Maple Latte 6.00, Chai 5.50, Hot Chocolate 4.75 (descriptions from POS) |
| 5 | Single Image + Text | Text #10201A bg, white text, image right. Anchor: Rewards. | punch-card.webp 1600×1100, lossless so the baked #10201A bg matches the module exactly. | H: The punch card, without the card
Text: Pennant Rewards replaced the paper card we used to punch. You earn points on every order at either shop or online, and they turn into free drinks and pastries.
Button: JOIN PENNANT REWARDS (solid brand → Loyalty page) |
| 6 | Single Image + Text | Brand #2B3FD6 bg, white text, image left. Anchor: Gift cards. | gift-card.webp 1600×1100, lossless, bg baked to brand. | H: Gift cards
Text: Send one by email in a couple of minutes, or pick up a plastic one at the register. They work at both shops and on online orders.
Button: BUY A GIFT CARD (solid white → Gift Cards page) |
| 7 | Media (image) | Full width, top and bottom spacing 0 | lake.webp 1800×1000, label tag baked in. | Alt: Lake Champlain in January, a ferry iced in at the Burlington waterfront |
| 8 | Single Image + Text | White bg, image right, text left-aligned. Anchor: Locations. | shops.webp 1200×1400, light stamp baked in. | H: Two shops
Pine Street / 418 Pine St, in the South End / (802) 555-0142
North Winooski / 236 N Winooski Ave, in the Old North End / (802) 555-0167
Both open at 6:30 every morning. Hours for each shop are at the bottom of the page.
Button: ORDER FROM EITHER SHOP (solid → Online Ordering) |
| 9 | Testimonials | Surface bg, auto-pull 4 and 5 star Google reviews (max 6). Needs each Google Business Profile linked. | none | H: From Google reviews. Nothing typed; the mock shows placeholder cards. |
All photos are cropped, color graded and have printed elements composited on top. The BY-SA images make the derived files BY-SA too. If this concept goes to a real client, replace them with the shop's own photos.
.jpg){kind=link}
.jpg){kind=link}
