CoreMedia User Summit 2014 - Mobile First
Upcoming SlideShare
Loading in...5
×
 

CoreMedia User Summit 2014 - Mobile First

on

  • 118 views

 

Statistics

Views

Total Views
118
Views on SlideShare
117
Embed Views
1

Actions

Likes
0
Downloads
3
Comments
0

1 Embed 1

http://www.slideee.com 1

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • Shutterstock 130782974
  • Total:6,835 million mobile subscriptions world-wide2,096 million mobile broadband subscriptions http://mobithinking.com/mobile-marketing-tools/latest-mobile-stats/a#smartphonepenetration
  • http://www.agof.de/download/Downloads_Mobile_Facts/Downloads_Mobile_Facts_2013/Downloads_Mobile_Facts_2013_III/mf%202013-III%20AGOF_mobile_facts_2013-III.pdfBild has 15 mill UU (26%)Spiegel und Die Welt 11 Mill UUFocus ca. 12ca (30%)
  • http://www.mobify.com/insights/the-new-multi-screen-world-understanding-consumer-behaviour/
  • GD was born out of the necessity to deal with different browsers but quickly adapted to deal with form factors.
  • Mobile browsers have to download the full page and have to peel away at the HTML and pictures based on browser capabilities -> slow experience.Interesting links:http://gigaom.com/2012/05/23/the-growing-epidemic-of-page-bloat/http://www.keynote.com/keynote_competitive_research/performance_indices/mobile/retail/index.htmlhttp://httparchive.org/trends.php
  • The exact opposite. Start with the smallest common denominator and then enhance the experience.E.g. touch which is now used on desktops as wellBasic premise behind mobile first!
  • Can bring up task-oriented paradigm…
  • http://mobile.smashingmagazine.com/2013/03/18/retrofit-a-website-to-be-responsive-with-rwd-retrofit/
  • Mobile First Look through Perfect ChefResponsive Image HandlingResponsive PreviewMention the App Connector

