Post on 01-Jul-2015
description
transcript
E-COMMERCE & USER EXPERIENCE
Vaimo E-commerce Seminar February 27, 2014
Sage Technology Park, Pretoria
CO-FOUNDER & CHIEF CREATIVE OFFICERPJ UTSI
Stockholm, Sweden
Science + Development + Design + Innovation Business + Sales + Product + Digital + Web
= Ecommerce!
AGENDA• What is user experience?
• How to think • How to start • How to continue • Demo
• What’s new & happening? • Mobile • Multi-channel • Demo
It’s everything!
USER EXPERIENCE
Design, Look & Feel, Usability, Readability, Accessibility
Speed, Intuitiveness, Precision, Stability, Quality, Reliability
Price, Discounts, Availability, Payment, Shipment, Returns
Delivery, Packaging, Products, Warranty, Brand, Marketing
USER EXPERIENCE: HOW TO THINK• Building a digital store
• Digital is not physical • You have more than one store layout
• People shop differently • Men vs. Women • Rational vs. Emotional
• People are right • We are probably only guessing • Digital means we have data
USER EXPERIENCE: HOW TO START• The site
• What does it do? • The customer
• Who is it? • Why is she here?
• Scenarios & journeys • What is going to happen?
• Prioritize • What is most important?
CUSTOMER & SCENARIOS
THE BRAND LOYAL CONSUMER
THE CONVENIENCE CONSUMER
PERSONAS
24-hour fashion lover Time-pressed optimizer
USER EXPERIENCE: HOW TO CONTINUE• The site
• Is it working? • The customer
• Who is it really? • Why is she really here?
• Scenarios & journeys • What is actually happening?
• Prioritize • What is most important, now that we know more?
WHO IS IT REALLY?
WHAT IS ACTUALLY HAPPENING?
DEVICES, TRAFFIC & SALES?
DEVICES, TRAFFIC?
DEVICES, SALES?
USER EXPERIENCE:DEMO• Gant - http://us.gant.com • Eton - http://www.etonshirts.com • Björn Borg - http://www.bjornborg.com • Bauhaus - http://www.bauhaus.se • JC - http://www.jc.se • P O. P - http://www.polarnopyret.com • Ridestore - http://www.ridestore.se • FCNY - http://www.flightclub.com • Konga - http://www.konga.com
WHAT’S NEW & HAPPENING?
Mobile
Multi-channel
MOBILE• What is it? • Is it important? • What’s the problem? • What must we do?
MOBILE: WHAT IS IT?• Are you mobile? • Are you desktop? • What’s the difference?
MOBILE: WHAT IS IT?• Smaller screen
• Sometimes a lot, sometimes a little
• Touch • No keyboard • No cursor
MOBILE: IS IT IMPORTANT?• The PC is dead • We only buy mobile devices
MOBILE: IT DOMINATES ALL…
MOBILE: …EXCEPT THE WEB
WHY? FROM NATIVE TO WEB
WHY? MEAT IN THE WAY
WHY? IT’S NOT THE SAME
WHY? IT’S SLOW
THE WEB ON MOBILE, NOT EXACTLY A PARTY…
…AND IT’S THOSE ☁#★!& NATIVES FAULT!
APPS SET THE BAR
HIGH • Touch • Sharp • Focus • Recognize me • Hardware • Performance
BUT… • We can’t replace
every site with an
app • Connection is slower • Browser is weak
SO WE HAVE TO • Look like an app • Act like an app • Shed weight
HOW?
WE WANT DESKTOP-
GRADE • Content • Features • Interface • Readability
BUT… • Screen is smaller • Sometimes portrait,
sometimes landscape • Different size
SO… • Everything must be
available • Content and layout
must adapt
HOW?
MOBILE: WHAT MUST WE DO?• Look & act like an app
• Shed weight
• Make everything available
• Adapt content & layout to screen size
MOBILE: RESPONSIVE WEB DESIGN
MOBILE: RESPONSIVE WEB DESIGN
MOBILE: DEMO• Eton - http://www.etonshirts.com • Björn Borg - http://www.bjornborg.com • P O. P - http://www.polarnopyret.com • Bauhaus - http://www.bauhaus.se • CUM Books - http://www.cumbooks.co.za • Konga - http://www.konga.com
MULTI-CHANNEL• What is it? • Is it important? • What’s the problem? • What must we do?
MULTI-CHANNEL: DEMO• CUM Books - http://www.cumbooks.co.za • Pavers - http://www.pavers.co.uk • Flight Club - http://www.flightclub.com • P O. P - http://www.polarnopyret.com • Bauhaus - http://www.bauhaus.se • Tilbords - http://www.tilbords.no
THANK YOU!www.vaimo.co.za
!
www.facebook.com/VaimoGlobal
www.twitter.com/vaimoglobal !