Rapid prototyping with Ionic Framework
5 likes2,248 views
Il documento discute il concetto di prototipo, evidenziando la sua importanza per il design centrato sull'utente e l'identificazione precoce dei problemi di usabilità. Viene presentato un approccio pratico per creare un prototipo in 72 ore, coinvolgendo sia il team che gli sviluppatori, e si sottolinea l'uso dell'Ionic Framework per lo sviluppo veloce e cross-platform. Include anche riferimenti a risorse e tool utili per facilitare la prototipazione.
Rapid prototyping with Ionic Framework
- 1. {{ Alessio Delmonti }} Passions: Development, blues, creepy images Mail: alessio.d@gmail.com Role: wiralist CTO @alexintosh 2014
- 2. Summary ● Cos'è un prototipo ? ● Perché protipizzare ? ● Come si prototipizza ? Principi di base ● Come realizzare un buon prototipo in 72h - Team ● Come realizzare un buon prototipo in 72h - Developers Parte tecnica ● Cos'è Ionic framework ● Perché ionic ? ● I componenti ● Come installarlo ● Protokit ● Dipendenze di protokit ● Features
- 3. Cos’è un prototipo Il prototipo è la prima fase del processo produttivo. Un modello approssimato o parziale del sistema che vogliamo sviluppare che simula o esegue alcune funzioni del sistema finale, realizzato allo scopo di valutarne le caratteristiche (in particolare, la usabilità)
- 4. Perché prototipizzare ● Per tenere il design centrato sull’utente ● Per sperimentare design alternativi Prototyping is the way to find what doesn’t work early and cheap, and spend your time and money on solutions that do work
- 5. Principi base Brainstorming I dettagli non sono importanti, state cercando di stabilire il flow Testare il prototipo coding feedback DATI esperienza
- 6. L’importanza dei test Testing with 5 users finds 80% of the usability problems “Jakob Nielsen” http://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/
- 7. Prototipo in 72h - Team ● Non perdere tempo ● Impostare le attività secondo la logica "pull" e non "push" (realizzare un'attività solo quando il processo a valle lo richieda). ● Testare il prototipo direttamente online ● Dare potere al team
- 8. Prototipo in 72h - Developers ● Prima cerca SEMPRE su Google ● Stack Overflow è tuo amico ● Data model document based. ● Go open source ● Usa Git e committa sempre
- 11. Perché ionic ● Tecnologia web ● Cross-platform ● Librerie AngularJs ● Sviluppo più veloce ● Faster go-to market strategy ● Perfetto tool per arrivare al MVP (Minimum viable product) ● Vi permette di testare online
- 24. Protokit https://github.com/Alexintosh/Protokit/ A prototype kit for Ionic Framework
- 25. Struttura dei file |-- www |-- css |-- img |-- js |-- lib |-- templates |-- index.html |-- hooks |-- platforms |-- plugins |-- scss |-- config.xml
- 26. Features ● Splashscreen ● Sidemenu ● Social login (auth0) ● List view / Split view + Detail View ● Api calls ● Maps
- 27. Risorse Doc: http://ionicframework.com/docs/ Video tutorial: http://learn.ionicframework.com/ Snipplet: http://codepen.io/mhartington/tag/ionic/ Forum: http://forum.ionicframework.com/ Italian community: https://www.facebook.com/groups/380772785422827/
- 28. Grazie dell’attenzione! @alexintosh Credits: http://thenounproject.com/term/teacher/14888/ http://thenounproject.com/term/brainstorming/76607/ http://thenounproject.com/term/beaker/9665/ http://thenounproject.com/term/code/75686/ http://thenounproject.com/term/team/8185/ http://thenounproject.com/term/console/8571/ http://thenounproject.com/term/folder/25369/ http://thenounproject.com/term/list/59948/