Slide del corso di Inside dedicato allo sviluppo di applicazioni, lato "non sviluppatori". Conoscere la tecnologia è la base per potersi interfacciare al meglio con lo staff dello sviluppo e con i clienti.

1. PARLIAMO DI SVILUPPO DI APPLICAZIONI DOCENTE
Un approccio “profano” per non sviluppatori: decisori, Andrea Trento
responsabili marketing, account.

2. Andrea Trento @andreatrento
§ CEO e Lead Developer in Freakpod™
§ Specializzato nello sviluppo di contenuti digitali"
cross-platform dal 2000
§ Competenze: C++, Objective-C, Flash Platform, Action
Script 3.0, HTML5, e altro
§ Adobe Community Professional Mobile & Devices e
Adobe User Group Manager
§ Speaker, consultant e teacher
§ Bla… Bla... Bla…

3. Obiettivi
§ Gettare le basi per comprendere il mobile
development
§ Conoscere piattaforme, tecnologie, mercati ed
opportunità
§ Capire come progettare e sviluppare nel tempo
mobile content
§ Andare nella giusta direzione

4. Mobile vision

5. Mobile vision

6. Mobile vision

7. Mobile vision
Oggi

8. Mobile vision
Think
First

9. Mobile vision
Don’t think
mobile only
Pensate a tutte
le misure

10. Cross-Content
“By definition, a cross contents is one that can be used
in multiple location, platform and while moving…”
"
“Per definizione, un contenuto cross può essere usato in
luoghi e piattaforme differenti e in movimento…”

11. Cross-Content

12. Cross-Content

13. Cross-Content

14. Cross-Content

15. Cross-Content

16. Cross-Content
+ $

17. Cross-Content
Ad oggi più di 30 App Store

18. Cross-Content

19. Cross-Content
Device alternativi

20. Cross-Content
Device alternativi

21. Cross-Content
IDEA
NO
CROSS

22. Cross-Content
IDEA
CROSS

23. Cross-Content
Come procedere?
§ $$$$
§ Tempi di sviluppo, testing e deployment lunghi
§ Tante piattaforme
§ Tante tecnologie*
*NON è un vero sviluppo cross-mobile se…

24. Cross-Content
WORA à Write Once Run Anywhere
§ Progettare in maniera corretta ed efficace
§ Sviluppare con le giuste tecnologie
§ Sviluppare con tools efficaci

25. Cross-Content
Per iniziare:
§ Valutare target
§ Valutare progetto
§ Valutare piattaforme
§ Valutare obiettivi
§ Valutare funzionalità
§ Valutare tecnologie
E analizzare…

26. Analisi e progettazione
Ricordarsi sempre…
§ Similitudini e differenze design mobile
§ Principi fondamentali per un mobile UX ottimale
§ Principi fondamentali di mobile design

27. Analisi e progettazione
Similitudini…
§ Rapida evoluzione
§ Alcuni limiti tecnici che influenzano la UX
§ Alcuni tool e processi di sviluppo

28. Analisi e progettazione
Differenze…
Un Mobile device non è un Computer
"
Computer:
§ Ambiente di utilizzo differente
§ Multi-tasking
§ Input methods (Mouse + Tastiera)
§ Ampio display
§ Elaborazione dati

29. Analisi e progettazione
Una buona Mobile experience…
§ E’ unicamente mobile
§ E’ coerente e in sintonia al contesto e ai contenuti
§ Soddisfa le funzioni
§ E’ adeguata in termini di performace

30. Analisi e progettazione
E’ unicamente Mobile…
§ Mobile è una piattaforma specifica – concentrarsi sui
contenuti
§ Focalizzarsi sulle necessità in relazione alle soluzioni
disponibili
§ Non focalizzatevi sulla tecnologia (Pimp my ride) – I
device cambiano rapidamente

31. Analisi e progettazione
E’ coerente e in sintonia…
§ Design che susciti un’attenzione parziale ma
adeguata
§ Design cognitivo, di facile interpretazione
§ Design più semplice possibile
§ Design adeguato alle interazioni

32. Analisi e progettazione
Soddisfa le sue funzioni…
§ Mobile UI efficaci ed esplicative
§ Abbandono del concetto di pagina
§ Un “Ok” o “Si” reale

33. Analisi e progettazione
Vecchio Wireframe

34. Analisi e progettazione

35. Analisi e progettazione
Mobile Wireframe

36. Analisi e progettazione
Tasks efficaci
Possibilità
diretti per compiere
differenti, che
operazioni
aumentano
l’interazione

39. Analisi e progettazione
Necessità
Prototipi

40. Analisi e progettazione

41. Andrea Trento – 15 maggio 2009 – MODULO 1

42. Analisi e progettazione
"
Creare
Valutare
SI o NO

44. Analisi e progettazione

45. Andrea Trento

