3 Strategies for Going Mobile with Drupal

transcript

3 STRATEGIES FOR GOING MOBILE WITH DRUPAL

Kurt Voelker, CTO, Forum OneChris Brown, Technical Account Manager, Acquia

Drupal Drives DC -‐ May 2012

Thursday, May 10, 12

MOBILE CAN’T BE IGNORED

Today, more mobile devices are sold than

83 %Of American adults own a cell phone…

42 %Of cell phone owners have smartphones…

By next year, mobile will overtake PCs for web

access.source: Gartner; http://www.gartner.com/it/page.jsp?id=1278413Thursday, May 10, 12

THAT WEB SITE

THAT YOU ARE WORKING ON RIGHT NOW

BUSTING YOUR BUTT TO LAUNCH BY Q4

WITHIN 6 SHORT MONTHS OF LAUNCHING

MORE VISITORS WILL VISIT IT FROM A MOBILE DEVICE THAN INTERNET EXPLORER 8.

June 2012

May 2012

Dec 2012

Aug 2012

DRUPAL CAN HELP TODAY.

1 Minimize Effort to Mobilize Your SiteBuild once and sFll serve every device with responsive design

2 Deepen Engagement with a Na9ve AppManage mobile and desktop content in one place

3 Tailor the Mobile ExperienceManage mobile and desktop content in one place

MINIMIZE EFFORT TO MOBILIZE YOUR SITE

MOBILIZING YOUR SITE: THE OLD DAYS• Create a completely separate site -‐ “m dot”

• Hand select content and apply separate layouts

and styles

• Individual styles and layouts for specific devices

All of these are hard work that require continual servicing as

your site evolves.

contentstructure

contentstyle

ONE CODE BASE. ALL SCREENS.Thursday, May 10, 12

FROM DESKTOP…Thursday, May 10, 12

TO TABLET…Thursday, May 10, 12

…TO SMART PHONES.Thursday, May 10, 12

DRUPAL: RESPONSIVE FROM THE STARTToday: Several base themes support responsive

layout out of the box.

• Omega

• AdapFve Theme

• Zen

DEEPEN ENGAGEMENT WITH NATIVE APPS

http://blog.flurry.com/bid/63907/Mobile-Apps-Put-the-Web-in-Their-Rear-view-Mirror

Apps matter because people use them more often than a mobile browser.

Your Brand!

Apps Matter Because they Deepen Engagement

Every day, CSIS’s iPhone App serves more page views than the Publications section of

their web site.

Managing Mobile needs to be as Simple as Managing the Web

CREATE A TAILORED EXPERIENCE

DSCA LIVE DEMO

1 Minimize Effort to Mobilize Your SiteBuild once and sFll serve every device with responsive design

2 Deepen Engagement with a Na9ve AppManage mobile and desktop content in one place

3 Tailor the Mobile ExperienceManage mobile and desktop content in one place

THANKS!QUESTIONS AND ANSWERS

RESERVE SLIDES

THE FREEDOMHOUSE.ORG BACK STORY• Needed: Data-‐rich, visually appealing, easy to manage THAT is also

mobile accessible

• So How?

- We knew flash is a no go -‐ a mobile non-‐starter

- GIS Mapping tools are great but they get really complicated when moving

beyond “just points on a map” -‐ and ulFmately we saw a big GIS stack is overkill

- Much more difficult to integrate with Drupal managed data

- Much more difficult to make interacFve

- Limited to “Real Maps”

- Metro maps

- Alaska and HI

• So we created JS Map -‐ SVG BasedThursday, May 10, 12

Flash is a no-go for mobile

GIS Can Be Limiting...

Because Sometimes Your Visualization Needs to Ignore Reality

PLACE HOLDER SLIDES TO BE CONSIDERED FROM CGAP PRESO

JS MAP: WHAT IT DOES• Easily create interactive maps that display data

• Relates Drupal stored data to regions and shapes

• Cross-browser compatible requiring no plugins

• Mobile ready

JS Map: Mobile Supported Mapping for Drupal

Any node or fieldable entities

mapped to regions

JS Map: Mobile Supported Mapping for Drupal

Control region groupings and

display.

Re-use regions across an entire

Easily Import New Maps

Manage Regions from within the UI

Integrated With Views as View Display Format

With Customizable Settings for Display

Integrated With Views as View Display Format

3 Strategies for Going Mobile with Drupal

Technology