Learn what users care about when looking at a store and how a beautiful and usable design can increase conversions and branding.

1. Design & Usability
for increased
conversion
Vlad Stanescu

2. About me
● CEO and CTO @ MindMagnet
● Web agency founded in 2005
● 30+ developers
● Strong focus on Magento and custom PHP solutions
● Background of PHP development and PM

3. We all love
nice designs

4. What do users want?
To find this out, we ran a survey on iVox.ro with
the following target:
● medium and high income / household
● urban area
● internet users that shop online
Data based on 1428 web interviews conducted on April 27-30, 2015.

5. What do users want?
● 60,57% of users said design is very
important (only 13,19% said it’s not important)
● about their most used store:
o 93,64% were happy with its design
o 93,82% were happy with its usability
o 76,68% were happy with its copywriting
o 92,23% said they save time when shopping on it
● 89,22% want a site that’s easy to use

6. What do users want?
Info that matters to the user:
● 50,35% said they often need details on delivery
● 45,41% said they often need details on returns
● 44,35% said they often need details on warranty
● 75,26% said they happen to need the invoice
● when shopping 38,69% want good filters above
everything

7. Why have a good design?
● increase credibility
o 76,32% of users state that if a shop they don’t know has a nice design they’re
more likely to purchase from it
● increase conversion
o 64.31% of users previously abandoned orders on frustrating websites
o 67.86% stated that they haven’t returned to that site
● increase loyalty
o 67,84% of users say they enjoy shopping on a store if it has a good design
o 77.74% of users say they never recommended a website they don’t like

8. Why is design hard?

9. Focusing on the wrong things
Too much content you think is important.
Too little details on products and procedures.
Assuming your users know things.
● about products
● about terms of delivery
● about what happens when
● about eCommerce in general

10. Only the
Happy-Flow
What is the happy flow?
User with:
● plenty of time
● lots of experience with shopping
● a conesoeur in your line of products
● has no concerns regarding your store or the
products
Who wants to:
● buy your most popular products
● paying with a valid credit card
Afterwards, order goes perfectly and at 10am the next
morning delivery is made to the user patiently waiting at
home.

11. ● Mom needs to leave home in 15min to pick up the
kid from kindergarten wants to quickly order a pair of
sport headphones for her husband’s birthday which
is in 3 days;
● Grandmother with little experience wants to buy an
iPod Touch for her grandson’s 15th birthday;
● Office assistant purchased office supplies and needs
the invoice for taxing purposes, but she finds out she
entered an incorrect billing address;
● Active runner bought a pair of running shoes, but
they’re not comfortable enough so he wants to send
them back;
● Young man ordered a nice present on his way to
work for his girlfriend, which he expected to arrive
yesterday but didn’t, so he wants precise
confirmation that he’ll receive it today since today is
the anniversary;
But how does reality look like?

12. No focus on the post-sale
After purchase, your customer might still need you:
● wants to know when delivery will happen
● needs the invoice
● needs to return something
● needs to send in his product for warranty

13. Evaluating &
improving designs

14. Personas Create personas for your users
Persona 1:
● lives in big city, central area
● works in advertising and earns well
● is avid runner
● is quite tech savvy

15. Personas Create personas for your users
Persona 2:
● lives in the suburbs
● is a history teacher and earns ok
● non technical

16. Personas Create personas for your users
Persona 3:
● in college, lives in campus and works as freelance writer
● medium technical skills
● huge movie fan

17. Scenarios
Create scenarios:
● Scenario 1
o user wants to buy products X and Y he knows and checkout with
registration and shipping to address A and payment by credit card
● Scenario 2
o user wants to look for a product from the X category, not spend more
than A, but he needs it delivered within a week
● Scenario 3
o user purchased product X and wants to return it
Create dozens of scenarios and think about how your
personas would deal with them.

18. Make a focus group
● Considering your scenarios and personas, create a focus group
and run them through the scenarios
● Use a software to track their activity (silverbackapp.com is a good
option)
● Maybe also run them through your competitor’s website to see
what problems they run into there
● Collect open feedback from them
Improve and repeat with a new focus group.

19. A/B Test on live site
Tools:
● Google Analytics Experiments
● Optimizely.com
● Convert.com

20. Better Designs

21. The basics
The general things:
● alignment

22. The basics
The general things:
●
● spacing

23. The basics
The general things:
●
●
● easy to scan

24. The basics
The general things:
●
●
●
● content placement & hierarchy

25. The basics
The general things:
●
●
●
●
● respect the layout conventions

26. Focus on
the mobile
Goals for mobile
● have smaller sites
● make it readable and clickable
● show different content
● different focus

27. Tips for a good catalog
Clear category structure
● make sure at each level it’s easy to understand which one holds what
● show breadcrumbs

28. Tips for a
good catalog
Good filters!

29. Tips for a good search
● handle synonyms
o Close synonyms
o Distant synonyms
o Branded names
o Different spellings
o Simple plurals
o Complex plurals
o Acronyms
● handle frequent misspellings
o Brand names
o Category names
o Product names
o Product details
o Author or artist names
Source: 37signals Research Report on Search Engines

30. Tips for a good search
● mixed specifications
o Mixing gender and products
o Mixing prices and products
o Mixing details and products
o Mixing specials and products
o Mixing sizes and products
Search must also be:
● fast
● accurate/relevant
● have order by functionality and preferably filters too
● offer something when no results were found
Source: 37signals Research Report on Search Engines

31. Tips for a good checkout
● clarify shipping costs and terms early on
● don’t ask more details than you need
● don’t distract the user
● allow for coupon code in the checkout

32. Tips for a good checkout
Our view
for a good
checkout:
PRIME CHECKOUT

36. Tips for good support
● provide details on delivery
● have both instant and non-instant support
o 50,36% prefer chat or phone
o 33,92% prefer email or helpdesk
o 15,72% would rather not use support
● answer most frequent questions inside
the site or confirmation page
● make it easy to ask for help

37. Design Trends

38. Design Trends
Clean, simple, unobtrusive, functional

39. Design Trends
Clean, simple, unobtrusive, functional

40. Design Trends
Clean, simple, unobtrusive, functional

41. Design Trends
Vibrant colors or simple black & white contrast

42. Design Trends
Vibrant colors or simple black & white contrast

43. Design Trends
Vibrant colors or simple black & white contrast

44. Design Trends
Good typography & storytelling

45. Design Trends
Big, impactful images & product video

46. Design Trends
Big, impactful images & product video

47. Design Trends
Big, impactful images & product video

48. Design Trends
Product focused

49. Thank you!
vlad.stanescu@mindmagnetsoftware.com
@vladstanescu
www.mindmagnetsoftware.com