UI/UX play a giant role in the success of any eCoomerce website. Here is the case study of top most successful eCoomerce website UI/UX best practices.

2. What is eCommerce

3. UX design is the process of designing (digital or physical) products
that are useful, easy to use, and delightful to interact with.
What is UX?

4. UI Elements - Legibility

5. UI Elements - Colors

6. UI Elements - Content
Use relevant content which is familiar to users and easily take action

7. Navigation Menu
Currency/Country/Language selector
Service Phone number and help WishlistTrack OrderStore Finder
Home Page

8. User Account
Help Customers to
remember your brand
Search Box
Home Page
Easy access to shopping cart

9. Search Page
Is the search box easy to use?

10. Search Page
Is your search box clearly visible and quickly noticeable?

11. Category Listing
Grid View
Filter
Sorting

12. Category Listing
List View

13. Product Page
Images for every color
Multiple Images
Show Product In Context

14. Product Page
Zoom Functionality

15. Product Page
Show Product Texture

16. Product Page
Videos

17. Product Page
360 degree interactive
image

18. Product Page
So what’s inside
Create a sense of scale

19. Product Page
Product Price
1. Highlight discount if any
2. Clear Pricing
3. Product availability

20. Product Page
Product Options
1. Include a size Guide
2. Add color swatches
3. Allow shoppers to
select quantity

21. Product Call to action
Product Page
Social Sharing Buttons Add to WishlistWrite a review
Notify Me Quick Buy

22. Product Page

23. 1. Empty shopping cart design
2. Mini shopping cart
3. Full page cart
Shopping cart page design

24. Shopping cart page design
1. Should you save the shopping
carts?
2. Let the shoppers easily
remove items from cart
3. Allow the user to edit cart
items
4. Notify when an item has been
added/deleted to cart

25. Shopping cart ADD-ONS
Show different payment options
Persuade your shoppers with
offers
Create urgencyCross-sell/upsell
What if shoppers buy gifts for
someone else?
Allow shoppers to save items for
later

26. 1. Things to take care when you opt for a single page
checkout
a. Data validation
b. Organize the checkout form
c. Avoid asking unnecessary information
2. Single page checkout
Checkout

27. 1. Design for ‘Images Off’
2. Design responsive email templates
3. Link your CTA to the right page
4. Easy to find call to action
5. Optimize for social media
6. Help recipients recognize your emails
7. Remind shoppers to buy gifts for themselves
eCommerce Marketing Email

28. Mobile UX
or
How to fit an elephant in a box

29. Inspiration and Sources
http://ecommerceuxdesign.com/
https://selfstartr.com/
https://uxmag.com/
https://econsultancy.com
https://www.smashingmagazine.com
http://uxmovement.com/
… and, of course, Magento.com

30. Queries?

31. Confidential
Thank You