Responsive design in e-Commerce. Where's the beef and how to do it? by Teemu Malinen, Sofokus
36
1 Teemu Malinen 12th March 2013 Kilta Helsinki, Finland Ver 2.0 Responsive design & eCommerc e
-
Upload
teemu-malinen -
Category
Technology
-
view
1.587 -
download
0
description
Responsive design is a hot topic in e-Commerce. - What is responsive design? - What is the status of responsive design in popular Finnish ecommerce sites? - Where's the beef - How much you gain by using responsive design? + several others. Please view, share and enjoy! :)
Transcript of Responsive design in e-Commerce. Where's the beef and how to do it? by Teemu Malinen, Sofokus
1
Teemu Malinen12th March 2013KiltaHelsinki, FinlandVer 2.0
Responsive design &
eCommerce
2
Sofokus is focused on demanding ebusiness & ecommerce solutions
3
Responsive Web Site (WordPress)
Sofokus Reference
snoobi.fi
4
Responsive Web Application (Django)
Sofokus Reference
Keikkatori.fi
5
Sofokus Reference
kauppahalli24.fi
Responsive Web eShop (Magento)
6
Mobile eCommerce
WHY BOTHER?
7
POLL: How many of you
own some smart device?
Sources: apple.com, nokia.com, samsung.com
8
US smartphone penetration 53%Source: printinthemix.com/fastfacts
US broadband use 68,9%Source: som.csudh.edu/fac/lpress/netapps/hout/broadbandandPenetration.htm
Tablets to surpass laptops 2016Source: printinthemix.com/fastfacts
9
Mobile internet > desktop internet
10
And yeah. It’s happening in Finland too.
11
3 different main
MOBILE STRATEGIES
12
Strategy 1: A Mobile Website
www.finnkino.fi m.finnkino.fi
13
Strategy 1: A Mobile Website
Possibility for great user experience
Tested, used widely
Expensive, 2 sites to uphold
Not really flexible, still a chosen form factor
14
Strategy 2: Mobile Application
amazon.com Amazon App
15
Excellent user experience
Fast to use
Expensive, every ecosystem
needs an own app
Application stores take a cut
Strategy 2: Mobile Application
Good offline capabilities Native applications needs to be distributed & installed
16
Strategy 3: Responsive e-Com Site
Currys.com
17
Only 1 site to maintain
One content can be served to all devices
Can be costly to implement to old systems
Requires a new perception and expertise on many levels
Strategy 3: Responsive e-Com Site
Just start using, no need to download app, remember different URL
18
Responsive design:
WHAT’S THE BEEF?
19
What is RESPONSIVE DESIGN?
Mashable: ”2013 is the year of Responsive Design.”Source: mashable.com/2012/12/11/responsive-web-design
”It is a web design approach that aims to provide optimal viewing (using) experience regardless of used device.”
20What is RESPONSIVE DESIGN?
Source: zindico.com/design/what-responsive-web-design
21
Global giants get it.Microsoft.com
Starbucks.com
Time.com
Worldwildlife.orgAwesome site!
Sony.com
22
Show me the $$$ !
+65%iPhone conversion
+112%iPhone transactions
+65%iPhone revenue
+42%Revenue all devices
+377%Revenue iPhones
+13%Conversion rate
+10%Mobile/tablet traffic
+23%Mobile PPV
+15%Unique visits
Source: econsultancy.com/fi/blog/62260-five-brands-that-reaped-rewards-after-adopting-responsive-design
23
No
No
No
No
No
No
So, what about most popular ecom sites in Finland?
24Source: Twitter
Sadly, we are here.
25
Finnish ecom people: this is a BIG chance for you.
26
How to become
RESPONSIVE?
27
”Responsive design is just a CSS trick.”
This is bull****
28
You need to rethink…
• Visual design• UI implementation• Tech platform use• Mobile first ideology• Use of analytics• Pointing methodsEtc.
But most of all: content.
29
Responsive design is not an exclusive method
30
Rethink visual design
AD:s need to adapt
31
Small screen means
You really have to prioritize
32
Think of means to navigate
Clicking? Tapping?
33
Know your customers.
Web analytics is your best friend
34
Plan suitable breakpoints
for your users needs
35
Summary is simple.
Before:
Tomorrow:
Mobile first! (*
*) lukew.com/ff/entry.asp?933
36
Teemu MalinenSofokus Oy
[email protected] 040-531 8012twitter.com/teemumalinentwitter.com/sofokus
Thanks!
PLEASE, LINK ME IF YOU WISH
