Flogging Design: Daily Disasters & Best Practice in Online Shop Design

Post on 09-May-2015

5,273 views 4 download

description

So many businesses earn their daily bread online, so why are so many online shops so poorly designed? This presentation from Edge of the Web '09 in Perth, Australia, is a review of common mistakes, and numerous common sense solutions and best practice examples for e-commerce site design.

transcript

Flogging Design

Perth, Australia November 2009

Daily Disasers & Bes Practice in Online Shop Design

Matt Balara Edge of the Web 2009 Flogging Design

?

Heyyyy!

10 Easy

Steps to

Sleaze!

Photo by LexnGer http://flic.kr/p/5bRyhQ

I want my MBP!

Cartoon by Bill McLemore

graphic

designer

Photo by Julian Bleecker http://flic.kr/p/4YXxrr

Hi!

IxDUXD

IDDesigner

Matt Balara Edge of the Web 2009 Flogging Design

Know Your ShoppersWho are we designing for?

Browser

Questor

Blow-in

Socialite

Matt Balara Edge of the Web 2009 Flogging Design

TheBrowser

“I’m just looking.”

The Browser

Photo by Emily Webber http://flic.kr/p/6aU4Rv

Is this you?

Photo by galaygobi http://flic.kr/p/b7YTT

Is this you?

Photo by specialkrb http://flic.kr/p/6bcPDm

Is this you?

Design by Dustin Curtis http://dustincurtis.com

Photo by sevensixfive http://flic.kr/p/CYaYB

navigation

Compact & simple

Compact & simple

Strict categories vs. multiple pathways

Strict categories vs. multiple pathways

plush toy dress-up action figure

Strict categories vs. multiple pathways

Strict categories vs. multiple pathways

plush toyages 3–6Animal Alley

dress-upages 6–10Hello Kitty

action figureages 8–12movie toyTwilighttop rated

Strict categories vs. multiple pathways

Photo by danibegood2001 http://flic.kr/p/5iwoxU

pringboards

Plenty of attractive options...

Plenty of attractive options...

Plenty of attractive options...

How not to help the user...

How not to help the user...

“Don’t Make Me Think” by Steve Krug

Scarcity motivates...

Matt Balara Edge of the Web 2009 Flogging Design

The Questor

“I will find the one true product!”

The Questor

Search ishard!

?

Hmmm.

The ring!

More features? More info.

Less features? Bigger image.

Photo by Adam Pieniazek http://flic.kr/p/55Jf79

too much info!

Matt Balara Edge of the Web 2009 Flogging Design

TheSocialite

“Honey, what do you think of this?”

The Socialite

like attractslike.

Photo by heath_bar http://flic.kr/p/4MVejj

like attractslike.

62% of all shoppers consult online communities before

making a purchase. Just 27% of consumers go directly to

the retailer.net imperative http://j.mp/doz5m

“ ”Photo by heath_bar http://flic.kr/p/4MVejj

rushfaster is trying hard...

rushfaster is trying hard...

rushfaster is trying hard...

rushfaster is trying hard...

?

Zappos gets sharing.

Zappos gets sharing.

Short URLs = sharing freedom

Zappos gets sharing.

“Tell a Friend” = simple 1-to-1 sharing

Zappos gets sharing.

Zappos gets sharing.

Zappos gets sharing.

“Share” = broadcast your taste

Zappos gets sharing.

Zappos gets sharing.

Amazon has short URLs?

?

Matt Balara Edge of the Web 2009 Flogging Design

TheBlow-in

“Uh, how’d I get here?”

The Blow-in

Close your eyes...

Photo by Daygo D. http://flic.kr/p/5YU6mg

make me want it!

Photo by Thomas Hawk http://flic.kr/p/8jULC

Peter’s of Kensington makes me squint

Rush Faster makes me want their products

Rush Faster makes me want their products

Rush Faster makes me want their products

Rush Faster makes me want their products

ECCO lets you take a closer look

ECCO lets you take a closer look

ECCO lets you take a closer look

ECCO lets you take a closer look

Apple, the master of want

Apple, the master of want

Apple, the master of want

Product

Theater!

Something by Someone

Photo by kevindooley http://flic.kr/p/6GERjX

focus

Matt Balara Edge of the Web 2009 Flogging Design

Show me the Money“Get out of my way!”

Photo by Sheila Steele http://flic.kr/p/7vtpM

Photo by jussstas http://flic.kr/p/8Y3N1

Why do we do this?

Why do we do this?

Why ask, if we already know?

4506 1187 0913 1114

5144 0932 8715 4748

3426 9960 899 654

Why ask, if we already know?

4506 1187 0913 1114

5144 0932 8715 4748

3426 9960 899 654

Why ask, if we already know?

4506 1187 0913 1114

5144 0932 8715 4748

3426 9960 899 654

Threadless gets this right

Another question we can answer ourselves.

Another question we can answer ourselves.

Isn’t this some kind of torture?

Isn’t this some kind of torture?

One Dropdown 243options!

Shorter, not better...

Shorter, not better...

Shorter, not better...

Isn’t this what suggestive search is for?

Isn’t this what suggestive search is for?

Isn’t this what suggestive search is for?

Isn’t this what suggestive search is for?

Isn’t this what suggestive search is for?

Isn’t this what suggestive search is for?

Isn’t this what suggestive search is for?

Hello?

Hello?

Hello?

?

Hello?

Built in stumbling blocks...

Built in stumbling blocks...

Built in stumbling blocks...

660 pixels

Built in stumbling blocks...

660 pixels

bakedin

fail

A simple problem, easily solved.

And last but not least...

And last but not least...

What users really want!

Photo by jmccorm http://flic.kr/p/3uLfXE

Bigger

Shopping

Carts!

Web Form Design by Luke Wroblewski http://j.mp/8HtDs

Matt Balara Edge of the Web 2009 Flogging Design

Thanks...and?The web’s biggest missed opportunity

Paula’s Choice, as bad as it gets.

5 Senses Coffee only tells me what I already know

MOO doesn’t care what I do next.

Even Apple misses this one.

Amazon doesn’t miss an opportunity.

Amazon doesn’t miss an opportunity.

Matt Balara Edge of the Web 2009 Flogging Design

Once more with feeling!

Heyyyy!

don’t be this guy.

Photo by Emily Webber http://flic.kr/p/6aU4Rv

impress

Photo by sevensixfive http://flic.kr/p/CYaYB

navigation

Photo by danibegood2001 http://flic.kr/p/5iwoxU

pringboards

make me want it!

Photo by Thomas Hawk http://flic.kr/p/8jULC

Photo by kevindooley http://flic.kr/p/6GERjX

focus

Photo by heath_bar http://flic.kr/p/4MVejj

like attractslike.

Photo by jussstas http://flic.kr/p/8Y3N1

desroy all stops.

Thank you! Matt Balara Freelance Designer

Web mattbalara.comEmail hello@mattbalara.comTwitter @MattBalara

Thank you! Matt Balara Freelance Designer

Web mattbalara.comEmail hello@mattbalara.comTwitter @MattBalara

Questions?