Checkout flow for a smarthome automation online store

The objective is to design an intuitive and frictionless checkout flow for the fictional Smarthomeshop.com - online store for smart home electronics.

To properly define the requirements I mapped out the user journey and offered possible solutions to the main pain points in the checkout pages.

This gave me the guidance needed to start designing. Here are the details.

Shopping cart page

When the user clicks add to cart button on any product it is sent to the cart. To encourage continuous discovery we show more products from the same smart home ecosystem. Compatibility is a huge pain point in this niche, so offering products that work with the selected hub is of huge help.

Checkout page

On the checkout page I tried to reduce friction as much as possible. This is the most critical point of the flow.

I once again confirmed the payment method and the security of the transaction.

Success page

After the order is place successfully is an important point to build trust by providing an estimate of when the order will arrive.

To turn the user into a repeat customer I also offer a promo code for the next order.

The one click purchases are a modern approach used succesfully by some new players in the ecommerce space, so it would be great to see this pattern used by niche players.

Conclusion

In the world for ecommerce reducing friction is big part of the success. Every little problem could cause loss of conversion.

To reduce friction and encourage conversion in this project I used the following techniques:

• I offered compatible products, which would most probably increase the average basket. Especially the one click purchase is a very inovative pattern that's proven to work.
• I explained the process with the stepper above, so first time ecomerce users know what to expect
• I offered a promo code to encourage repeat purchases
• I estimated the delivery date so the user is in control and knows what to expect.

That's all. Thank you for reading.