3 strategies for going mobile with drupal

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

PCs.


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

http://www.gartner.com/it/page.jsp?id=1278413




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

40


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

site.


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