SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7
-
Upload
whymca -
Category
Technology
-
view
294 -
download
0
Transcript of SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7
![Page 1: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/1.jpg)
Salvatore Laisa - @moebiusmaniaMohole Lab
Scontro tra UI
-aka-
cosa dovremmo imparare
da Android, iOS e WP7
Scontro tra UI
![Page 2: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/2.jpg)
About me
2007 20102006 2008 2011/2012
![Page 3: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/3.jpg)
1. User interface
2. Cross Platform
3. Case histories
4. Risorse
3
Di cosa parleremo oggi
![Page 4: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/4.jpg)
4
Parte 1:User interface
![Page 5: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/5.jpg)
• Le UI esistono per permettere interazioni
• Mantenere l’attenzione, sempre
• Consistenza e pertinenza sono importanti!
• Un’azione primaria per schermata
• Le azioni secondarie... sono secondarie!
5
Principi di User Interface
![Page 6: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/6.jpg)
6
Le UI che si sfideranno oggi
iOS Android Metro
![Page 7: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/7.jpg)
7
iOS - User Interface Pro• Luccicante e sfavillante!
• Ha dettato molti standard
• No pulsanti fisici
• Stile molto curato
![Page 8: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/8.jpg)
8
iOS - User Interface Cons• Lo stile inizia a essere datato
• Barre invadenti
• Troppe app uguali
• Distinguersi è rischioso
![Page 9: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/9.jpg)
9
Android - User Interface Pro• UI rinnovata e pulita
• Style Guide pubblica
• Molte icone
• Look alla “Tron”
• Molte azioni con swipe
![Page 10: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/10.jpg)
10
Android - User Interface Cons• Scarsa diffusione ICS-design
• Migliorata, ma non del tutto
• Differenze “forzate”
• Sense, TouchWiz, ecc...
![Page 11: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/11.jpg)
11
Metro - User Interface Pro• Ritorno all’essenziale
• Cura dettagli
• Content-centric design
• Transizioni fluide
![Page 12: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/12.jpg)
12
Metro - User Interface Cons• Forse troppo essenziale?
• UX ancora acerba
• Sarà meglio compresa con Windows 8
![Page 13: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/13.jpg)
13
Parte 2:Cross platform
Illustrazione:Will Phillips Jr
![Page 14: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/14.jpg)
14
Qual’è il punto?Realizzare User Interface consistenti
attraverso tutte e 3 le piattaforme.
![Page 15: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/15.jpg)
15
Perché dovrei?Perché la realtà del mercato (e quindi di
chi ci commissiona app) è che esistono 3 piattaforme.
![Page 16: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/16.jpg)
16
• il cliente punta a un’utenza vasta
• si lavora con feature comuni
• sviluppo con soluzioni “bridge” (HTML5)
• c’è una controparte Web
Casi di una UI cross-platform
![Page 17: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/17.jpg)
17
• vogliamo il massimo dalla piattaforma
• per correre meno rischi
• è “solo” un’app
• voglio conferire esclusività
Quando invece NO
![Page 18: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/18.jpg)
18
Esiste la UI universale?Può darsi, ma intanto possiamo prendere il meglio da queste 3 e amalgamarlo nelle
nostre app!
![Page 19: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/19.jpg)
19
Parte 3:Case histories
Foto:“Ocean view branch” - Orange County Archives
![Page 20: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/20.jpg)
20
Case history 1: Fineco
![Page 21: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/21.jpg)
21
Case history 2: WordPress
![Page 22: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/22.jpg)
22
Case history 3: Facebook
![Page 23: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/23.jpg)
23
Case history 4: jQuery Mobile
![Page 24: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/24.jpg)
24
Parte 4:Risorse
Foto:“Presents” - Msmorningtom
![Page 25: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/25.jpg)
25
• iOS - https://developer.apple.com/devcenter/ios/
• Android Design - http://developer.android.com/
• WP7/Metro - http://msdn.microsoft.com
• (Design Shack) Trends in UI Design - http://
designshack.net/articles/graphics/interesting-trends-in-ui-design/
Dove documentarsi
![Page 26: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/26.jpg)
26
Letture interessanti
Designing Mobile Interfaces
(S. Hoober / E. Berkman)
Simple and usable
(Giles Colborne)
![Page 27: SCONTRO TRA UI -AKA- COSA DOVREMMO IMPARARE DA IOS, ANDROID E WP7](https://reader034.fdocuments.in/reader034/viewer/2022051314/5563170dd8b42a51498b4f0a/html5/thumbnails/27.jpg)
27
a questo punto...