# Ecommerce Design

> E-commerce UX patterns including product pages, cart design, checkout flows, and conversion optimization.

- Skill: `dragoon0x/ecommerce-design` (Agent Skill)
- Install (CLI): `npx skillmds@latest add dragoon0x/ecommerce-design`
- Raw SKILL.md: https://api.skillmd.com/api/skills/dragoon0x/ecommerce-design/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: dragoon0x (https://skillmd.com/u/dragoon0x)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/dragoon0x/ecommerce-design

---


# Ecommerce Design

## Product Page
- Hero image: large, zoomable, multiple angles.
- Price: prominent, with sale price formatting (strikethrough original).
- Add to cart: primary CTA, always visible (sticky on mobile).
- Variants: visual selectors (color swatches, size buttons).
- Reviews: star rating + count near title, full reviews below.
- Trust signals: shipping info, return policy, secure payment.

## Cart
- Thumbnail + name + quantity + price per item.
- Editable quantity. One-click remove.
- Subtotal + estimated shipping + tax breakdown.
- "Continue Shopping" + "Checkout" buttons.
- Cart accessible from anywhere (header icon with count).

## Checkout
1. Information (email, shipping address)
2. Shipping method selection
3. Payment
4. Review + Place Order
- Guest checkout always available. Don't force account creation.
- Auto-fill support. Minimal fields.
- Trust badges near payment form.
- Order confirmation page + email.