App o mobile website?
                 Quale lo scenario vincente?
Branding 2.0
Urbino, 4 Aprile 2012
Claudio Tonti
websolute.it

                                               1
Chi è websolute ?


                    2
3
Cosa fa websolute ?
Digital Strategy                   Interaction Design                Web & Mobile
Disegnare una Digital              User Experience                   Engineering
Strategy                           Web Design                        Sviluppo Siti
Perpetual Beta                     Mobile                            Gestione Multi Sito
Consulenza                                                           Integrazione con ERP
                                                                     App Iphone & Ipad


             Project Management                 Piattaforme
             Gestione progetti                  BOM
             Accounting                         Newsletter Manager 4.0
             Customer Assistance                Web tv, Digital Signage
                                                C-Netic
                                                Digital Presenter
                                                Data Center


Digital Marketing                  Produzione                        Social Media
Search Engine Marketing            Contenuti                         Social Media Strategy
Web & Mobile ADV                                                     Social Media Marketing
                                   Realizzazione Webcast
Analytics                                                            Gestione Presenza Social
                                   Motion Graphics
Leads generation                                                     Creazione e Gestione
                                   Web Copywriting
A/B Testing                                                          Community
                                   Article Marketing
E-mail marketing
Web Monitoring


                                                                                                4
Per chi lavoriamo ?



2001   2002     2003   2004           2005           2006             2007   2008



                              ALPI GROUP     FDV            INDESIT




                                             HAIER




                                                       NOMINATION


2009          2010                                   2011



                                                                                5
1. Apps VS Web Apps




                      6
Web App

- Pagina web sviluppata ad hoc per essere meglio
  fruita da un dispositivo mobile, tablet o smartphone

- Utilizzo dei linguaggi di programmazione web
  (HTML, CSS, Javascript)

- Accessibile ovunque e da svariati dispositivi:
  computer desktop, laptop, smartphone, tablet

- Contenuti search-friendly



                                                         7
Il sito Lancia tra
Web e mobile.




                     8
App
- Sfrutta il linguaggio specifico del dispositivo

- Dialoga con i framework del device: GPS, fotocamera,
  accelerometro, lista contatti

- Notifiche push

- Avvio anche in modalità offline

- Velocità di caricamento dei dati

- Possibilità di pubblicazione nello store Apple o Android



                                                             9
NEWS
LIFESTYLE                                          NY Times
Groupon                                            per iPad.
per iPhone.




UTILITY
Whatsapp per smartphone. Multidevice.


                                        SOCIAL
                                        Facebook
                                        per
                                        Android.



                                                               10
2. Web VS Mobile
Cosa cambia nella USER EXPERIENCE ?




                                      11
Fattori quali le dimensioni dello schermo
e l utilizzo in mobilità obbligano il mobile
a ripensare le modalità di navigazione ed
interazione a cui ci ha abituati il Web.




                                               12
Come lo rendo su mobile?

                           13
Architettura dell informazione, struttura di
navigazione e modalità di interazione non
possono essere le stesse.


È una questione di gradi di libertà:
se nel Web ne ho 100, nei tablet diventano 30 e
negli smartphone si riducono a 5.




                                                  14
Il Web è customizzazione, il Mobile è standardizzazione.


Il mobile fissa nuovi paradigmi di User Interface che
privilegiano la semplificazione alla personalizzazione.

Se nel Web conta distinguersi, nel mondo di app e web
app occorre adeguarsi a dei modelli a cui gli utenti sono
ormai abituati: si aspettano strumenti intuitivi, semplici,
immediatamente comprensibili.
Lo standard diventa un valore, perché rende fruibile e
universalmente condivisa l esperienza di navigazione e
consultazione delle informazioni.



                                                              15
3. Proviamo a capirci di più




                               16
App




Multidevice                 Molte piattaforme
(tablet,                    (Apple, Android,
smartphone)                 Windows, BlackBerry,
                            Google, ecc...)


 Costi elevati di produzione e manutenzione



                                                   17
Tra passato
- Aggiornamenti




... e futuro
- Potenza dell esperienza utente
- Ripetizione di paradigmi già insiti nel device,
  performanti e ormai familiari soprattutto nel mondo
  Apple: switch, date picker, pdf viewer, ecc...




                                                        18
Web App




