SlideShare une entreprise Scribd logo
1  sur  37
Télécharger pour lire hors ligne
Mobile Strategies for
Drupal
Drupalcamp6 NYC 2009
   p     p

Tom Deryckere
Software Architect
Goal of the session:
Strategy for making Drupal a mobile CMS




                          Contrib
         CORE

                                          2
Goals

1 Drupal i t ll ti
  D     l installation containing Mobile and Desktop
                          tii     M bil    d D kt
content ( = real content management)
 Easy transformation of Desktop theme to mobile
theme ( = appropriate content adaptation)
 Optimize mobile themes
  p
 Decide on functionality from within Drupal
( = cut chaos on mobile devices)
 Tweak layouting within drupal (reorganise your site)
 Lead traffic from Destkop to Mobile site

            Make the mobile development p
                                  p     process
            less painfull!!
                                                        3
« Drupal is mobile friendly but does
not leverage the mobile web yet. This
    is because the content is well
    structure, but no detection or
    adaptation is available or has
            been tested. »


                                        4
Siruna
Mobile Architects

 Unique Content adaptation engine and mobile
authoring tool
        g
 Software as a service
Repurposing of content
 Open Source with commercial license
  p
Integration with Drupal possible

  Siruna is no drupal shop: we provide technology and
        services for web agencies and developers
                                                        5
The Siruna platform
           p




                      6
Adaptation engine:
   p          g
proxy to the mobile user
       Mobile URL               Desktop
                                D kt URL




                          DNS




           Adaptation
            engine




                Website / XML stream
                                           7
Adaptation engine:
   p         g
Atomic adaptations

                                              Desktop URL
                           Mobile URL




             Atomic
             adaptations
Adaptation
                                Website / XML stream
 engine

                                                            8
Siruna hast the ambition to become
the leading open source platform and
    service provider in mobile web
             p
  applications based upon its mobile
            internet gateway


       (So no Drupal shop)
                                       9
Going mobile, where is the
    g
complexity?

Device detection
 Different screen sizes
 Image resizing
 Video transcoding
Mobile Navigation
 Table linearization / splitting
Pagination (reduction of vertical scrolling)
 HTML / CSS compliancy
 Reducing download size
Javascript (e.g. Running google analytics javascript serverside!)
xHTML and CSS cleanup ( =reducing download size)
                                g              )
Usability
....



                                                                    10
Drupal mobile state
   p


  Many attempts
  Focus on
        Providing mobile themes (e.g. iUI)
        Theme switching
        Th        it hi
        Mobile payments
  Not a lot of demos
  General no proven long term strategy
  An overview on
http://mobiledrupal.com/content/overview-mobile-modules-drupal
                                                                 11
Proposition:
    p
4 step strategy
                         Device Detection
                 (Mobile device, desktop, PSP, ...)



                           Switching
         (Make sure the user gets access to the best site)



                     Functionality + content
     (What f
     (Wh functionality and content is relevant for the device)
              i   li     d          i   l      f    hd i )



                             Theming
      (Layout, image resizing, navigation, table linearization)



                                                                  12
Step 1: device detection
   p


 Just detect
 J t d t t if access by mobile device
                     b      bil d i
is enough (no device properties)
 Some PHP code available
     $_
     $ SERVER['HTTP_USER_AGENT'],
             [                    ],
     $_SERVER['HTTP_ACCEPT'], ...

 UAprof,
 UAprof Wurfl give also information on
device characteristics
http://www.developershome.com/wap/d
etection/detection.asp?page=intro
                                         13
Step 2, 3 and 4:
   p
some architectures


 Legend

              Mobile module (new proposed)



                   Drupal core & contrib



          External system (e.g. Siruna transcoder)



                                                     14
Scenario A: theme switching
                          g



                     Common url


                                                 Step 1 & 2

      Device detection + Theme switching (e.g.
        Mobit, Accessibility, Mobile Theme)




                               Desktop theme
      Mobile theme                                Step 3 & 4

                                                              15
