Drupal Day 2012 - Applicazioni mobile multipiattaforma integrate con Drupal 7 Nuove possibil…

639 views

Published on

Guarda il talk su http://www.youtube.com/watch?v=chnckmtMAJ0
E dai un giudizio su https://joind.in/talk/view/7706

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
639
On SlideShare
0
From Embeds
0
Number of Embeds
16
Actions
Shares
0
Downloads
13
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Drupal Day 2012 - Applicazioni mobile multipiattaforma integrate con Drupal 7 Nuove possibil…

  1. 1. Applicazioni mobile multipiattaforma integrate con Drupal 7 Nuove possibilità di marketing con PhoneGap Gianfranco Fedele Web software analyst presso Insem spa @gianfrasoft gianfrasoft@gmail.com
  2. 2. Cosè PhoneGap (per gli amici Cordova)• Adobe: PhoneGap is a free and open source framework that allows you to create mobile apps using standardized web APIs for the platforms you care about.• Apache: Cordova is a platform for building native mobile applications using HTML, CSS and JavaScript• Ajaxian: a great solution for Web developers to create applications with the technology they know and love, without having to jump off of the cliff to other proprietary worlds
  3. 3. Perché PhoneGap?• E semplice• E multipiattaforma• Il know-how richiesto per lavorare con PG è già presente nella figura professionale dello sviluppatore Drupal• Si integra facilmente con Drupal
  4. 4. In quale contesto conviene utilizzare PhoneGap? Possiamo identificare 2 contesti principali nellambito dei quali le app mobile vengono concepite:
  5. 5. In quale contesto conviene utilizzare PhoneGap? 1. La app può essere sviluppata per produrre un guadagno diretto mediante attraverso la sua distribuzione • Vendita • Banner pubblicitari • In-App Purchase
  6. 6. In quale contesto conviene utilizzare PhoneGap? 2. La app viene sviluppata nel contesto di un piano di marketing ovvero per distribuire informazioni commerciali (Brand app): • cataloghi di prodotti • volantini pubblicitari • informazioni posizionali • e-commerce • form di contatto
  7. 7. Perché le aziende vogliono una brand app?
  8. 8. Perché le aziende vogliono una brand app?Ma in particolare, perché noi sviluppatorinon vogliamo dargliela?
  9. 9. Perché le aziende vogliono una brand app?Le app rappresentano un nuovo canale peraccedere ai servizi web.
  10. 10. Tempo dedicato allutilizzo delleapp rispetto alla navigazione daparte degli utenti di smartphone
  11. 11. Perché le app sono preferite alla navigazione classica?• Superano i limiti del Web, intimamente legato allidea di una navigazione caratterizzata da uno scrolling verticale delle pagine• Offrono un approccio alla navigazione delle informazioni più gustoso (transizioni tra le viste, animazioni, ecc.)• Salvaguardano parte della user experience, operando anche in assenza di connettività
  12. 12. Quali competenze servono per intraprendere lo sviluppo delle app mobile?• iOS: XCode – Cocoa – Objective-C• Android Java – Android SDK• Windows Mobile C# – Silverlight – Visual Studio 2010 ...
  13. 13. Contenuto della distribuzione di Cordova-2.1.0• Un archivio per ogni SO: iOS, Android, WP7, ecc.• Ogni archivio contiene un template per lo sviluppo di applicazioni per ciascun ambiente di sviluppo.
  14. 14. Contenuto della distribuzione di Cordova-2.1.0• Ogni nuovo progetto PhoneGap contiene una sottocartella www che a sua volta contiene un file index.html• Una app realizzata con PhoneGap crea una vista full screen contenente una WebView allinterno della quale viene caricato il file index.html
  15. 15. Competenze necessarie per lo sviluppo con PhoneGap • Javascript • HTML 5 • CSS 3 • SQLight
  16. 16. Competenze necessarie per lo sviluppo con PhoneGap • Javascript • HTML 5 • CSS 3 • SQLight Lintegrazione con Drupal è già iniziata!
  17. 17. Quale architetturaDrupal-PhoneGap?
  18. 18. Quale architetturaDrupal-PhoneGap?
  19. 19. Quale integrazione tra PhoneGap e DrupalSono possibili due approcci• Caricamento diretto dei contenuti• Interfacciamento coi servizi
  20. 20. Caricamento diretto dei contenutiJavascript è in grado di sfruttare la tecnologiaAjax per operare modifiche del DOM dellapagina e quindi di caricare al volo leinformazioni da presentare allutente.
  21. 21. Caricamento diretto dei contenutiLa app interroga il portale a specifiche URLdalle quali riceve codice HTML da caricaredirettamente nel DOM.• Tema ad hoc con html.tpl.php “alleggerito”• Views Datasource• Imagecache• Browscup
  22. 22. Interrogazione del portalefunction ricerca_nodi_per_titolo(titolo){ $.ajax({ url: site_url + "view-nodi?title=" + titolo, type: get, error: function (XMLHttpRequest, textStatus, errorThrown) { navigator.notification.alert(Si è verificato unproblema durante la ricerca delle agenzie., null, "La miaapplicazione", "Ok"); }, success: function(data) { $.each(data.nodes, function(node_index, node_value) { ... }); } });};
  23. 23. Interfacciamento coi serviziAccesso alle informazioni in formato discambio JSON o XML e trasformazionenegli oggetti che popoleranno il DOM• Services• Services Views
  24. 24. Interrogazione dei servizifunction connect(){ $.ajax({ url: services_url + "system/connect.json", type: post, dataType: json, error: function (XMLHttpRequest, textStatus,errorThrown) { navigator.notification.alert(Errore diconnessione, null, "La mia applicazione", "Ok"); }, success: function (data) { ... } });};
  25. 25. Interrogazione dei servizifunction login(){ $(#box-waiting).css(display, block); $.ajax({ url: services_url + "user/login.json", type: post, data: username= + encodeURIComponent(name) + &password=+ encodeURIComponent(pass), dataType: json, error: function(XMLHttpRequest, textStatus, errorThrown) { navigator.notification.alert(Si è verificato unproblema durante il login., null, "La mia applicazione", "Ok"); }, success: function (data) { navigator.notification.alert(Bentornato!, null, "Lamia applicazione", "Ok"); });};
  26. 26. Interrogazione dei servizifunction logout(){ $.ajax({ url: services_url + "user/logout.json", type: post, dataType: json, error: function(XMLHttpRequest, textStatus,errorThrown) { navigator.notification.alert(Errore durante illogout, null, "La mia applicazione", "Ok"); }, success: function (data) { navigator.notification.alert("Arrivederci.", null,"La mia applicazione", "Ok"); } });};
  27. 27. Alcuni vantaggi offerti da Drupal e PhoneGap
  28. 28. Alcuni vantaggi offerti da Drupal e PhoneGap• Javascript è nativamente asincrono• Di default i session cookie sono gestiti automaticamente dal WebView• Nella app le immagini possono linkare url disponibili sul portale Drupal• Il layout della app può essere fluido o addirittura adattivo
  29. 29. Alcuni svantaggi• Le animazioni di transizione tra una vista e laltra vanno simulate con Javascript o CSS3• Le librerie che solitamente si usano nei portali possono appesantire le app e rallentarle su dispositivi di vecchia generazione• Le librerie di cui sopra spesso sono concepite per il web ed adattate al mobile. Meglio fare attenzione• Ogni ambiente di sviluppo va opportunamente configurato per PhoneGap
  30. 30. Q&AGianfranco Fedelegianfrasoft@gmail.com
  31. 31. DICE GRAZIE A SPONSOR MEDIA PARTNER IN COLLABORAZIONE CONFIRMATO: GLI ORGANIZZATORI ;)

×