The Design of Sites: Pattern Group F — Basic E-Commerce
Pattern Group F from The Design of Sites (van Duyne, Landay, and Hong, 2006). Covers the nine core patterns for a complete basic e-commerce checkout experience, from product detail pages through post-purchase confirmation and easy returns.
License: © 2006 Pearson Education / New Riders — all rights reserved, no open license; one of the book’s co-authors is a FuguUX founder, which is the basis for citing it here.
Key points
- F1 QUICK-FLOW CHECKOUT — a distraction-free checkout funnel that answers deal-breaker questions upfront, allows guest checkout, builds trust through security signals, and guides customers through a four-step sequence; see Quick-Flow Checkout
- F2 CLEAN PRODUCT DETAILS — a standardized product page template with above-fold priority elements (thumbnail, description, price, options, Add to Cart) and below-fold secondary content (full description, reviews, related products); see Clean Product Details
- F3 SHOPPING CART — the holding area for items before checkout, with persistent storage, sufficient item detail, wish lists, shipping estimates, and secondary cross-selling; see Shopping Cart
- F4 QUICK ADDRESS SELECTION — address book for returning customers, single-column minimized form for new addresses; see Quick-Flow Checkout
- F5 QUICK SHIPPING METHOD SELECTION — transparent cost and delivery time shown simultaneously, live cost update when method changes; see Quick-Flow Checkout
- F6 PAYMENT METHOD — security signals at payment entry, stored card references by last four digits, promotion/gift-certificate redemption; see Quick-Flow Checkout
- F7 ORDER SUMMARY — final pre-submission review with all information shown and editable per section, high-visibility “Place Order” button above and below fold; see Quick-Flow Checkout
- F8 ORDER CONFIRMATION AND THANK-YOU — post-purchase confirmation page with order number, full summary, email receipt, printable view, and optional secondary cross-sell; see Quick-Flow Checkout
- F9 EASY RETURNS — return policy links on every product and checkout page, plus a step-by-step online return funnel with trackable labels; see Easy Returns
Sites used as examples: Amazon, Half.com, Nordstrom, Snapfish, Barnes & Noble, Room & Board, Netflix, Cooking.com, babyGap, Buy.com, and United Airlines.