HTML5 supportato da             Web distribuito: non
ogni piattaforma                richiede il download di
(Apple, Android,                aggiornamenti
Windows, BlackBerry,
Google, ecc...)

  Tenta di eguagliare le app native in materia di
  esperienza utente grazie all evoluzione dell HTML5,
  ma non raggiunge la stessa efficienza in materia di UI

                                                           19
Per colmare il gap con le app, nascono
framework specifici che forniscono alle web
app elementi di UI standard e garantiscono
compatibilità multidevice e multipiattaforma.


La personalizzazione rimane appannaggio del
contenuto.




                                                20
Jquery Mobile




                21
Sencha




         22
4. La questione delle piattaforme




                                    23
a) Smartphone: iPhone VS Android




                                   24
b) Tablet: iPad VS Android VS Windows 8




                                          25
iPhone e iPod: 2 risoluzioni di schermo e due sistemi
operativi ‒ iOS4 e iOS5 (75% di penetrazione del mercato
per iOS5).

L ecosistema Android: centinaia di device, diverse versioni
di sistema operativo, varie risoluzioni di schermo.


Che cosa significa sviluppare per Android?




                                                          26
Temple Run da iOS ad Android



1 milione di download nel giro di 3 giorni, 1200 mail di
segnalazione di malfunzionamento su centinaia di device.




                                                           27
Audiobooks, app per Android



 I have a handful of Android
devices, but since the range
is so spread out trying to
cover a large array of devices
just isn t practical. And that is
only half the picture: the
other side is Android version,
where 50% of users are on
2.3.3 and then the rest are are
on things ranging from 1.6 to
4.0.3.
                                    David Smith, sviluppatore dell app


                                                                         28
It is a nightmare... The worst part for me is that ultimately it
means that I have a lot of grumpy users that I just can t
realistically help. It just doesn t make sense (economically)
to run down every bug that is specialized to a particular
device/OS combo .




                                   David Smith, sviluppatore dell app


                                                                        29
Fonte: Gartner


                 30
Fonte: Flurry Analytics


                          31
5. Come scegliere se App o Web App ?




                                       32
Quanto sono critici questi fattori?

                                                    Criticità
      Performance dell’interfaccia
      Rapidità di caricamento del percorso tipico
      Potenza di calcolo
      Frequenza d’uso
      Utilizzo di funzionalità native
      Persistenza dei dati
      Revenue
      Integrazione con altre applicazioni native
      Non necessita di diffusione capillare
      Funzionamento offline
      Quantità di contenuti non residenti online
      Restrizioni sul contenuto
      Tempo di rilascio aggiornamenti scadenzato




                                                                33
NIKE GPS




           34
Criticità
Performance dell’interfaccia                      ★
Rapidità di caricamento del percorso tipico       ★
Potenza di calcolo                              ★★★
Frequenza d’uso                                  ★★
Utilizzo di funzionalità native               ★★★★★
Persistenza dei dati                            ★★★
Revenue
Integrazione con altre applicazioni native
Non necessita di diffusione capillare            ★★
Funzionamento offline                         ★★★★★
Quantità di contenuti non residenti online       ★★
Restrizioni sul contenuto
Tempo di rilascio aggiornamenti scadenzato        ★
Totale indice                                 23/65 (35%)




                                                            35
INSTAGRAM




            36
Criticità
Performance dell’interfaccia                     ★★
Rapidità di caricamento del percorso tipico   ★★★★★
Potenza di calcolo                            ★★★★★
Frequenza d’uso                               ★★★★★
Utilizzo di funzionalità native                 ★★★
Persistenza dei dati                              ★
Revenue
Integrazione con altre applicazioni native
Non necessita di diffusione capillare           ★★★
Funzionamento offline                             ★
Quantità di contenuti non residenti online        ★
Restrizioni sul contenuto
Tempo di rilascio aggiornamenti scadenzato       ★★
Totale indice                                 28/65 (43%)




                                                            37
ANGRY BIRDS

 Quale delle due è la
 versione app?




                        38
Criticità
Performance dell’interfaccia                     ★★
Rapidità di caricamento del percorso tipico      ★★
Potenza di calcolo                               ★★
Frequenza d’uso                                  ★★
Utilizzo di funzionalità native
Persistenza dei dati
Revenue                                       ★★★★★
Integrazione con altre applicazioni native
Non necessita di diffusione capillare
Funzionamento offline                         ★★★★★
Quantità di contenuti non residenti online      ★★★
Restrizioni sul contenuto
Tempo di rilascio aggiornamenti scadenzato       ★★
Totale indice                                 23/65 (35%)




                                                            39