Scenario A: theme switching
                          g


 Pro:
         Simple setup (no DNS settings needed)
         Seamless transistion to mobile site for the
        visitor
 Contra:
         Use cannot choose
         User ca ot c oose to see mobile o des top
                                        ob e or desktop
        site (e.g. Iphone user is not able to see
        advanced content on desktop site)
         No content adaptation service can be inserted
         The mobile Theme has to be very powerfull and
        needs lot of effort
                                                          16
Scenario b: use of seperate
                     p
mobile and desktop url



              Mobile Device Detection
        (user notification of existence mobile
        (
          version or automatic redirection)
                                                 Step 1 & 2


        Mobile URL                Desktop URL

            Theme switching b
            Th      it hi based on url
                              d      l


                                                 Step 3 & 4
                                 Desktop theme
                                 Dk       h
       Mobile theme
                                                        17
Scenario B: use of seperate
                     p
mobile and desktop url


 Pro
     User is free to choose what to see
     compliance with practise of providing a
     m.* or *.mobi domain

 Contra
       Needs setup of DNS entries


                                               18
Mobile device dection module


                       Screenshot configuration panel:
                       See demo




                                                         19
Scenario C


                Mobile Device Detection
                                                   Step 1 & 2


                                     Desktop URL
        Mobile URL
                           DNS

             Transcoding



                     Drupal preprocessing               Step 3 & 4

                            1 Drupal
                           installation

                                                            20
Scenario C


   Pro
         Flexible and modular
         1 th
           theme, 1 CMS th real multi-platform publishing
                     CMS: the    l    lti l tf       bli hi
         experience
         Functionality and content selection possible in
         Drupal (P
         D     l (Preprocessing)
                            i)
         Correct adaptation possible targetting all devices

   Con
   C
         Multiple components can seem complex


  This is our target scenario to allow optimal mobile
                 g                      p
experiences! Supporting modules are being developed.          21
Supporting modules
  pp     g

 Mobile context in the permission system
     Roles of the mobile user gets replaced by a mobile
     role
      Administrator can use role permissions to toggle
     functionality
       • Node Acces, Menu per role, etc ... Can help

      = M bil context f permissions
        Mobile   t t for    ii

 Adding mobile context in the theming system
     Arrange blocks f the mobile user
                       for
     Configure your theme for the mobile user
     This is not building a complete new mobile theme,
     but adapting your desktop theme and content


                                                          22
Supporting modules
  pp     g
Mobile permissions




             Mobile permission configuration panel




                                                     23
Supporting modules
  pp     g
Mobile permissions


              Automatic creation of a mobile user allows
             fine grained permission toggling




                                                           24
Supporting modules
  pp     g
Mobile permissions




                     With help of the node acces module:
                     Page only available for mobile users


                                                            25
Supporting modules
  pp     g
Theming system


 Duplicate your theme
     Copy dir of your theme and rename the dir and *.info file
     e.g. Garland -> mobile-garland, Garland/garland.info ->
     mobile garland/mobile garland.info
     mobile-garland/mobile-garland.info
     You have now two identical themes with a different name
     ☺

This manual “hack” is needed because there is no
p
possibility to hook in the theme detection process
          y                                p

Configure your blocks and general theme settings

                                                                 26
Supporting modules
  pp     g
Theming system




                 Define the usage of a mobile theme
                 (by using your existing deskop theme)

                                                         27
Supporting modules
  pp     g
Theming system




                     28
Supporting modules
  pp     g
Theming system


               Configure th bl k f you mobile
               C fi      the blocks for  bil
               context




                                                29
Demo



 Device detection and user notifications
 Extension of the permission system
    Mobile user gets a mobile role

 Extension of the theming system
                        gy
       Copy you theme as a mobile theme

 Integration with a content adaptation
 It     ti    ith      t t d t ti
engine
                                           30
Step 3: Content adaptation
   p               p


 Takes care of the device complexity
       Device detection
        Different screen sizes
        Image resizing
        Video transcoding
       Mobile Navigation
        Table linearization / splitting
                               p      g
       Pagination (reduction of vertical scrolling)
        HTML / CSS compliancy
        Reducing download size
       Javascript (e.g. Running google analytics javascript serverside!)
                   (e g
       xHTML and CSS cleanup ( =reducing download size)

Siruna can add location based services and the Insertion of mobile
advertisments
http://mobiledrupal.com/content/make-your-drupal-blog-mobile


                                                                           31
Content adaptation engine
           p         g
Siruna Composer
                 XML based rules
  Previewing
  Pre ie ing
                 (http://open.siruna.org/documentation/sitemap-api)




                                                                32
Siruna with drupal integration
               p       g



                  Transcoding
                    (Siruna)
                    (Sir na)




            Siruna – Drupal integration




                      Drupal
Siruna with drupal
                 p
integration In development!


  Easily create adaptation filters for
 menu pages / content types /
 individual nodes

  Reuse adaptations for the most
            p
 popular themes

  Previewing and testing

                                         34
Two resulting modules
            g


 Mobile Tools module
     Notification / redirection / permission system
     / theming / ....
     Public soon!

 Siruna integration module
     Configuration f
     C fi       ti from drupal
                          d    l
      Generation snippets / adaptation repository
      Configurations adaptation filters (e g Filters
                                        (e.g.
     for specific content types, pages, menu
     items)
                                                       35
resources



Details and modules will be published
soon on: http://www.mobiledrupal.com
          http://www mobiledrupal com
Adaptation service:
    http://open.siruna.org
    http://composer.siruna.com
    http://composer siruna com

http://groups.drupal.org/mobile
   pg      p     p     g
Tom.Deryckere@siruna.com
                                        36
Contact



Mail : Tom.Deryckere@siruna.com

Blog: http://www.mobiledrupal.com

Siruna: http://www.siruna.com,
 http://open.siruna.com
 htt //        i



                                    37

Contenu connexe

En vedette

Why Rodan + Fields? Why now?
Why Rodan + Fields?  Why now?Why Rodan + Fields?  Why now?
Why Rodan + Fields? Why now?jeliz12
 
The ABC+Ds of Placemaking
The ABC+Ds of PlacemakingThe ABC+Ds of Placemaking
The ABC+Ds of PlacemakingYuri Artibise
 
Biochemistry part 2 and m&ms lab
Biochemistry part 2 and m&ms labBiochemistry part 2 and m&ms lab
Biochemistry part 2 and m&ms labMaria Donohue
 
House for Sale in Central Phoenix
House for Sale in Central PhoenixHouse for Sale in Central Phoenix
House for Sale in Central PhoenixYuri Artibise
 
Harnessing the full potential of mobile through paid search
Harnessing the full potential of mobile through paid searchHarnessing the full potential of mobile through paid search
Harnessing the full potential of mobile through paid searchIncubeta NMPi
 
How Affiliate Marketing Looks In February 2010
How Affiliate Marketing Looks In February 2010How Affiliate Marketing Looks In February 2010
How Affiliate Marketing Looks In February 2010Incubeta NMPi
 
Building Mobile Websites with Joomla
Building Mobile Websites with JoomlaBuilding Mobile Websites with Joomla
Building Mobile Websites with JoomlaTom Deryckere
 
OFS Presentation
OFS PresentationOFS Presentation
OFS Presentationstevecassia
 
SES 2014 Smart Remarketing presentation from Net Media Planet
SES 2014 Smart Remarketing presentation from Net Media PlanetSES 2014 Smart Remarketing presentation from Net Media Planet
SES 2014 Smart Remarketing presentation from Net Media PlanetIncubeta NMPi
 
Digital Researcher at Higher Education
Digital Researcher at Higher EducationDigital Researcher at Higher Education
Digital Researcher at Higher EducationAjmalSultany
 
The Real-Time Opportunity- Net Media Planet Seminar
The Real-Time Opportunity- Net Media Planet Seminar The Real-Time Opportunity- Net Media Planet Seminar
The Real-Time Opportunity- Net Media Planet Seminar Incubeta NMPi
 
Careers: Taking a New Direction and Making It Work
Careers: Taking a New Direction and Making It WorkCareers: Taking a New Direction and Making It Work
Careers: Taking a New Direction and Making It WorkYuri Artibise
 
HOW TO BE A GREAT BOSS ?
HOW TO BE A GREAT BOSS ?HOW TO BE A GREAT BOSS ?
HOW TO BE A GREAT BOSS ?Philippe Roques
 

En vedette (17)

Search is Sexy
Search is SexySearch is Sexy
Search is Sexy
 
Why Rodan + Fields? Why now?
Why Rodan + Fields?  Why now?Why Rodan + Fields?  Why now?
Why Rodan + Fields? Why now?
 
The ABC+Ds of Placemaking
The ABC+Ds of PlacemakingThe ABC+Ds of Placemaking
The ABC+Ds of Placemaking
 
Biochemistry part 2 and m&ms lab
Biochemistry part 2 and m&ms labBiochemistry part 2 and m&ms lab
Biochemistry part 2 and m&ms lab
 
House for Sale in Central Phoenix
House for Sale in Central PhoenixHouse for Sale in Central Phoenix
House for Sale in Central Phoenix
 
Harnessing the full potential of mobile through paid search
Harnessing the full potential of mobile through paid searchHarnessing the full potential of mobile through paid search
Harnessing the full potential of mobile through paid search
 
How Affiliate Marketing Looks In February 2010
How Affiliate Marketing Looks In February 2010How Affiliate Marketing Looks In February 2010
How Affiliate Marketing Looks In February 2010
 
#PLAYCADE
#PLAYCADE#PLAYCADE
#PLAYCADE
 
Building Mobile Websites with Joomla
Building Mobile Websites with JoomlaBuilding Mobile Websites with Joomla
Building Mobile Websites with Joomla
 
OFS Presentation
OFS PresentationOFS Presentation
OFS Presentation
 
SES 2014 Smart Remarketing presentation from Net Media Planet
SES 2014 Smart Remarketing presentation from Net Media PlanetSES 2014 Smart Remarketing presentation from Net Media Planet
SES 2014 Smart Remarketing presentation from Net Media Planet
 
Digital Researcher at Higher Education
Digital Researcher at Higher EducationDigital Researcher at Higher Education
Digital Researcher at Higher Education
 
Meiosis
MeiosisMeiosis
Meiosis
 
The Real-Time Opportunity- Net Media Planet Seminar
The Real-Time Opportunity- Net Media Planet Seminar The Real-Time Opportunity- Net Media Planet Seminar
The Real-Time Opportunity- Net Media Planet Seminar
 
Popeco
PopecoPopeco
Popeco
 
Careers: Taking a New Direction and Making It Work
Careers: Taking a New Direction and Making It WorkCareers: Taking a New Direction and Making It Work
Careers: Taking a New Direction and Making It Work
 
HOW TO BE A GREAT BOSS ?
HOW TO BE A GREAT BOSS ?HOW TO BE A GREAT BOSS ?
HOW TO BE A GREAT BOSS ?
 

Similaire à Mobile Strategies for Drupal (NY DrupalCamp6)

Siruna session at Drupalcon Paris 2009
Siruna session at Drupalcon Paris 2009Siruna session at Drupalcon Paris 2009
Siruna session at Drupalcon Paris 2009Tom Deryckere
 
Top Ten Tips for HTML5/Mobile Web Development
Top Ten Tips for HTML5/Mobile Web DevelopmentTop Ten Tips for HTML5/Mobile Web Development
Top Ten Tips for HTML5/Mobile Web DevelopmentSimon Guest
 
Siruna presentation Mobile Drupal @ Drupalcamp Colorado Jun09
Siruna presentation Mobile Drupal @ Drupalcamp Colorado Jun09Siruna presentation Mobile Drupal @ Drupalcamp Colorado Jun09
Siruna presentation Mobile Drupal @ Drupalcamp Colorado Jun09Tom Deryckere
 
IBM Datapower Gateways - Devops with UrbanCode Deploy
IBM Datapower Gateways - Devops with UrbanCode DeployIBM Datapower Gateways - Devops with UrbanCode Deploy
IBM Datapower Gateways - Devops with UrbanCode DeployJared Putman
 
Drupal as a Framework for Mobile Development
Drupal as a Framework for Mobile DevelopmentDrupal as a Framework for Mobile Development
Drupal as a Framework for Mobile DevelopmentRachel Jaro
 
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDee Sadler
 
Drupalcamp armedia phonegap_oct2012_print
Drupalcamp armedia phonegap_oct2012_printDrupalcamp armedia phonegap_oct2012_print
Drupalcamp armedia phonegap_oct2012_printDrupalcampAtlanta2012
 
Drupalcamp LA Aug 2009
Drupalcamp LA Aug 2009Drupalcamp LA Aug 2009
Drupalcamp LA Aug 2009Tom Deryckere
 
AD114 -- Beyond the Mobile Browser? Building Rich Mobile Applications for IBM...
AD114 -- Beyond the Mobile Browser? Building Rich Mobile Applications for IBM...AD114 -- Beyond the Mobile Browser? Building Rich Mobile Applications for IBM...
AD114 -- Beyond the Mobile Browser? Building Rich Mobile Applications for IBM...ddrschiw
 
Drupalcamp New York 2009
Drupalcamp New York 2009Drupalcamp New York 2009
Drupalcamp New York 2009Tom Deryckere
 
Jmp103-Get the Jump on Mobilizing Your Notes and Domino Applications Today!
Jmp103-Get the Jump on Mobilizing Your Notes and Domino Applications Today!Jmp103-Get the Jump on Mobilizing Your Notes and Domino Applications Today!
Jmp103-Get the Jump on Mobilizing Your Notes and Domino Applications Today!Howard Greenberg
 
What’s new for Developers in IBM Domino & Domino Designer 9.0.1
What’s new for Developers in IBM Domino & Domino Designer 9.0.1What’s new for Developers in IBM Domino & Domino Designer 9.0.1
What’s new for Developers in IBM Domino & Domino Designer 9.0.1IBM Connections Developers
 
Innovate 2014 - DevOps Technical Strategy
Innovate 2014 - DevOps Technical StrategyInnovate 2014 - DevOps Technical Strategy
Innovate 2014 - DevOps Technical StrategyDaniel Berg
 
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...darwinodb
 
Rhomobile 5.5 Release Notes
Rhomobile 5.5 Release NotesRhomobile 5.5 Release Notes
Rhomobile 5.5 Release NotesKonstantin Rybas
 
X plat dev - part ii publish
X plat dev - part ii publishX plat dev - part ii publish
X plat dev - part ii publishTekObserver
 
MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...
MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...
MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...Amit Sheth
 
Developing TouchActive with GAE and GWT - Google DevFest Barcelona 2012
Developing TouchActive with GAE and GWT - Google DevFest Barcelona 2012Developing TouchActive with GAE and GWT - Google DevFest Barcelona 2012
Developing TouchActive with GAE and GWT - Google DevFest Barcelona 2012Andrew Mackenzie
 
Google Dev Fest Presentation
Google Dev Fest PresentationGoogle Dev Fest Presentation
Google Dev Fest PresentationAndrew Mackenzie
 

Similaire à Mobile Strategies for Drupal (NY DrupalCamp6) (20)

Siruna session at Drupalcon Paris 2009
Siruna session at Drupalcon Paris 2009Siruna session at Drupalcon Paris 2009
Siruna session at Drupalcon Paris 2009
 
Top Ten Tips for HTML5/Mobile Web Development
Top Ten Tips for HTML5/Mobile Web DevelopmentTop Ten Tips for HTML5/Mobile Web Development
Top Ten Tips for HTML5/Mobile Web Development
 
Siruna presentation Mobile Drupal @ Drupalcamp Colorado Jun09
Siruna presentation Mobile Drupal @ Drupalcamp Colorado Jun09Siruna presentation Mobile Drupal @ Drupalcamp Colorado Jun09
Siruna presentation Mobile Drupal @ Drupalcamp Colorado Jun09
 
IBM Datapower Gateways - Devops with UrbanCode Deploy
IBM Datapower Gateways - Devops with UrbanCode DeployIBM Datapower Gateways - Devops with UrbanCode Deploy
IBM Datapower Gateways - Devops with UrbanCode Deploy
 
Drupal as a Framework for Mobile Development
Drupal as a Framework for Mobile DevelopmentDrupal as a Framework for Mobile Development
Drupal as a Framework for Mobile Development
 
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile design
 
Drupalcamp armedia phonegap_oct2012_print
Drupalcamp armedia phonegap_oct2012_printDrupalcamp armedia phonegap_oct2012_print
Drupalcamp armedia phonegap_oct2012_print
 
Drupalcamp LA Aug 2009
Drupalcamp LA Aug 2009Drupalcamp LA Aug 2009
Drupalcamp LA Aug 2009
 
AD114 -- Beyond the Mobile Browser? Building Rich Mobile Applications for IBM...
AD114 -- Beyond the Mobile Browser? Building Rich Mobile Applications for IBM...AD114 -- Beyond the Mobile Browser? Building Rich Mobile Applications for IBM...
AD114 -- Beyond the Mobile Browser? Building Rich Mobile Applications for IBM...
 
Drupalcamp New York 2009
Drupalcamp New York 2009Drupalcamp New York 2009
Drupalcamp New York 2009
 
Jmp103-Get the Jump on Mobilizing Your Notes and Domino Applications Today!
Jmp103-Get the Jump on Mobilizing Your Notes and Domino Applications Today!Jmp103-Get the Jump on Mobilizing Your Notes and Domino Applications Today!
Jmp103-Get the Jump on Mobilizing Your Notes and Domino Applications Today!
 
What’s new for Developers in IBM Domino & Domino Designer 9.0.1
What’s new for Developers in IBM Domino & Domino Designer 9.0.1What’s new for Developers in IBM Domino & Domino Designer 9.0.1
What’s new for Developers in IBM Domino & Domino Designer 9.0.1
 
Innovate 2014 - DevOps Technical Strategy
Innovate 2014 - DevOps Technical StrategyInnovate 2014 - DevOps Technical Strategy
Innovate 2014 - DevOps Technical Strategy
 
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
 
Rhomobile 5.5 Release Notes
Rhomobile 5.5 Release NotesRhomobile 5.5 Release Notes
Rhomobile 5.5 Release Notes
 
X plat dev - part ii publish
X plat dev - part ii publishX plat dev - part ii publish
X plat dev - part ii publish
 
MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...
MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...
MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...
 
Google DevFest 2012 Presentation
Google DevFest 2012 PresentationGoogle DevFest 2012 Presentation
Google DevFest 2012 Presentation
 
Developing TouchActive with GAE and GWT - Google DevFest Barcelona 2012
Developing TouchActive with GAE and GWT - Google DevFest Barcelona 2012Developing TouchActive with GAE and GWT - Google DevFest Barcelona 2012
Developing TouchActive with GAE and GWT - Google DevFest Barcelona 2012
 
Google Dev Fest Presentation
Google Dev Fest PresentationGoogle Dev Fest Presentation
Google Dev Fest Presentation
 

Dernier

How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?IES VE
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintMahmoud Rabie
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...Aggregage
 
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDEADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDELiveplex
 
UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7DianaGray10
 
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfDaniel Santiago Silva Capera
 
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Brian Pichman
 
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding TeamAdam Moalla
 
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024D Cloud Solutions
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfAijun Zhang
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdfPedro Manuel
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Commit University
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8DianaGray10
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxMatsuo Lab
 
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarAI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarPrecisely
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1DianaGray10
 
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCostKubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCostMatt Ray
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-pyJamie (Taka) Wang
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPathCommunity
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaborationbruanjhuli
 

Dernier (20)

How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership Blueprint
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
 
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDEADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
 
UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7
 
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
 
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )
 
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team
 
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptx
 
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarAI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity Webinar
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
 
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCostKubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-py
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation Developers
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
 

Mobile Strategies for Drupal (NY DrupalCamp6)

  • 1. Mobile Strategies for Drupal Drupalcamp6 NYC 2009 p p Tom Deryckere Software Architect
  • 2. Goal of the session: Strategy for making Drupal a mobile CMS Contrib CORE 2
  • 3. Goals 1 Drupal i t ll ti D l installation containing Mobile and Desktop tii M bil d D kt content ( = real content management) Easy transformation of Desktop theme to mobile theme ( = appropriate content adaptation) Optimize mobile themes p Decide on functionality from within Drupal ( = cut chaos on mobile devices) Tweak layouting within drupal (reorganise your site) Lead traffic from Destkop to Mobile site Make the mobile development p p process less painfull!! 3
  • 4. « Drupal is mobile friendly but does not leverage the mobile web yet. This is because the content is well structure, but no detection or adaptation is available or has been tested. » 4
  • 5. Siruna Mobile Architects Unique Content adaptation engine and mobile authoring tool g Software as a service Repurposing of content Open Source with commercial license p Integration with Drupal possible Siruna is no drupal shop: we provide technology and services for web agencies and developers 5
  • 7. Adaptation engine: p g proxy to the mobile user Mobile URL Desktop D kt URL DNS Adaptation engine Website / XML stream 7
  • 8. Adaptation engine: p g Atomic adaptations Desktop URL Mobile URL Atomic adaptations Adaptation Website / XML stream engine 8
  • 9. Siruna hast the ambition to become the leading open source platform and service provider in mobile web p applications based upon its mobile internet gateway (So no Drupal shop) 9
  • 10. Going mobile, where is the g complexity? Device detection Different screen sizes Image resizing Video transcoding Mobile Navigation Table linearization / splitting Pagination (reduction of vertical scrolling) HTML / CSS compliancy Reducing download size Javascript (e.g. Running google analytics javascript serverside!) xHTML and CSS cleanup ( =reducing download size) g ) Usability .... 10
  • 11. Drupal mobile state p Many attempts Focus on Providing mobile themes (e.g. iUI) Theme switching Th it hi Mobile payments Not a lot of demos General no proven long term strategy An overview on http://mobiledrupal.com/content/overview-mobile-modules-drupal 11
  • 12. Proposition: p 4 step strategy Device Detection (Mobile device, desktop, PSP, ...) Switching (Make sure the user gets access to the best site) Functionality + content (What f (Wh functionality and content is relevant for the device) i li d i l f hd i ) Theming (Layout, image resizing, navigation, table linearization) 12
  • 13. Step 1: device detection p Just detect J t d t t if access by mobile device b bil d i is enough (no device properties) Some PHP code available $_ $ SERVER['HTTP_USER_AGENT'], [ ], $_SERVER['HTTP_ACCEPT'], ... UAprof, UAprof Wurfl give also information on device characteristics http://www.developershome.com/wap/d etection/detection.asp?page=intro 13
  • 14. Step 2, 3 and 4: p some architectures Legend Mobile module (new proposed) Drupal core & contrib External system (e.g. Siruna transcoder) 14
  • 15. Scenario A: theme switching g Common url Step 1 & 2 Device detection + Theme switching (e.g. Mobit, Accessibility, Mobile Theme) Desktop theme Mobile theme Step 3 & 4 15
  • 16. Scenario A: theme switching g Pro: Simple setup (no DNS settings needed) Seamless transistion to mobile site for the visitor Contra: Use cannot choose User ca ot c oose to see mobile o des top ob e or desktop site (e.g. Iphone user is not able to see advanced content on desktop site) No content adaptation service can be inserted The mobile Theme has to be very powerfull and needs lot of effort 16
  • 17. Scenario b: use of seperate p mobile and desktop url Mobile Device Detection (user notification of existence mobile ( version or automatic redirection) Step 1 & 2 Mobile URL Desktop URL Theme switching b Th it hi based on url d l Step 3 & 4 Desktop theme Dk h Mobile theme 17
  • 18. Scenario B: use of seperate p mobile and desktop url Pro User is free to choose what to see compliance with practise of providing a m.* or *.mobi domain Contra Needs setup of DNS entries 18
  • 19. Mobile device dection module Screenshot configuration panel: See demo 19
  • 20. Scenario C Mobile Device Detection Step 1 & 2 Desktop URL Mobile URL DNS Transcoding Drupal preprocessing Step 3 & 4 1 Drupal installation 20
  • 21. Scenario C Pro Flexible and modular 1 th theme, 1 CMS th real multi-platform publishing CMS: the l lti l tf bli hi experience Functionality and content selection possible in Drupal (P D l (Preprocessing) i) Correct adaptation possible targetting all devices Con C Multiple components can seem complex This is our target scenario to allow optimal mobile g p experiences! Supporting modules are being developed. 21
  • 22. Supporting modules pp g Mobile context in the permission system Roles of the mobile user gets replaced by a mobile role Administrator can use role permissions to toggle functionality • Node Acces, Menu per role, etc ... Can help = M bil context f permissions Mobile t t for ii Adding mobile context in the theming system Arrange blocks f the mobile user for Configure your theme for the mobile user This is not building a complete new mobile theme, but adapting your desktop theme and content 22
  • 23. Supporting modules pp g Mobile permissions Mobile permission configuration panel 23
  • 24. Supporting modules pp g Mobile permissions Automatic creation of a mobile user allows fine grained permission toggling 24
  • 25. Supporting modules pp g Mobile permissions With help of the node acces module: Page only available for mobile users 25
  • 26. Supporting modules pp g Theming system Duplicate your theme Copy dir of your theme and rename the dir and *.info file e.g. Garland -> mobile-garland, Garland/garland.info -> mobile garland/mobile garland.info mobile-garland/mobile-garland.info You have now two identical themes with a different name ☺ This manual “hack” is needed because there is no p possibility to hook in the theme detection process y p Configure your blocks and general theme settings 26
  • 27. Supporting modules pp g Theming system Define the usage of a mobile theme (by using your existing deskop theme) 27
  • 28. Supporting modules pp g Theming system 28
  • 29. Supporting modules pp g Theming system Configure th bl k f you mobile C fi the blocks for bil context 29
  • 30. Demo Device detection and user notifications Extension of the permission system Mobile user gets a mobile role Extension of the theming system gy Copy you theme as a mobile theme Integration with a content adaptation It ti ith t t d t ti engine 30
  • 31. Step 3: Content adaptation p p Takes care of the device complexity Device detection Different screen sizes Image resizing Video transcoding Mobile Navigation Table linearization / splitting p g Pagination (reduction of vertical scrolling) HTML / CSS compliancy Reducing download size Javascript (e.g. Running google analytics javascript serverside!) (e g xHTML and CSS cleanup ( =reducing download size) Siruna can add location based services and the Insertion of mobile advertisments http://mobiledrupal.com/content/make-your-drupal-blog-mobile 31
  • 32. Content adaptation engine p g Siruna Composer XML based rules Previewing Pre ie ing (http://open.siruna.org/documentation/sitemap-api) 32
  • 33. Siruna with drupal integration p g Transcoding (Siruna) (Sir na) Siruna – Drupal integration Drupal
  • 34. Siruna with drupal p integration In development! Easily create adaptation filters for menu pages / content types / individual nodes Reuse adaptations for the most p popular themes Previewing and testing 34
  • 35. Two resulting modules g Mobile Tools module Notification / redirection / permission system / theming / .... Public soon! Siruna integration module Configuration f C fi ti from drupal d l Generation snippets / adaptation repository Configurations adaptation filters (e g Filters (e.g. for specific content types, pages, menu items) 35
  • 36. resources Details and modules will be published soon on: http://www.mobiledrupal.com http://www mobiledrupal com Adaptation service: http://open.siruna.org http://composer.siruna.com http://composer siruna com http://groups.drupal.org/mobile pg p p g Tom.Deryckere@siruna.com 36
  • 37. Contact Mail : Tom.Deryckere@siruna.com Blog: http://www.mobiledrupal.com Siruna: http://www.siruna.com, http://open.siruna.com htt // i 37

Notes de l'éditeur

  1. <number>
  2. <number>
  3. <number>
  4. <number>
  5. <number>
  6. <number>
  7. <number>
  8. <number>
  9. <number>
  10. <number>
  11. <number>
  12. <number>
  13. <number>
  14. <number>
  15. <number>
  16. <number>
  17. <number>
  18. <number>
  19. <number>
  20. <number>
  21. <number>
  22. <number>
  23. <number>
  24. <number>
  25. <number>
  26. <number>
  27. <number>
  28. <number>
  29. <number>
  30. <number>
  31. <number>
  32. <number>
  33. <number>
  34. <number>
  35. <number>
  36. <number>
  37. <number>