Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Diego La Monica
@jast
#appmobile
#appmobileDiego La Monica
diego.lamonica@gmail.com
Applicazioni mobili:
strumenti, costi,...
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
#>Hello World!
Diego La Mo...
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
3
http://store.streetlib.c...
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
International Web Associat...
Diego La Monica
@jast
#appmobile
Conosci il nemico come conosci te
stesso. Se farai così, anche in
mezzo a cento battaglie...
Diego La Monica
@jast
#appmobile
Perché
si usa il
device?
6
Diego La Monica
@jast
#appmobile
Se non conosci te stesso, né conosci il
tuo nemico, sii certo che ogni
battaglia sarà per...
Diego La Monica
@jast
#appmobile
8
Diego La Monica
@jast
#appmobile
Diamo i numeri!
Periodo Android iOS Windows Phone BlackBerry Altri
2016Q2 86.2% 12.9% 0.6...
Diego La Monica
@jast
#appmobile
popolazione mondiale 7.000.000.000circa
dispositivi mobili 6.880.000.000 nel mondo
dispos...
Diego La Monica
@jast
#appmobile
11
86% = ~ 6 Miliardi
13% = ~ 700 Milioni
0.6% = ~ 38 Milioni
Diego La Monica
@jast
#appmobile
12
Diego La Monica
@jast
#appmobile
13
Diego La Monica
@jast
#appmobile
14
Diego La Monica
@jast
#appmobile
E adesso?
Cosa faccio?
Per quali versioni?
Per quali piattaforme?
Ma funzionerà ovunque?
Diego La Monica
@jast
#appmobile
Il tuo scopo primario deve essere quello di
riuscire a prendere Tutto-Sotto-Il-Cielo: cos...
Diego La Monica
@jast
#appmobile
Web app
[…] una web app è sostanzialmente un
collegamento verso un applicativo remoto, sc...
Diego La Monica
@jast
#appmobile
App nativa
[…] Strumento informatico che si installa e si
utilizza interamente sul propri...
Diego La Monica
@jast
#appmobile
App nativa per iOS 19
+ =
Mantenimento app sullo store:
€ 99 / anno
Diego La Monica
@jast
#appmobile
App nativa per Android 20
+ =
Mantenimento app sullo store:
€ 25
Diego La Monica
@jast
#appmobile
App nativa per Windows Phone 21
Mantenimento app sullo store:
€ 75 / anno
Diego La Monica
@jast
#appmobile
Per quale
piattaforma
produco la
mia app?
Diego La Monica
@jast
#appmobile
Ma quanto
mi costerà?
Per quale
piattaforma
produco la
mia app?
Diego La Monica
@jast
#appmobile
La vita è veramente molto
semplice; ma noi insistiamo
nel renderla complicata.
Confucio
Diego La Monica
@jast
#appmobile
App ibrida
App nativa + Web app
25
✓ Pubblicabile sugli store
✓ Compilata
✓ Accesso all’h...
Diego La Monica
@jast
#appmobile
26
Diego La Monica
@jast
#appmobile
Le App sviluppate con
Apache Cordova sono scritte
in HTML, CSS e Javascript e
sono in gra...
Diego La Monica
@jast
#appmobile
28
✓ Google Android
✓ Apple iOS
✓ Windows Phone
✓ Blackberry
✓ Amazon Tizen
✓ Firefox OS
Diego La Monica
@jast
#appmobile
Requisiti 29
Diego La Monica
@jast
#appmobile
Alternativa 30
Diego La Monica
@jast
#appmobile
Con cosa si sviluppa un App?
✓ Intel XDK ( IDE )
✓ Cordova CLI (CLI)
sviluppo multi-piatt...
Diego La Monica
@jast
#appmobile
Stesso codice per tutte le piattaforme 32
=
Diego La Monica
@jast
#appmobile
Svilupperò l’app identica
per tutte le piattaforme!
L’utente vivrà la stessa
esperienza a...
Diego La Monica
@jast
#appmobile
Adesso la vuoi
fare troppo
facile…
amico di Confucio
Diego La Monica
@jast
#appmobile
UI 35
1 2
Qual è la risposta giusta?
a) 1 = Android
2 = iPhone
b) 1 = iPhone
2 = Android
...
Diego La Monica
@jast
#appmobile
UI 36
iPhone Android
Qual è la risposta giusta?
× 1 = Android
2 = iPhone
✓ 1 = iPhone
2 =...
Diego La Monica
@jast
#appmobile
UI 37
1 2
Qual è la risposta giusta?
a) 1 = Android
2 = iPhone
b) 1 = iPhone
2 = Android
...
Diego La Monica
@jast
#appmobile
Android iPhone
38
UIQual è la risposta giusta?
✓ 1 = Android
2 = iPhone
× 1 = iPhone
2 = ...
Diego La Monica
@jast
#appmobile
Ogni sistema è associato a specifiche
caratteristiche hardware che l’utente è
abituato ad...
Diego La Monica
@jast
#appmobile
40
…
<body class="android">
…
</body>
</html>
…
<body class="ios">
…
</body>
</html>
…
<b...
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
41
41Cosa cambia?
Se si ha...
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
42
42Codice diverso per di...
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
43
43Codice diverso per di...
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
Cosa posso fare con Apache...
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
Ma si può fare davvero?
✓ ...
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
Ma si può fare davvero?
✓ ...
Diego La Monica
@jast
#appmobile
Quali sono i limiti?
C'è luogo tra la fantasia e la realtà,
un luogo dove non ci sono lim...
Diego La Monica
@jast
#appmobile
Ma non ci sono
problemi di
performance?
Diego La Monica
@jast
#appmobile
Ottimizzazione
✓ Core
✓ DOM
✓ Rete
✓ Hardware
✓ Funzionale
49
Diego La Monica
@jast
#appmobile
Ottimizzazione del Core
✓ Permessi
✓ Campi di input
✓ Framework
✓ Multithread
50
Diego La Monica
@jast
#appmobile
Ottimizzazione accesso al DOM
✓ DOM Reflow
✓ Semplificazione
✓ Virtualizzazione
✓ Interro...
Diego La Monica
@jast
#appmobile
Ottimizzazione delle funzioni di rete
✓ Online/Offline
✓ Errori di comunicazione
✓ Carica...
Diego La Monica
@jast
#appmobile
Ottimizzazione hardware
✓ Accelerazione Hardware
✓ Device Events
✓ Elaborazione immagini
...
Diego La Monica
@jast
#appmobile
Ottimizzazione funzionale
✓ Statistiche d'uso
✓ Monitoraggio dei
feedback
✓ Analisi dei d...
Diego La Monica
@jast
#appmobile
Parla poco, odi assai et
guarda al fine di ciò che fai
San Benedetto
Question Time
Diego La Monica
@jast
#appmobile
Applicazioni mobili: strumenti, costi,
soluzioni e performance
Diego La Monica
Web Soluti...
Upcoming SlideShare
Loading in …5
×