46. Analisi e progettazione
Ma cosa cambia?
§ Per prima cosa NON"
è un semplice lettore e-book e/o"
tablet o un semplice mobile phone
§ E’ anche un social device
§ Si possono avere"
interazioni multi(ple)touch
§ Vi sono potenzialità per innovare"
sviluppando in modo differente

47. Andrea Trento

48. Analisi e progettazione
§ Device mobile
§ Device sharing oriented
§ Interazioni multi-user à Più utenti
§ Multiple touches à Un device per due o più mani
§ Concezione HW e SW diversi

49. Analisi e progettazione
§ Resolution gap
§ Typography corretta per una lettura e un render
ottimale
§ Accurata progettazione e prototipizzazione
§ UI e UX à HD à 3D àOrintamento
§ Interazioni design
§ Minimizzare gli input
§ Ridurre le physical actions

51. Sviluppo
Terminata la progettazione… Dobbiamo sviluppare per i
vari dispositivi…
A livello tecnico le soluzioni sono:
§ Nativo à C++, Java, Objective-C
§ HTML5, Css, JavaScript, JQuery mobile
+ PhoneGap
+ Frameworks
§ Adobe AIR

52. Sviluppo
Dev oriented à Pro e contro:
§ Codice complesso da scrivere
§ Testing su emulatore o device via SDK
§ Tecnologia completa
§ Migliori performance
§ Non funziona ovunque
§ Tempi di sviluppo lunghi

53. Sviluppo
Design oriented à Pro e contro:
§ Codice facile da scrivere
§ Facile da testare
§ Tecnologia stabile
§ 80% dei mobile device hanno un Web browser
§ HTML5, css, JavaScript funzionano ovunque

54. Sviluppo
A livello di sviluppo identifichiamo quindi:
§ Nativi
§ Ibridi
E… NON SONO LA STESSA COSA

55. Sviluppo ibrido

56. Sviluppo ibrido

57. Sviluppo ibrido

58. Sviluppo ibrido

59. Sviluppo ibrido
§ Hybrid
§ Bridge script per sopperire a limiti core script
§ Phonegap.js
§ Core script
§ Script disponibili nella piattaforma e relazionati
all’SDK
§ jQuery mobile
§ Device Script
§ Script esterni per emulare funzionalità native

60. Sviluppo ibrido

61. Sviluppo ibrido
§ Device theme
§ Elementi visuali relativi alla piattaforma specifica (più
di 100 UI uniche)
§ Elementi comuni forniti da framework esterni (Sencha
Touch, jQuery mobile, ecc.)
§ Core theme
§ Elementi visuali generici
§ Layouts, typography, color, images, ecc.
§ App theme
§ Elementi visuali specifici dell’App per specifica
platform mobile

62. Adobe PhoneGap

63. jQuery mobile

64. Sencha

65. Appcelerator Titanium

66. Corona

67. Adobe AIR

68. Adobe Digital Publishing

69. Tools
A livello di sviluppo identifichiamo:
§ SDK
§ Tool terzi

70. Distribuzione
STORE

71. Distribuzione
SKILL

72. Distribuzione
ROI

73. Distribuzione
SOCIAL

74. No privacy

75. Paradigma carrello dei bolliti

76. Paradigma carrello dei bolliti
§ Paradigma carrello dei bolliti:
§ La carne
§ La qualità della carne
§ Il giusto mix
§ Il giusto ordine
§ I giusti condimenti
§ Si mangia un po’ di tutto
§ Se rimane qualche cosa si utilizza
§ Il carrello si muove
§ Rimane sempre al caldo e si aggiunge carne
§ Risultato: Un ottimo carrello dei bolliti

77. Paradigma carrello dei bolliti
Il nostro progetto [Paradigma carrello dei bolliti]:
§ Fatto con tecnologie di sviluppo adeguate [La carne]
§ Tecnologie standard di qualità [La qualità della carne]
§ Sviluppo con varie tecnologie, non solo una [Il giusto mix]
§ Utilizzo e sviluppo secondo dei modelli/strutture [Il giusto ordine]
§ Utilizzare anche framework terzi [I giusti condimenti]
§ Di una tecnologia si sfruttano caratteristiche più adatte per lo
sviluppo di singoli elementi di progetto [Si mangia un po’ di tutto]
§ Si strutturano parti di progetto per essere riutilizzate in altri [Se
rimane qualche cosa si utilizza]
§ Il progetto deve essere cross-platform [Il carrello si muove]
§ Il progetto si deve sempre aggiornare ed integrare con nuove
tecnologie [Rimane sempre al caldo e si aggiunge carne]
Risultato: Un ottimo progetto [Un ottimo carrello dei bolliti]

78. Grazie!
PER INFORMAZIONI E MATERIALI
Tel. 0522 51 66 56
dora@insidesrl.it