irmc2014-v7

What Info Should a Mobile Product Page Present?

The ins and outs of your most important page

What We’ll Talk About

• About Crocs/Abt• Principles of Good Mobile Design• Mobile PDP Teardown (Crocs vs. Abt)

ABOUT USWho is talking to you

About Abt

• Privately held electronics and appliance retailer.• Founded in 1936 by Jewel and David Abt. • Single location storefront.• Employs 1200 experts. • Named “Best Place” to buy appliances. 3X• Received several awards for retail excellence.• Answer is always YES to any reasonable request.

Abt in 1936

Abt Now

Abt Now

A truly different shopping experience

A truly different shopping experience

A truly different shopping experience

A truly different shopping experience

Abt is a Green company.

• Own recycling center.• Electric car charging

stations.• Create own energy with

wind spires and solar panels.

• Actively recycles 95% of waste.

About Abt.com

• Launched in 1997.• Generates 25% of

companies revenue.• Traffic steadily

increasing month over month.

Many famous companies started in a garage. Crocs started on a boat.

On a sailing trip in 2002, three friends had an idea for a better boat shoe. The original Crocs were light. Had good grip. Let water drain quickly. And they looked like nothing else.

We didn’t set out to create a shoe to help people run faster, or longer, or whatever.

We just created a shoe that was really, really comfortable. We didn’t tell people its purpose or how to wear it. We simply put it out there and let the world decide what to do with it.

Turns out people – millions of people – simply like being comfortable.

Overview

Our Garage was Our Boat

About Crocs

• 11 year old company• $1 billion in annual revenue (<50% from clogs)• 547 retail locations in more than 90 countries• 200 million shoes sold since inception (50

million/year currently)

About Crocs.com

• 21 country sites in 4 regions and 15 languages supported by a global team and 3+ regional teams

• Generates $100M+ year in revenue (10% of total)

• During the past 12 months, global ecommerce traffic increased 25 percent.

PRINCIPLES OF GOOD MOBILE DESIGN

Setting the Stage

Why are Smartphones So Big?

20

• (retired) Suburban Housewife

• Techno-phobe• Knows how to

dish out guilt• 21+++++• (crocs fan)

Harriet Stein (aka my mother-in-law)

Why are Smartphones so Big?

• They’re small (always with you)

• Always connected • Can do a lot for you

Why are Smartphones so Big?

• They’re small (always with you)

• Always connected • Can do a lot for you

SMALL SCREEN

SLOWDISTRACTIONS

General Principles• Consider the opportunity cost of

each design element.• Minimize the interaction cost.• Fast page load times.• Design for interruptions. • Save state for the users and allow

users to save state.• Don’t ask users to go elsewhere

for information.• Take advantage of the phone

features.• Clean purposeful design.

Usability of Mobile Websites and Applications, Neilsen/Norman Group, 2012

BOTTOM LINE:

Design with your users in mind!

Abt Mobile User Profile

• Over 50% iPhone• Over 70% high resolution devices• 94% supports cookies• 90% spend 3 minutes or less • 65% of traffic leads directly to product detail pages.

“Contact us” and “Store hours and directions” are the 7th and 9th most popular pages

• CR on mobile is ½ of desktop• Our customer consist of males between the ages of 25

and 34

Crocs Mobile User Profile

• Over 50% iPhone• Over 60% on 320x480 (lower resolution phones)• Over 94% supports cookies• Store locator receives 8% of traffic (7th most

popular page)• 71% spend 5 minutes or less (desktop it is 60%)• CR on mobile is ½ of desktop• Our customer is typically older (45+) and female

MOBILE PDP TEARDOWN

PDP Parts

• Imagery• Product Description• Reviews• Recommendations• Social Links• Store Locator

Goal of m.crocs and m.abt

Make it is as easy as possible to for customers to purchase on

their mobile devices!!

Imagery: Crocs

Multiple AnglesSee as much of the shoe as possible

Color SelectorTell customers we have lots of colors and make it easy to see

Enlarge FunctionSee even more of the shoe

GOAL: Make sure customers can “experience” without being able to physically touch it.

GOAL: Make sure customers can “experience” without being able to physically touch it.

Imagery: Abt

Additional InformationSupportive of product

GOAL: Provide consumer with a seamless viewing experience.

ResourcesAdditional color options, size & downloadable docs

Multi Viewing OptionsImage advancement by swipe, tap, or inline.

Multiple AnglesSee as much of the product as possible. Close up images of connections.

Make sure customers can see the product without being able to physically touch it.

Make critical content available without clicks.

GOAL: Maintain clean design and encourage user engagement.

Product Description: Abt

Full Detailed Description Scrollable

Full Detailed DescriptionClickable for further research.

Key Selling PointsNo clicks.

Product Description: Crocs

Critical InformationNo clicks; higher on page

Less Critical InformationLower on page; behind clicks

GOAL: Make critical content available without clicks; less critical is available with clicks

GOAL: Make critical content available without clicks; less critical is available with clicks

Product Reviews: CrocsStar Rating is CriticalGood to know that the product is highly rated

Details behind ClicksIt’s important, but not as important as the stars

GOAL: Make critical content available without clicks; less critical is available with clicks

GOAL: Make critical content available without clicks; less critical is available with clicks

GOAL: Provide customer reviews for selling support.

Product Reviews: Abt

Details On Same PageMinimize clicks during research.

Star Rating is CriticalProvides opinions from other consumers to aid decision making process.

User reviews are important to support the decision making process.

Recommendations: Abt

Not critical to purchase path on mobile.

Goal: Keep the consumer engaged and focused with the product.

Recommendations are import.However due to spacing limitations, we chose to suggest product accessories instead.

Recommendations: Crocs

Important but not as important Recommendations are important to the purchase path, but will be useful to users only after they have consumed the current product

GOAL: Critical to purchase path, but is secondary to current product elements

GOAL: Critical to purchase path, but is secondary to current product elements

Social Links: Crocs

Don’t disrupt purchase pathWhile we need to state our presence, it is secondary to the purchase path

GOAL: Make them available, but don’t disrupt the purchase path

GOAL: Make them available, but don’t disrupt the purchase path

Social has positive effects and is required but not crucial.

Social Links: Abt

GOAL: Make social links available, but don’t disrupt the purchase path.

Available but not critical to purchasing process.

Store Locator: Crocs

Popular but not that popularLots of people use the mobile site to find our retail stores. But since we want people to experience product first, we put it

GOAL: Provide a consistent place to find a key use of mobile site even if it is secondary

GOAL: Provide a consistent place to find a key use of mobile site even if it is secondary

Store Locator: AbtOne of the most visited pagesContact us page provides store location, call number, and even a live chat option.

GOAL: Provide a consistent place to find support.

Key Takeaways

• Understand the goal of your site– Minimize clicks by keep focused on the prize

(purchases)• Understand your users• Put your most important stuff on top• Create as few barriers to get people to add to

cart• Iterate, iterate, then iterate some more

Contact Info

• Josh Zapin: @jzapin; [email protected]; www.linkedin.com/in/jzapin/

• Ken Au: [email protected] ; http://www.linkedin.com/pub/ken-au/8/15a/158