ZARA SHOP ONLINE




                   40
Criticità
Performance dell’interfaccia                     ★★
Rapidità di caricamento del percorso tipico      ★★
Potenza di calcolo                                ★
Frequenza d’uso                                  ★★
Utilizzo di funzionalità native
Persistenza dei dati                              ★
Revenue
Integrazione con altre applicazioni native
Non necessita di diffusione capillare             ★
Funzionamento offline                             ★
Quantità di contenuti residenti non online        ★
Restrizioni sul contenuto                         ★
Tempo di rilascio aggiornamenti scadenzato        ★
Totale indice                                 13/65 (20%)




                                                            41
FOURSQUARE




             42
Criticità
Performance dell’interfaccia                    ★★★
Rapidità di caricamento del percorso tipico   ★★★★★
Potenza di calcolo                                ★
Frequenza d’uso                               ★★★★★
Utilizzo di funzionalità native                 ★★★
Persistenza dei dati                              ★
Revenue
Integrazione con altre applicazioni native
Non necessita di diffusione capillare            ★★
Funzionamento offline                             ★
Quantità di contenuti non residenti online        ★
Restrizioni sul contenuto                         ★
Tempo di rilascio aggiornamenti scadenzato        ★
Totale indice                                 24/65 (36%)




                                                            43
TWITTER




          44
TWITTER




          45
TWITTER




          46
Criticità
Performance dell’interfaccia                    ★★★
Rapidità di caricamento del percorso tipico    ★★★★
Potenza di calcolo                                ★
Frequenza d’uso                               ★★★★★
Utilizzo di funzionalità native                  ★★
Persistenza dei dati                              ★
Revenue
Integrazione con altre applicazioni native
Non necessita di diffusione capillare             ★
Funzionamento offline
Quantità di contenuti non residenti online
Restrizioni sul contenuto
Tempo di rilascio aggiornamenti scadenzato        ★
Totale indice                                 18/65 (27%)




                                                            47
Come evolverà la questione nei prossimi anni
                  (mesi) ?




                                          48
49
Claudio Tonti                     www.websolute.it

ctonti@websolute.it               info@websolute.it

@ctonti                           Tel: 0721.411112
                                  Strada della Campanara, 15
it.linkedin.com/in/claudiotonti   61100 Pesaro

