Best practice ecommerce design


Published on

This presentation shows the work flow of a successful ecommerce project and how to design a website around persona driven design.

Published in: Technology, Business
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Best practice ecommerce design

  1. 1. t practic e eComme rce designBes By George Ioannou Hea d of Creative & Strategy
  2. 2. About me  Ov er 13 years eCommerce industry experience  Worked for w ell know n solution providers  Clients: Small to large retailers   Experience in m any industry verticals
  3. 3. What we are going to cover•  What a re we designing for?•  Why is good design so important?•  Recommen ded design process •  A look at variou s key design elements •  Design o ptimisation after go-live •   Tools that can help you
  4. 4. What are we designing for?
  5. 5. And don’t forget...
  6. 6. And...
  7. 7. Why is good design so impor tant ?
  8. 8. Here are some reasons… !•  It repres ents your brand, make your mark ce a nd it s often a first impression a•  Design can reflect trust, confiden user gets. et ty, poor design is often one of•  The design isn t just making things apr low conversion the big gest reasons in bounce rates nd tion ality but without good design •  Y ou can have so many features/func they may not be used sitive a ke the user journey an easy and po •  Well thought out design cans m experience to your customer s can be familiar with your site, even •  Best practice means your usersit, increasing conversion and AOV though it may be their first vi
  9. 9. Could it be any worse?
  10. 10. comm ended designRe p rocess
  11. 11. Personas
  12. 12. Wireframes
  13. 13. The creative process
  14. 14. look at vario us keyA desi gn ele ments
  15. 15. Search examples
  16. 16. Basket examples
  17. 17. Form examples
  18. 18. Mini Basket examples
  19. 19. Progress tracker examples
  20. 20. Desig n optim isation after go-live
  21. 21. Some optimisation pointers•  Look at your analytics and react•  Ask your users for their opin ions through polls, feedb ack, usability labs •  Conduc t multivariate testing
  22. 22. Multivariate testing
  23. 23. s that can he lp youTool
  24. 24. Google•  Google Tools•  Analytucs & Reporting  A/B & MVT testing  Translation
  25. 25. Some online tools...  Feng-GUI  Optimise layouts  Identify weak spots & improve performance  Location of brand and branding effectiveness
  26. 26. Some online tools...  Loop11  Create professional usability tests in minutes  Conduct remote user testing  See the results of your user test online – instantly.
  27. 27. Some online tools...  Clicktale  Visitor recordings  Mouse movement heatmaps  Attention heatmaps  Click heatmaps
  28. 28. Fivesecondtest•  Five Second Test•  UI feedback  Fine tune design  Extracts the frequent keywords places in to graph
  29. 29. Thanks for listening!Email : george@maginus.comTwitter: @georgeioannouL inked In: www.linkedin.c om/in/georgeioannouMaginus :