Applicazioni mobili: strumenti, costi soluzioni e peformance

295 views

Published on

Le applicazioni mobili sono osservati speciali. Ma come decidere se sviluppare un'App Nativa o un'App Ibrida e quali sono i costi da sostenere? Questo ed altro è stato discusso a SMAU Milano 2016.

Published in: Technology

Applicazioni mobili: strumenti, costi soluzioni e peformance

  1. 1. Diego La Monica @jast #appmobile #appmobileDiego La Monica diego.lamonica@gmail.com Applicazioni mobili: strumenti, costi, soluzioni e performance
  2. 2. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance #>Hello World! Diego La Monica Web Solution Developer mail: diego.lamonica@gmail.com web: http://diegolamonica.info twitter: @jast skype: diego.la.monica mobile: +39 333 7235 382 ● Professionista Web di cui alla legge n. 4/2013 ● Full stack developer ● Associato IWA/HWG dal 2006 ● Autore di EUCookieLaw (+2500 siti) ● Autore XTemplate (JSClasses Award) ● Contribuisce ad altri progetti Open Source ● Sviluppo app mobili e web app 2
  3. 3. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance 3 http://store.streetlib.com/sviluppare-applicazioni-ibride-per-dispositivi-mobili ISBN: 9788892513044 Diego La Monica Web Solution Developer mail: diego.lamonica@gmail.com web: http://diegolamonica.info twitter: @jast skype: diego.la.monica mobile: +39 333 7235 382
  4. 4. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance International Web Association ● Dal 1996 (in Italia dal 2000) è il riferimento di chi lavora nel Web, sia nel settore pubblico che privato. ● Associazione professionisti Web (Legge 4/2013), promotrice norme UNI in materia di professionalità ICT. ● Obiettivo di IWA è creare rete tra i soci, partecipare all'evoluzione della rete e divulgare conoscenza tramite i soci con eventi e iniziative. 4 partecipazioni internazionali principali partecipazioni nazionali http://www.iwa.it
  5. 5. Diego La Monica @jast #appmobile Conosci il nemico come conosci te stesso. Se farai così, anche in mezzo a cento battaglie non ti troverai mai in pericolo Sun Tzu - L’arte della guerra - Cap. 3 p. 31
  6. 6. Diego La Monica @jast #appmobile Perché si usa il device? 6
  7. 7. Diego La Monica @jast #appmobile Se non conosci te stesso, né conosci il tuo nemico, sii certo che ogni battaglia sarà per te fonte di pericolo gravissimo. Sun Tzu - L’arte della guerra - Cap. 3 p. 33
  8. 8. Diego La Monica @jast #appmobile 8
  9. 9. Diego La Monica @jast #appmobile Diamo i numeri! Periodo Android iOS Windows Phone BlackBerry Altri 2016Q2 86.2% 12.9% 0.6% 0.1% 0.4% 2015Q2 82.2% 14.6% 2.5% 0.3% 0.4% 2014Q2 84.8% 11.6% 2.5% 0.5% 0.7% 2013Q2 79.8% 12.9% 3.4% 2.8% 1.2% 2012Q2 69.3% 16.6% 3.1% 4.9% 6.1% 9
  10. 10. Diego La Monica @jast #appmobile popolazione mondiale 7.000.000.000circa dispositivi mobili 6.880.000.000 nel mondo dispositivi mobili 88.580.000in Italia https://en.wikipedia.org/wiki/List_of_countries_by_number_of_mobile_phones_in_use 10 10#diamoinumeri
  11. 11. Diego La Monica @jast #appmobile 11 86% = ~ 6 Miliardi 13% = ~ 700 Milioni 0.6% = ~ 38 Milioni
  12. 12. Diego La Monica @jast #appmobile 12
  13. 13. Diego La Monica @jast #appmobile 13
  14. 14. Diego La Monica @jast #appmobile 14
  15. 15. Diego La Monica @jast #appmobile E adesso? Cosa faccio? Per quali versioni? Per quali piattaforme? Ma funzionerà ovunque?
  16. 16. Diego La Monica @jast #appmobile Il tuo scopo primario deve essere quello di riuscire a prendere Tutto-Sotto-Il-Cielo: così, non dovrai mantenere le truppe di occupazione e i tuoi profitti saranno assoluti. Questa è la regola per la strategia dell’assedio. Sun Tzu - L’arte della guerra - Cap. 3 p. 11
  17. 17. Diego La Monica @jast #appmobile Web app […] una web app è sostanzialmente un collegamento verso un applicativo remoto, scritto in un linguaggio cross-platform come HTML5, con il codice dell'interfaccia utente che può risiedere sul dispositivo mobile o anch'essa in remoto. https://it.wikipedia.org/wiki/Applicazione_mobile#Web_app 17
  18. 18. Diego La Monica @jast #appmobile App nativa […] Strumento informatico che si installa e si utilizza interamente sul proprio dispositivo mobile, vale a dire un insieme di istruzioni informatiche progettate con lo scopo di rendere possibile un servizio o una serie di servizi o strumenti ritenuti utili o desiderabili dall’utente, creata appositamente per uno specifico sistema operativo. https://it.wikipedia.org/wiki/Applicazione_mobile#App_nativa 18
  19. 19. Diego La Monica @jast #appmobile App nativa per iOS 19 + = Mantenimento app sullo store: € 99 / anno
  20. 20. Diego La Monica @jast #appmobile App nativa per Android 20 + = Mantenimento app sullo store: € 25
  21. 21. Diego La Monica @jast #appmobile App nativa per Windows Phone 21 Mantenimento app sullo store: € 75 / anno
  22. 22. Diego La Monica @jast #appmobile Per quale piattaforma produco la mia app?
  23. 23. Diego La Monica @jast #appmobile Ma quanto mi costerà? Per quale piattaforma produco la mia app?
  24. 24. Diego La Monica @jast #appmobile La vita è veramente molto semplice; ma noi insistiamo nel renderla complicata. Confucio
  25. 25. Diego La Monica @jast #appmobile App ibrida App nativa + Web app 25 ✓ Pubblicabile sugli store ✓ Compilata ✓ Accesso all’hardware ✓ HTML ✓ CSS ✓ Javascript
  26. 26. Diego La Monica @jast #appmobile 26
  27. 27. Diego La Monica @jast #appmobile Le App sviluppate con Apache Cordova sono scritte in HTML, CSS e Javascript e sono in grado di accedere anche alle funzionalità native del device. 27
  28. 28. Diego La Monica @jast #appmobile 28 ✓ Google Android ✓ Apple iOS ✓ Windows Phone ✓ Blackberry ✓ Amazon Tizen ✓ Firefox OS
  29. 29. Diego La Monica @jast #appmobile Requisiti 29
  30. 30. Diego La Monica @jast #appmobile Alternativa 30
  31. 31. Diego La Monica @jast #appmobile Con cosa si sviluppa un App? ✓ Intel XDK ( IDE ) ✓ Cordova CLI (CLI) sviluppo multi-piattaforma con Apache Cordova 31
  32. 32. Diego La Monica @jast #appmobile Stesso codice per tutte le piattaforme 32 =
  33. 33. Diego La Monica @jast #appmobile Svilupperò l’app identica per tutte le piattaforme! L’utente vivrà la stessa esperienza a prescindere dal device Sebastian Seidil - Bronzo - Giochi Europei 2015
  34. 34. Diego La Monica @jast #appmobile Adesso la vuoi fare troppo facile… amico di Confucio
  35. 35. Diego La Monica @jast #appmobile UI 35 1 2 Qual è la risposta giusta? a) 1 = Android 2 = iPhone b) 1 = iPhone 2 = Android c) Entrambe Android d) Entrambe iPhone
  36. 36. Diego La Monica @jast #appmobile UI 36 iPhone Android Qual è la risposta giusta? × 1 = Android 2 = iPhone ✓ 1 = iPhone 2 = Android × Entrambe Android × Entrambe iPhone
  37. 37. Diego La Monica @jast #appmobile UI 37 1 2 Qual è la risposta giusta? a) 1 = Android 2 = iPhone b) 1 = iPhone 2 = Android c) Entrambe Android d) Entrambe iPhone
  38. 38. Diego La Monica @jast #appmobile Android iPhone 38 UIQual è la risposta giusta? ✓ 1 = Android 2 = iPhone × 1 = iPhone 2 = Android × Entrambe Android × Entrambe iPhone
  39. 39. Diego La Monica @jast #appmobile Ogni sistema è associato a specifiche caratteristiche hardware che l’utente è abituato ad utilizzare. L’utente non si deve adattare all’app
  40. 40. Diego La Monica @jast #appmobile 40 … <body class="android"> … </body> </html> … <body class="ios"> … </body> </html> … <body class="windows"> … </body> </html> body.ios a.back-button{ display: none; } body.windows{ background-image: url(images/windows.png); } body.android{ background-image: url(images/android.png); } body.ios{ background-image: url(images/apple.png); }
  41. 41. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance 41 41Cosa cambia? Se si hanno elementi specifici per un device si visualizzano solo quando serve. body:not(.ios) .ios-only, body:not(.android) .android-only, body:not(.windows) .windows-only{ display: none; } ...
  42. 42. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance 42 42Codice diverso per dispositivo? Per comportamenti differenti, bisogna trovare il minimo comune multiplo. function base64toFile( buffer, file){ /* * alcuni device forniscono il base64 * con il data-uri * data:image/gif;base64,<contenuto> */ buffer = buffer.replace(/^[^,]*,/,''); … }
  43. 43. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance 43 43Codice diverso per dispositivo? Per comportamenti differenti, bisogna trovare il minimo comune multiplo. /* * In dipendenza del sistema alcuni * percorsi possono non esistere. */ var destinationPath = cordova.file.externalRootDirectory || cordova.file.tempDirectory || cordova.file.cacheDirectory;
  44. 44. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance Cosa posso fare con Apache Cordova? ✓ Autenticazione sociale ✓ Notifiche push ✓ Geolocalizzazione ✓ Stato della rete ✓ Storage ✓ Integrazione mappe ✓ Internazionalizzazione ✓ Streaming ✓ Advertising ✓ Accesso ai contatti ✓ Acquisti in-app ✓ Accesso alla fotocamera ✓ Media ✓ Google Play Games Service ✓ … 44
  45. 45. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance Ma si può fare davvero? ✓ Geolocalizzazione ✓ Stato della rete ✓ Storage ✓ Integrazione mappe di Google ✓ Accesso alla fotocamera 45
  46. 46. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance Ma si può fare davvero? ✓ Autenticazione sociale ✓ Geolocalizzazione ✓ Accesso alla fotocamera ✓ Media ✓ Stato della rete ✓ Storage ✓ Streaming 46
  47. 47. Diego La Monica @jast #appmobile Quali sono i limiti? C'è luogo tra la fantasia e la realtà, un luogo dove non ci sono limiti, né assoluti né relativi. E.L. James
  48. 48. Diego La Monica @jast #appmobile Ma non ci sono problemi di performance?
  49. 49. Diego La Monica @jast #appmobile Ottimizzazione ✓ Core ✓ DOM ✓ Rete ✓ Hardware ✓ Funzionale 49
  50. 50. Diego La Monica @jast #appmobile Ottimizzazione del Core ✓ Permessi ✓ Campi di input ✓ Framework ✓ Multithread 50
  51. 51. Diego La Monica @jast #appmobile Ottimizzazione accesso al DOM ✓ DOM Reflow ✓ Semplificazione ✓ Virtualizzazione ✓ Interrogazione 51
  52. 52. Diego La Monica @jast #appmobile Ottimizzazione delle funzioni di rete ✓ Online/Offline ✓ Errori di comunicazione ✓ Caricamento contenuti ✓ Notificare l'elaborazione 52
  53. 53. Diego La Monica @jast #appmobile Ottimizzazione hardware ✓ Accelerazione Hardware ✓ Device Events ✓ Elaborazione immagini ✓ Trasformazioni CSS 53
  54. 54. Diego La Monica @jast #appmobile Ottimizzazione funzionale ✓ Statistiche d'uso ✓ Monitoraggio dei feedback ✓ Analisi dei dati 54
  55. 55. Diego La Monica @jast #appmobile Parla poco, odi assai et guarda al fine di ciò che fai San Benedetto Question Time
  56. 56. Diego La Monica @jast #appmobile Applicazioni mobili: strumenti, costi, soluzioni e performance Diego La Monica Web Solution Developer mail: diego.lamonica@gmail.com web: http://diegolamonica.info twitter: @jast skype: diego.la.monica mobile: +39 333 7235 382 56 http://store.streetlib.com/sviluppare-applicazioni-ibride-per-dispositivi-mobili ISBN: 9788892513044

×