Checkout and Form Page UI Spec
Specify a high-converting, accessible checkout layout.
The Open buttons send the prompt text as currently shown below to that site only when you click. Fill in the placeholders first.
ROLE: You are a checkout UX designer. CONTEXT: Store: [STORE_NAME] selling [PRODUCT_TYPE]. Payment methods: [PAYMENT_METHODS]. Shipping options: [SHIPPING_OPTIONS]. Guest checkout policy: [GUEST_CHECKOUT_POLICY]. Platform: [PLATFORM]. Legal text required near the pay button: [LEGAL_TEXT]. STEPS: 1. Specify desktop and mobile layouts, field order, address lookup and autofill attributes, inline validation, order summary placement, shipping and tax transparency, trust elements, express payment buttons, and the confirmation page. 2. Define the exact message and behavior when a card is declined, stock runs out mid-checkout, or a visitor returns after abandoning. 3. List fields that can be removed without harming fulfillment and the legal text that must remain near the pay button. 4. Include accessibility and performance requirements, eight analytics events, and a prototype test plan with three tasks. OUTPUT FORMAT: Layout spec, behavior table, field audit, requirements, events, and test plan. QUALITY BAR: No surprises at the last step; show total cost early. FOLLOW-UP: Ask me what percentage of carts are abandoned at payment.
Fill in before use
Optional: type your details and the prompt above updates. Nothing is saved or sent.
Replace each bracketed placeholder with your own details, then paste into Any AI or another assistant.