Super Simple Checkout
Module: UI / Product Design | Level: Easy | Estimated Time: 1 day Skills: Visual Design, Web Design, Layout
Only one thing stands between a customer and their purchase: the checkout page. If the form is too long or complex, users abandon their carts and businesses lose sales. How do you make the process as painless as possible?
In this brief, you’ll design a clever, streamlined checkout page for any website (real or imagined). Keep it short and focused on essential information. Would progress bars or expandable/collapsible content make the process feel quicker? How might the order of steps or layout of the page affect the user’s experience?
In addition to the standard fields (e.g., name, billing and shipping addresses), your checkout page should address:
- Multiple payment methods (like gift card + credit card)
- Multiple shipping locations within one order
- Additional personal information (e.g., prescription info for a glasses company)
- Sending items as gifts
- Special delivery instructions
- Error messages for invalid entries
Present a prototype of your simple checkout page. The entire form can be on one page, or it can be divided into several pages. It should include both easy data types and some challenging ones (e.g., date ranges, image uploads).
Upload the finished project to your Skillshare portfolio.
Write a blurb explaining your design approach and points of feedback you’d like to receive.
Give feedback on another student’s project.
- Designing More Efficient Forms: Structure, Inputs, Labels and Actions
- Design Better Forms: Common Mistakes Designers Make and How to Fix Them
- 16 Tips that Will Improve Any Online Form
- The Credit Card Payment Form