App vs Mobile website: quale lo scenario vincente?

  • 1.
    App o mobilewebsite? Quale lo scenario vincente? Branding 2.0 Urbino, 4 Aprile 2012 Claudio Tonti websolute.it 1
  • 2.
  • 3.
  • 4.
    Cosa fa websolute? Digital Strategy Interaction Design Web & Mobile Disegnare una Digital User Experience Engineering Strategy Web Design Sviluppo Siti Perpetual Beta Mobile Gestione Multi Sito Consulenza Integrazione con ERP App Iphone & Ipad Project Management Piattaforme Gestione progetti BOM Accounting Newsletter Manager 4.0 Customer Assistance Web tv, Digital Signage C-Netic Digital Presenter Data Center Digital Marketing Produzione Social Media Search Engine Marketing Contenuti Social Media Strategy Web & Mobile ADV Social Media Marketing Realizzazione Webcast Analytics Gestione Presenza Social Motion Graphics Leads generation Creazione e Gestione Web Copywriting A/B Testing Community Article Marketing E-mail marketing Web Monitoring 4
  • 5.
    Per chi lavoriamo? 2001 2002 2003 2004 2005 2006 2007 2008 ALPI GROUP FDV INDESIT HAIER NOMINATION 2009 2010 2011 5
  • 6.
    1. Apps VSWeb Apps 6
  • 7.
    Web App - Paginaweb sviluppata ad hoc per essere meglio fruita da un dispositivo mobile, tablet o smartphone - Utilizzo dei linguaggi di programmazione web (HTML, CSS, Javascript) - Accessibile ovunque e da svariati dispositivi: computer desktop, laptop, smartphone, tablet - Contenuti search-friendly 7
  • 8.
    Il sito Lanciatra Web e mobile. 8
  • 9.
    App - Sfrutta illinguaggio specifico del dispositivo - Dialoga con i framework del device: GPS, fotocamera, accelerometro, lista contatti - Notifiche push - Avvio anche in modalità offline - Velocità di caricamento dei dati - Possibilità di pubblicazione nello store Apple o Android 9
  • 10.
    NEWS LIFESTYLE NY Times Groupon per iPad. per iPhone. UTILITY Whatsapp per smartphone. Multidevice. SOCIAL Facebook per Android. 10
  • 11.
    2. Web VSMobile Cosa cambia nella USER EXPERIENCE ? 11
  • 12.
    Fattori quali ledimensioni dello schermo e l utilizzo in mobilità obbligano il mobile a ripensare le modalità di navigazione ed interazione a cui ci ha abituati il Web. 12
  • 13.
    Come lo rendosu mobile? 13
  • 14.
    Architettura dell informazione,struttura di navigazione e modalità di interazione non possono essere le stesse. È una questione di gradi di libertà: se nel Web ne ho 100, nei tablet diventano 30 e negli smartphone si riducono a 5. 14
  • 15.
    Il Web ècustomizzazione, il Mobile è standardizzazione. Il mobile fissa nuovi paradigmi di User Interface che privilegiano la semplificazione alla personalizzazione. Se nel Web conta distinguersi, nel mondo di app e web app occorre adeguarsi a dei modelli a cui gli utenti sono ormai abituati: si aspettano strumenti intuitivi, semplici, immediatamente comprensibili. Lo standard diventa un valore, perché rende fruibile e universalmente condivisa l esperienza di navigazione e consultazione delle informazioni. 15
  • 16.
    3. Proviamo acapirci di più 16
  • 17.
    App Multidevice Molte piattaforme (tablet, (Apple, Android, smartphone) Windows, BlackBerry, Google, ecc...) Costi elevati di produzione e manutenzione 17
  • 18.
    Tra passato - Aggiornamenti ...e futuro - Potenza dell esperienza utente - Ripetizione di paradigmi già insiti nel device, performanti e ormai familiari soprattutto nel mondo Apple: switch, date picker, pdf viewer, ecc... 18
  • 19.
    Web App HTML5 supportatoda Web distribuito: non ogni piattaforma richiede il download di (Apple, Android, aggiornamenti Windows, BlackBerry, Google, ecc...) Tenta di eguagliare le app native in materia di esperienza utente grazie all evoluzione dell HTML5, ma non raggiunge la stessa efficienza in materia di UI 19
  • 20.
    Per colmare ilgap con le app, nascono framework specifici che forniscono alle web app elementi di UI standard e garantiscono compatibilità multidevice e multipiattaforma. La personalizzazione rimane appannaggio del contenuto. 20
  • 21.
  • 22.
  • 23.
    4. La questionedelle piattaforme 23
  • 24.
    a) Smartphone: iPhoneVS Android 24
  • 25.
    b) Tablet: iPadVS Android VS Windows 8 25
  • 26.
    iPhone e iPod:2 risoluzioni di schermo e due sistemi operativi ‒ iOS4 e iOS5 (75% di penetrazione del mercato per iOS5). L ecosistema Android: centinaia di device, diverse versioni di sistema operativo, varie risoluzioni di schermo. Che cosa significa sviluppare per Android? 26
  • 27.
    Temple Run daiOS ad Android 1 milione di download nel giro di 3 giorni, 1200 mail di segnalazione di malfunzionamento su centinaia di device. 27
  • 28.
    Audiobooks, app perAndroid I have a handful of Android devices, but since the range is so spread out trying to cover a large array of devices just isn t practical. And that is only half the picture: the other side is Android version, where 50% of users are on 2.3.3 and then the rest are are on things ranging from 1.6 to 4.0.3. David Smith, sviluppatore dell app 28
  • 29.
    It is anightmare... The worst part for me is that ultimately it means that I have a lot of grumpy users that I just can t realistically help. It just doesn t make sense (economically) to run down every bug that is specialized to a particular device/OS combo . David Smith, sviluppatore dell app 29
  • 30.
  • 31.
  • 32.
    5. Come sceglierese App o Web App ? 32
  • 33.
    Quanto sono criticiquesti fattori? Criticità Performance dell’interfaccia Rapidità di caricamento del percorso tipico Potenza di calcolo Frequenza d’uso Utilizzo di funzionalità native Persistenza dei dati Revenue Integrazione con altre applicazioni native Non necessita di diffusione capillare Funzionamento offline Quantità di contenuti non residenti online Restrizioni sul contenuto Tempo di rilascio aggiornamenti scadenzato 33
  • 34.
  • 35.
    Criticità Performance dell’interfaccia ★ Rapidità di caricamento del percorso tipico ★ Potenza di calcolo ★★★ Frequenza d’uso ★★ Utilizzo di funzionalità native ★★★★★ Persistenza dei dati ★★★ Revenue Integrazione con altre applicazioni native Non necessita di diffusione capillare ★★ Funzionamento offline ★★★★★ Quantità di contenuti non residenti online ★★ Restrizioni sul contenuto Tempo di rilascio aggiornamenti scadenzato ★ Totale indice 23/65 (35%) 35
  • 36.
  • 37.
    Criticità Performance dell’interfaccia ★★ Rapidità di caricamento del percorso tipico ★★★★★ Potenza di calcolo ★★★★★ Frequenza d’uso ★★★★★ Utilizzo di funzionalità native ★★★ Persistenza dei dati ★ Revenue Integrazione con altre applicazioni native Non necessita di diffusione capillare ★★★ Funzionamento offline ★ Quantità di contenuti non residenti online ★ Restrizioni sul contenuto Tempo di rilascio aggiornamenti scadenzato ★★ Totale indice 28/65 (43%) 37
  • 38.
    ANGRY BIRDS Qualedelle due è la versione app? 38
  • 39.
    Criticità Performance dell’interfaccia ★★ Rapidità di caricamento del percorso tipico ★★ Potenza di calcolo ★★ Frequenza d’uso ★★ Utilizzo di funzionalità native Persistenza dei dati Revenue ★★★★★ Integrazione con altre applicazioni native Non necessita di diffusione capillare Funzionamento offline ★★★★★ Quantità di contenuti non residenti online ★★★ Restrizioni sul contenuto Tempo di rilascio aggiornamenti scadenzato ★★ Totale indice 23/65 (35%) 39
  • 40.
  • 41.
    Criticità Performance dell’interfaccia ★★ Rapidità di caricamento del percorso tipico ★★ Potenza di calcolo ★ Frequenza d’uso ★★ Utilizzo di funzionalità native Persistenza dei dati ★ Revenue Integrazione con altre applicazioni native Non necessita di diffusione capillare ★ Funzionamento offline ★ Quantità di contenuti residenti non online ★ Restrizioni sul contenuto ★ Tempo di rilascio aggiornamenti scadenzato ★ Totale indice 13/65 (20%) 41
  • 42.
  • 43.
    Criticità Performance dell’interfaccia ★★★ Rapidità di caricamento del percorso tipico ★★★★★ Potenza di calcolo ★ Frequenza d’uso ★★★★★ Utilizzo di funzionalità native ★★★ Persistenza dei dati ★ Revenue Integrazione con altre applicazioni native Non necessita di diffusione capillare ★★ Funzionamento offline ★ Quantità di contenuti non residenti online ★ Restrizioni sul contenuto ★ Tempo di rilascio aggiornamenti scadenzato ★ Totale indice 24/65 (36%) 43
  • 44.
  • 45.
  • 46.
  • 47.
    Criticità Performance dell’interfaccia ★★★ Rapidità di caricamento del percorso tipico ★★★★ Potenza di calcolo ★ Frequenza d’uso ★★★★★ Utilizzo di funzionalità native ★★ Persistenza dei dati ★ Revenue Integrazione con altre applicazioni native Non necessita di diffusione capillare ★ Funzionamento offline Quantità di contenuti non residenti online Restrizioni sul contenuto Tempo di rilascio aggiornamenti scadenzato ★ Totale indice 18/65 (27%) 47
  • 48.
    Come evolverà laquestione nei prossimi anni (mesi) ? 48
  • 49.
  • 50.
    Claudio Tonti www.websolute.it ctonti@websolute.it info@websolute.it @ctonti Tel: 0721.411112 Strada della Campanara, 15 it.linkedin.com/in/claudiotonti 61100 Pesaro