Information
Architecture
+ Online
Shopping
Presented By:
Emily Coleman
Overview

Why do you need strong IA and good
usability for online shopping?

Connect users to products

Shopping cart

Checkout process

Demo

References

Questions
Online Shopping Stats

Online and mobile sales in the U.S…


totaled $194 billion in 2011.
rose 69% from 2006 to 2011.
Online Shopping Stats

Online sales in 2011 accounted for 4.6% of
total retail sales.
Research Supports Us

Usable design elements have a positive
impact on success

Flaws in design usability have a negative
impact on success

Studies have shown that usability and
related constructs of perceived ease
positively influence the intention to buy
Source: Timo Christophersen and Udo Konradt. Reliability, validity, and
sensitivity of a single-item measure of online store usability
User Failure = Failed Profits

Nielsen says, “User success rates on ecommerce sites are only 56%, and most
sites comply with only a third of documented
usability guidelines.”
Imagine This Scenario…
Shopping Cart Abandonment
User Considerations
for Online Shopping
Pros



Increased variety +
selection
Shop wherever,
whenever
Opportunity to
research products
Cons

Security fears

Delay + cost of
shipping

Less understanding
of how a product
looks + feels
Aspects of the Experience
Source: Sarah Bridigare, The Information Architecture of the Shopping Cart
Products

Meaningful navigation

Functioning search options

Ample images + detailed product info

Product-centered site
Products:
Meaningful Navigation

Well-designed taxonomy

Clear labels

Have global, local + contextual navigation
Products:
Functioning
Search
Products:
Functioning
Search
Products:
Functioning
Search
Products:
Ample Images
Products:
Ample Images
Products:
Detailed Info
Products:
Central Focus
Products:
Central Focus
Shopping Carts

Easy to find

Display of contents with options to add, edit,
and delete

Don’t completely disrupt navigation of the
site

Provide alternates to purchase
Shopping Carts:
Easy to Find
Shopping Carts:
Editable
Shopping Carts:
Navigation
Shopping Carts:
Alternates to Purchase
Check-out Process

Articulate the process

Use form best practices

Provide contact info

Emphasize security
Check-out:
Articulate the Process
Check-out:
Use Form Best Practices
Check-out:
Provide Contact Info
Check-out:
Emphasize Security
Source: Christian Holst, Fundamental Guidelines of E-Commerce Check-out Design
Buying a Phone from Verizon
Best to Remember

Increase momentum and decrease friction to
facilitate a sale.
Best to Remember

Increase momentum and decrease friction to
facilitate a sale.

Products – easy to find, strong search,
highlight available goods

Shopping cart – high visibility, logical
navigation

Check-out process – remove barriers,
articulate steps, good forms
Best to Remember

Increase momentum and decrease friction to
facilitate a sale.

Products – easy to find, strong search,
highlight available goods

Shopping cart – high visibility, logical
navigation

Check-out process – remove barriers,
articulate steps, good forms
Wise Words: Eliminate barriers between a sucker and his wallet.
References

Andras, Rung. “Principles of Effective Search in E-Commerce Design.”
December 8, 2009. Accessed: April 9, 2012.
http://uxdesign.smashingmagazine.com/2009/12/08/principles-of-effective-ecommerce-search/

Apai, Walter. “10 Tips to Design Usable Shopping Carts.” April 6, 2009.
Accessed: April 9, 2012. http://www.webdesignerdepot.com/2009/04/10-tips-todesign-usable-shopping-carts/

Bidigare, Sarah. “Information Architecture of the Shopping Cart: Best Practices
for the Information Architectures of E-Commerce Ordering Systems.” May 2000.
Accessed: April 6, 2012. http://argusacia.com/white_papers/shopping_cart_ia.pdf.

Chapman, Cameron. “15 Common Mistakes in E-Commerce Design.” October 8,
2009. Accessed: April 9, 2012.
http://uxdesign.smashingmagazine.com/2009/10/08/15-common-mistakes-in-ecommerce-design-and-how-to-avoid-them/

Christophersen, Timo and Udo Konradt. “Reliability, validity, and sensitivity of a
single-item measure of online store usability.” October 29, 2010. International
Journal of Human-Computer Studies, 69(4), 269-280. Elsevier.
doi:10.1016/j.ijhcs.2010.10.005
References

Holst, Christian. “Fundamental Guidelines of E-Commerce Checkout Design.”
April 6, 2011. Accessed: April 8, 2012.
http://uxdesign.smashingmagazine.com/2011/04/06/fundamental-guidelines-of-ecommerce-checkout-design/

Mintel. “Online and Mobile Shopping—U.S.” March 2012. Accessed: April 8,
2012.

Nielsen, Jakob. "Did Poor Usability Kill E-Commerce?" Useit.com Alertbox. 2001.
Accessed: April 8, 2012. http://www.useit.com/alertbox/20010819.html

Usborne, Nick. “Flywheels, Kinetic Energy, and Friction.” March 7, 2006.
Accessed: April 9, 2012.
http://www.alistapart.com/articles/flywheelsandfriction/

Walsh, Ivan. “Good Information Architecture Increases Online Sales.” October
23, 2003. Accessed: April 8, 2012. http://www.sitepoint.com/increases-onlinesales/
Image Credits

http://www.gq.com/images/entertainment/2011/09/the-art-of-fielding/art-offielding-628.jpg

http://b.dryicons.com/images/icon_sets/colorful_stickers_part_3_icons_set/
png/256x256/shopping_cart.png

http://www.alistapart.com/articles/flywheelsandfriction/

http://www.smashingmagazine.com/2008/02/07/shopping-carts-galleryexamples-and-good-practices/
Questions?