Guide · 0 steps

Build your online store with Claude

One prompt for Claude to build you a complete online store: storefront + admin panel, clickable and ready to present. Swap in your brand and it works for any kind of business.

A complete online store from a single prompt

With this prompt, Claude builds you an online store you can click through from start to finish: a public storefront (home, collections, product, cart, checkout, account and order tracking) and an admin panel with a dashboard, orders, products, customers, shipping, coupons and reviews. It all runs on in-memory sample data, so the cart, favorites and admin changes update live. Change the brand, the type of business and the palette, and it works for jewelry, clothing, candles, coffee — anything.

The prompt (copy and paste it into Claude)

Build a complete, clickable, interactive prototype of an online store for [TYPE OF BUSINESS] called "[BRAND NAME]". Include both the public store (storefront) and an admin panel. Use in-memory mock data to simulate products, orders, users and shipments. Multiple screens with real navigation between them.

BRAND IDENTITY (strict)
- Aesthetic: [describe the feel of the brand: soft luxury / minimalist / youthful / handcrafted / tech, etc.]. Elegant, spacious, editorial, consistent. Reference level: [reference brand].
- Palette (based on the logo): Base background [color], main brand color [color], accent [color], text [color]. Plenty of breathing room between sections.
- Typography: headings in [elegant serif/sans], body text and navigation in [thin sans-serif], with wide letter-spacing in menus.
- Premium details: soft diffused shadows, no hard borders, slightly rounded corners, subtle micro-interactions (fade-in on scroll, slow hover with zoom). Mobile-first and fully responsive.

A) PUBLIC STORE (STOREFRONT)
1. Thin top bar with a rotating message (shipping, brand promise).
2. Navigation: logo, category menu, icons for search, favorites (with counter), account and cart (with counter).
3. Home: editorial hero with a large headline, subtitle and main button; collections grid; featured products (photo, name, price, add to cart and favorite); brand story section; shoppable Instagram-style feed (hovering shows the tagged product); trust strip (secure shipping · secure payment · guarantee); newsletter block with a welcome discount.
4. Collection page: sidebar filters (category, price, material/attribute, color), sorting, grid with quick favorite and quick view.
5. Product page: gallery, name, price, variant selector, size guide in a modal, materials/care tab, main "Add to cart" button, favorite, WhatsApp button "Ask about this piece", reviews with photos and stars, and related products.
6. Cart (slide-out drawer + page): editable quantity, subtotal, discount coupon, shipping calculated by order amount, "Checkout" button.
7. Multi-step checkout: contact -> address (with Mexican state/ZIP code and shipping calculated by zone) -> shipping method (standard/express) -> payment (card, PayPal, OXXO, Mercado Pago) -> summary and confirmation with order number.
8. Favorites / wishlist: saved pieces, move to cart.
9. User account: login and sign-up; dashboard with my orders, package tracking (timeline: confirmed -> preparing -> shipped -> on the way -> delivered, with tracking number and carrier), favorites, my details, and a points/rewards program.
10. Content pages: Contact (with a floating WhatsApp button across the whole site), Policies, Shipping & returns.

B) ADMIN PANEL (separate access, sidebar layout)
- Separate admin login.
- Dashboard: sales for the day/month, number of orders, average order value, low-stock products, sales chart.
- Orders: table with status, search/filter, view details, change status and assign tracking number + carrier (feeds the customer's tracking).
- Products: inventory; create/edit (name, price, photos, variants, stock, attributes).
- Customers: list with purchase history and points.
- Shipping: rates by zone/state and free-shipping threshold.
- Coupons: create and manage codes.
- Reviews: moderate (approve/reject).

IMPLEMENTATION NOTES
- In-memory state so the cart, favorites, session and admin changes update live.
- Realistic sample products with elegant placeholder photos and prices in MXN.
- Changing an order's status in the admin should show up in the customer's tracking.
- Consistent, professional design, ready to present as a demo to investors or clients.

Fill in the [brackets] with your brand, type of business and palette (ideally colors pulled from your logo). The more specific you are about the aesthetic and the reference brand, the more professional the demo turns out. Tip: if you want to review it in parts, ask for the storefront first and the admin panel after.

Want a real online store? If you want to turn this demo into a real, working store, send us a message and we'll walk you through it.