drupal business summit - making your sites mobile accessible, four methods

40
Mobile Web Development Options [email protected] Twitter: @akucharski

Upload: promet-source

Post on 20-Jan-2015

1.805 views

Category:

Technology


3 download

DESCRIPTION

Drupal Business Summit 2012 Drupal Mobile Case studies: considerations to keep in mind when creating mobile sites and Four ways to take your site mobile and case studies:1) mobify, 2) jQuery Mobile 3) Responsive Design 4) Services

TRANSCRIPT

Page 1: Drupal Business Summit - making your sites mobile accessible, four methods

Mobile Web Development Options

[email protected]

Twitter: @akucharski

Page 2: Drupal Business Summit - making your sites mobile accessible, four methods

About Me

• Presenter• Andy Kucharski

• @akucharski

• Promet Source• Founder

• Quality Assurance

• @prometsource

Page 3: Drupal Business Summit - making your sites mobile accessible, four methods

About Promet

• Focus on open source software and Drupal exclusively since 2008

• Founded in 2003• Offices in the US (Chicago, San Jose)

Page 4: Drupal Business Summit - making your sites mobile accessible, four methods

Drupal as a multiplatform CMS

Mobile Apps

Services

Contributed Modules

Drupal Core

Page 5: Drupal Business Summit - making your sites mobile accessible, four methods

Hockey Stick Graph

• By 2013, mobile phones will overtake PCs as the most-common Web access device worldwide

• PrometSource.com website mobile traffic grew 275% from May 2011 to May 2012 (currently 6% of total traffic)

Page 6: Drupal Business Summit - making your sites mobile accessible, four methods

Other trends to consider

http://tag.microsoft.com/libraries/old_blogs/the-intelligent-shopper.sflb.ashx

Amazon eCommerce: over 1 Billion spent via mobile devices in past 12 months

Page 7: Drupal Business Summit - making your sites mobile accessible, four methods

What Was the Web? (thanks @brad_frost)

Page 8: Drupal Business Summit - making your sites mobile accessible, four methods

What is the Web? (thanks @brad_frost)

Page 9: Drupal Business Summit - making your sites mobile accessible, four methods

What will the Web be? (thanks @brad_frost)

Page 10: Drupal Business Summit - making your sites mobile accessible, four methods

Considerations – FOCUS People Using Mobile

Page 11: Drupal Business Summit - making your sites mobile accessible, four methods

Consideration – Content First Orbitz

Page 12: Drupal Business Summit - making your sites mobile accessible, four methods

Consideration – Content First United

Page 13: Drupal Business Summit - making your sites mobile accessible, four methods

What’s on?

Page 14: Drupal Business Summit - making your sites mobile accessible, four methods

Content ruleshttp://blog.programmableweb.com/2009/10/13/cope-create-once-publish-everywhere/

Page 15: Drupal Business Summit - making your sites mobile accessible, four methods

Other Considerations – Page Speed

Page 16: Drupal Business Summit - making your sites mobile accessible, four methods

More resources

• www.futurefriend.ly

• http://www.abookapart.com/products/mobile-first

Page 17: Drupal Business Summit - making your sites mobile accessible, four methods

Four ways to get your message our Right Now

1. Use a third party tool2. Switch Themes (device or screen

detection)3. Responsive Design4. Build an application and access your data

Page 18: Drupal Business Summit - making your sites mobile accessible, four methods

Simple Option – use a third party

• M.Dot – separate Domain• Use a third party such as Mobify or

MoovWeb

• They provide tools to transform your layouts

• They will host your mobile site

• Advantages• Fast and easy

• Free options available

• Disadvantages• Multiple platforms

• Loose some control to the third party

• Commercial support may get pricey

Page 19: Drupal Business Summit - making your sites mobile accessible, four methods

Separate Templates

• Switch Theme – performance hit• Detect device and present proper theme

• Advantages• Control

• Disadvantages• Multiple themes to maintain

• Detection not always reliable

Page 20: Drupal Business Summit - making your sites mobile accessible, four methods

www.mcmcauto.com

Page 21: Drupal Business Summit - making your sites mobile accessible, four methods

Responsive

Page 22: Drupal Business Summit - making your sites mobile accessible, four methods

Responsive Example

Page 23: Drupal Business Summit - making your sites mobile accessible, four methods

Responsive Example

Page 24: Drupal Business Summit - making your sites mobile accessible, four methods

Responsive Site Example

Page 25: Drupal Business Summit - making your sites mobile accessible, four methods

Build Applications with Drupal Services

Page 26: Drupal Business Summit - making your sites mobile accessible, four methods

Proprietary Technology Options – REPLACED!

Page 27: Drupal Business Summit - making your sites mobile accessible, four methods

Receiving calls on ipad

When Driver arrives to the pick up location, they will touch ‘Load’ or ‘No Load’ based on whether Rider gets into cab.

Page 28: Drupal Business Summit - making your sites mobile accessible, four methods

Dispatch's Driver map

Hold curser over orange dot to display cab number.

All iPads have GPS tracking to manage cab’s location.

Page 29: Drupal Business Summit - making your sites mobile accessible, four methods

Call Screen

Pull down menu allows Users to assign calls to drivers.

User can click on any call to view in entirety & make revisions.

Page 30: Drupal Business Summit - making your sites mobile accessible, four methods

Green Cab Consumer App on iTunes

Page 31: Drupal Business Summit - making your sites mobile accessible, four methods
Page 32: Drupal Business Summit - making your sites mobile accessible, four methods

Pragmatism, Reality and Budgets

• So you’re not ready to build an Augmented Reality application for your Drupal website – it’s OK!

• Reasons to be happy about being here

Page 33: Drupal Business Summit - making your sites mobile accessible, four methods

Drupal Profiles: Open Public – responsive out of the box

Page 34: Drupal Business Summit - making your sites mobile accessible, four methods

Drupal is Ready – Prime your site with OMEGA and other Responsive Themes

Page 35: Drupal Business Summit - making your sites mobile accessible, four methods

Services

Page 36: Drupal Business Summit - making your sites mobile accessible, four methods

Luke Wroblewski – Mobile First

GROWTH OPPORTUNITYCONSTRAINTS FOCUSCAPABILITIES INNOVATION

Page 37: Drupal Business Summit - making your sites mobile accessible, four methods

Drupal as a multiplatform CMS

Mobile Apps

Services

Contributed Modules

Drupal Core

Page 38: Drupal Business Summit - making your sites mobile accessible, four methods

Questions?www.prometsource.com

[email protected]

Twitter: @akucharski

@PROMETSOURCE

Page 39: Drupal Business Summit - making your sites mobile accessible, four methods

MOZILLA

Page 40: Drupal Business Summit - making your sites mobile accessible, four methods

Responsive site from 1997