responsive design business_case_or_not

INSIGHT Responsive Web: Business Benefits or Not? Tommi Pelkonen, Strategist tommip

tommipelkonen [email protected]

www.frantic.com

2010->: Strategist at Frantic 2008-2010: Business Consultant at Finpro Budapest in ICT/software business 2005-2008: Strategist at Satama Amsterdam 1999-2005: Business Consultant at Satama Helsinki 1996-1999: Research at the HSE Electronic Commerce Institute, focus: digital media service companies Born 1971, married, daughter M.Sc. (Econ.): 1999, Helsinki School of Economics, HSE, International Business, Finance & Accounting, Information Technology Lecturer and author of several publications & articles in the fields digital media, internationalisation of SMEs and service business Industrial focus: Media, Telecoms, Financial sector, B2B Commerce, Industrial manafacturing Consulting focus: Strategy, Procesess & Innovation, Digital opportunities, Business modelling

TOMMI PELKONEN, Strategist

INSIGHT Responsive Web: Business Benefits or Not? Basics –what is responsive web? Think – Design – Tech - challenges Business considerations So what – why should you care?

INSIGHT Responsive Web: Business Benefits or Not?

Basics –what is the responsive web? Think – Design – Tech - challenges Business considerations So what – why should you care?


Basics…Think… Business… So what…

the Mobile web here to stay! •  In 2011,

smartphone shipments surpassed desktop device shipments.

• The web is changing and we need to change the way we design and develop for it...

In country a.k.a the Nokia-land, too!

http://www.tns-gallup.fi/uutiset.php?aid=14815&k=14320!

5/2012: "44 % Smartphones, "

6 % tablets!

At first, there was a Nokia-dominated mobile web…!

We experienced a plethora of amazing" mobile-driven service innovations.!

These led to mobile service harmonisation (to some extent)!

And then came iPhone, the touch & the apps explosion…

http://www.mdgadvertising.com/blog/wp-content/uploads/2013/06/should-you-build-a-mobile-app-or-mobile-website.png!

Now, it all about choosing between mobile sites or

mobile apps –or is it?

Responsify yourself?

Responsive design is an approach to web page creation that makes use of flexible layouts, flexible images and cascading style sheet media queries. !

!The goal of responsive design is to

build web pages that detect the visitor’s screen size and orientation and change the layout accordingly.!

http://whatis.techtarget.com/definition/responsive-design!

The big question: Why wouldn't you want your website to look great regardless of whether it’s

viewed on a desktop, smartphone, or any other kind of device? http://responsiveweb.ca!

Key design/tech principles

One service fits for all devices &

browsers

Fluid design, flexible grids and scalable

imagery

Design/think

mobile first

Use style sheets (CSS) and media

queries to the maximum

Support modern browsers

(rule of thumb 2009 tech onwards should

work…)

Unleash the potential of the

browser

Show only the essential, build the

extras gradually and contextually

Recognise the device, place,

context and time –and then customise

Nice – but once again .!Is there any business relevance in this?!



Basics –what is the responsive web? Think – Design – Tech Business considerations So what – why should you care?


Basics…… Think… Business… So what…

CASE 1: Music listening & entertainment:

Responsive design/tech?

Responsive thinking?

Response to the need/environment for private listening?

CASE 2: Television & entertainment:



Response to the need to view relavant content to oneself?

CASE3: Real life & feedback:



Response with the environment and audiences?

Three essential themes in RWD

THINKING: INNOVATE

DESIGN: PLAN & GUIDE

TECHNOLOGY: MAKE IT HAPPEN

The discussion on RWD has so far been mostly been focused on design & tech

WHY?!

WHAT?!

HOW?!

Dimensions for RWD

SET-UP: Screen size/browser/device/OS –configuration

CONTEXT: Location/Place

OCCASION: Time/Season

Context and occasion are less used components for responsive design at the

moment

Challenges for Responsive Solutions

Speed issues

• What will the extra code and scripts needed to do for my site performance?

• What do hide/show to keep the load times fast enough?

• How to optimise content & media for di!erent sizes?

Functionality

• What do we o!er at each site size category and how?

• How to o!er the same quality of service on mini/normal/maxi-screens without loosing the essential?

• How to design minimal, but o!er upwards scalability?

• What angle should be taken to older browser usage?

Content

• What extra levels of content do we o!er in each of the size classes?

• How to view and manage di!erent content elements in di!erent sizes

• How to make sure the same content works in all the sizes?

SIMPLE FORMULA

BENEFITS > COSTS => FEASIBILITY!

Key benefits for RWD Update once, update all •  Less concerns and work on

updating several di!erent versions of a website in order to keep the mobile, tablet and desktop versions consistent.

SEO Benefits - tra"c •  Inbound links concentrated

into one site and domain. Less domains, less crowling for Google –better changes to optimise well and gain tra"c

Less systems – less costs • One platform, one content

approach, less apps, less testing

•  In theory (at least) this should lead into cost savings

Think di!erently • RWD pushes organisation to

rethink their web and mobile strategy and approach

• Brings location & time to the thinking context, too.

RWD Cost Implications Additional testing and programming costs for site development •  Roughly min 20-30% more

programming /testing work

Content optimisation costs •  Especially images and video

content may cause extra work and thus costs

•  How to test and manage this content process?

Legacy application sti!ness •  Regardless of fancy RWD for main

content, the actual transactional and servicing tools most propably will not turn responsive easily = costs can skyrocket fast

Limited usage / costs •  In many areas and industries,

mobile = responsive approach demanding usage is still marginal – thus may not be worth the e!ort

A good business case or not?

Benefits

•  Update & content management costs decreases

•  System maintenance & management cost decreases

•  SEO – more tra"c to site •  Innovation potential and

rethinking of the web/mobile strategy

Costs

•  Increased programming and testing costs

•  Increases in content optimisation costs and requirements

•  Legacy application integration and

•  Marginal use times and case in several industries – eye candy – vs. real benefits?

There is no absolute answer to the feability formula in this – trials and tests are needed!

USE A PLANNING / THINKING FRAMEWORK!

Which services should you develop to fulfil the needs of

your customers?

How can you develop services to fit your strategy?

Define

Develop

Analyse & Conclude

How can you attract new customers?

How can you convince new customers to

purchase?

How can you make a sale and turn a trial into repeated usage?

How can you keep your customers loyal and

expand your share of their wallet?

Reach

Engage

Activate

Nurture

MARKETING

SALES SERVICE

RETENTION

Create, manage & Innovate

Measure: Measure develop & optimise (KPIs)

CUSTOMER /COMPANY

conversion point

conversion point conversion point

conversion point

This should be used regardless

of being responsive or

not… !

Some hints to proceed

• Test this possiblity and see how you perform

• Analyse your mobile site usage and its potential to grow

•  Start building/refining your mobile strategy – sites are becoming mobilised all over the place

• Pilot on limited areas to learn more about the potential

TEST YOUR SITE - NOW

You can already see how you site looks on di!erent screen sizes

mattkersley.com/responsive/!www.ipadpeek.com !

!

But does this really matter? •  In web design – there is no silver bullet!

• Yet, there are good best practices and it seems the RWD is becoming one of these

• RWD still in early phases, but can become something very essential for all site designs

•  It does not harm to be prepared for the change to come – mobile is here to stay!

www.frantic.com

THANK YOU!