CoreMedia User Summit 2014 - Mobile First CoreMedia User Summit 2014 - Mobile First Presentation Transcript

  • www.coremedia.com Mobile First Taming the device zoo and coping with change
  • © CoreMedia | 10 April 2014 | 2© CoreMedia AG | 10 April 2014 | 2 Mobile First  Why is Mobile First Important?  What are the parts of a Mobile First web site?  How can I leverage existing investments into my site?  CoreMedia Mobile First Demo
  • © CoreMedia | 10 April 2014 | 3© CoreMedia AG | 10 April 2014 | 3 World-Wide Broadband Subscriptions 422 million 460 million 895 million 164 million 168 million 303 million Mobile Broadband Subscriptions Fixed Line Broadband Subscriptions Source: mobithinking.com, 2013
  • © CoreMedia | 10 April 2014 | 4© CoreMedia AG | 10 April 2014 | 4 Mobile Broadband Outweighs Fixed Broadband 3 : 1
  • © CoreMedia | 10 April 2014 | 5© CoreMedia AG | 10 April 2014 | 5 German Mobile Usage  63 million active cell phones  Average growth at 33% in 4 months  Over 21% of the UMUs in this list are delivered by CoreMedia customers Source: AGOF 2013-III
  • © CoreMedia | 10 April 2014 | 6© CoreMedia AG | 10 April 2014 | 6 The Internet is Everywhere
  • © CoreMedia | 10 April 2014 | 7© CoreMedia AG | 10 April 2014 | 7 Usage Patterns Source: Mobify
  • © CoreMedia | 10 April 2014 | 8© CoreMedia AG | 10 April 2014 | 8 Usage Patterns Source: Mobify
  • © CoreMedia | 10 April 2014 | 9© CoreMedia AG | 10 April 2014 | 9 Coping Technique: Graceful Degradation  The full desktop site is rendered and sent to the mobile devices  Depending on the device capabilities, features are disabled  Images are re-sized by the browser
  • © CoreMedia | 10 April 2014 | 10© CoreMedia AG | 10 April 2014 | 10 Graceful Degradation – The Pitfall  Average Page Weight between 2010 and 2014 has increased significantly  Sending a full desktop site to a mobile device makes a slow mobile experience Source: httparchive.org The average page weight has doubled in the past three years (735KB vs 1.7MB)
  • © CoreMedia | 10 April 2014 | 11© CoreMedia AG | 10 April 2014 | 11 Coping Technique: Progressive Enhancement  Focus on most vital functionality on smaller form factory  Add functionality based on device capabilities / screen size  Addresses the page weight problem  Take advantage of new technologies and interaction paradigms
  • © CoreMedia | 10 April 2014 | 12© CoreMedia AG | 10 April 2014 | 12 2010 – The Year Google went Mobile-First What’s really important right now is to get the mobile architecture right. Mobile will ultimately be the way you provision most of your services. The way I like to put it is, the answer should always be mobile first. You should always put your best team and your best app on your mobile app. - Eric Schmidt, 2010
  • © CoreMedia | 10 April 2014 | 13© CoreMedia AG | 10 April 2014 | 13 Embracing Chance “The control which designers know in the print medium, and often desire in the web medium, is simply a function of the limitation of the printed page. We should embrace the fact that the web doesn’t have the same constraints, and design for this flexibility. But first, we must 'accept the ebb and flow of things.” John Allsopp, “A Dao of Web Design”
  • © CoreMedia | 10 April 2014 | 14© CoreMedia AG | 10 April 2014 | 14 Meet Responsive Design  Embrace the that print and digital layouts are different  Create layouts (CSS styles) that dynamically adapt themselves to the form factor  Native query capabilities introduced in CSS 2.1 – Responsive happens on the front-end  Design based on flexible/fluid grids
  • © CoreMedia | 10 April 2014 | 15© CoreMedia AG | 10 April 2014 | 15 And what about Apps?  Most phone time is spent in apps  … but mostly for gaming and social  … apps require a download  … yet they allow access to hardware and work off-line  Hybrid apps allow leveraging responsive sites in app
  • © CoreMedia | 10 April 2014 | 16© CoreMedia AG | 10 April 2014 | 16 Mobile First – The Right components  Focus on what’s important – design for the mobile form factor first  User Experience and Wireframes  Visual Design  Content Strategy  Implementation  Responsive Design: utilize responsive design to build flexible, adaptable grid layouts  Adaptive Design: Utilize adaptive design to augment responsive design with more dynamic behavior
  • © CoreMedia | 10 April 2014 | 17© CoreMedia AG | 10 April 2014 | 17 Mobilizing Your Site: Separate Sites Pros  Create a fully mobile-first responsive site for all touch devices  Desktop site remains unaffected Cons  Maintenance of duplicate sites / code  Disjoint user experiences don’t cater to omni-channel audience  Tend to drift apart in functionality over time  Why keep the desktop site around?
  • © CoreMedia | 10 April 2014 | 18© CoreMedia AG | 10 April 2014 | 18 Mobilizing Your Site: Responsive Retrofit Pros  Leverage your existing codebase  Separate CSS on top of existing markup  Reasonable development cost  Utilize services such as sevenval, Bmobilized, or Mobify Cons  Risk – the typical desktop markup doesn’t lend itself to mobile cases  Changes to desktop HTML may have adverse affects on other form factors  Responsive image handling not easily accommodated  User Experience not optimized for mobile, just retrofitted
  • © CoreMedia | 10 April 2014 | 19© CoreMedia AG | 10 April 2014 | 19 Mobilizing Your Site: Mobile-First, Responsive Rebuild Pros  Consistent user experience across all channels  Supports a wide range of devices from phones to TVs  Future-friendly, hip, current technology stack  Fully leverage the CoreMedia Blueprint Cons  Re-write of the presentation layer requires planning, new user experience, and technical re-work  Higher development cost
  • © CoreMedia | 10 April 2014 | 20© CoreMedia AG | 10 April 2014 | 20 Mobile First and Responsive Design Accelerated by CoreMedia DEMO
  • www.coremedia.com© CoreMedia | 11. April 2014 | 21 Singapore asia-info@coremedia.com tel +65.6562.8866 Hamburg info@coremedia.com tel +49.40.32 55 87.0 San Francisco usa-info@coremedia.com tel +1.415.371.0400 London uk-info@coremedia.com tel +44.207.849.3317 Washington info@coremedia.com tel +1.703.945.1079