Daily UI #002 | Credit Card Checkout (Nike - Concept)

This is a simple checkout flow for purchasing some items from Nike.

Goal: Making it as easy and secure as possible to enter in Credit Card to pay for product, so people will feel comfortable and motivated to pay

Hypothesis: By adding a Credit Card checkout screen, it will allow users to easily pay for the products they want to purchase.

Metrics: Conversion Rate of people who paid for the product compared to those who filled their cart, entered in their shipping information.

Requirements:
- Have to be able to pay for the product
- Must be able to use credit card
- Has to be and feel secure (use HTTPS)
- Has to be intuitive
- Must be able to pay with Gift Cards

Plus:
- Pay through other 3rd parties like Paypal, ApplePay, AmazonPay, GooglePay, etc.
- Show the products they are buying (and in a cool way to get them extra excited to buy!)
- Take picture of credit card to populate fields (better on mobile)
- Show previous used cards
- Take advantage of browser credit card memory
- Use place holder text

Credit Card Requirements:
- Name on card
- Card number
- Expiration Date (mm/yy or mm/yyyy)
- Security Code (also known as CVC on some cards)
- Optional - Zip Code - Adds less risk with the credit card companies