Back to prompts
Create a conversion-optimized checkout flow. Steps: 1. Information: Email, shipping address form 2. Shipping: Shipping method selection with prices 3. Payment: Card input or payment method selection 4. Review: Order summary before placing Design Principles: - Progress indicator showing current step - Order summary sidebar (collapsible on mobile) - Trust badges and security indicators - Express checkout options (Apple Pay, Google Pay) - Guest checkout without account required Form Features: - Address autocomplete - Real-time validation - Error messages inline - Auto-formatting (phone, card numbers) - Save information checkbox Technical Implementation: - Multi-step form with React Hook Form - Zod validation schema - Step persistence (don't lose data on back) - Stripe Elements for payment - Loading states for async operations
Related Prompts
View allPremium Product Detail Page
Create a high-converting product detail page for e-commerce. Above the Fold: - Image gallery with z...
Product PageE-commerce
Animated Shopping Cart
Build a delightful shopping cart experience. Cart Drawer: - Slide-in drawer from right - Product li...
Shopping CartDrawer
Filterable Product Catalog
Build a product catalog with advanced filtering. Layout: - Filter sidebar (collapsible on mobile) -...
CatalogFilters
Modern Auth Pages Set
Create a complete set of authentication pages. Pages Required: 1. Sign In: Email/password, social l...
AuthLogin