System is processing data
Please download to view
...

Rapid prototyping with Ionic Framework

by alessio-delmonti

on

Report

Category:

Software

Download: 0

Comment: 0

1,208

views

Comments

Description

Slides of the bootcamp made for Start up weekend Palermo, about prototyping with Ionic framework
Download Rapid prototyping with Ionic Framework

Transcript

  • 1. {{ Alessio Delmonti }}Passions: Development, blues, creepy imagesMail: alessio.d@gmail.comRole: wiralist CTO@alexintosh2014
  • 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 - DevelopersParte tecnica● Cos'è Ionic framework● Perché ionic ?● I componenti● Come installarlo● Protokit● Dipendenze di protokit● Features
  • 3. Cos’è un prototipoIl prototipo è la prima fase del processo produttivo.Un modello approssimato o parziale del sistema che vogliamo sviluppare chesimula o esegue alcune funzioni del sistema finale, realizzato allo scopo divalutarne le caratteristiche (in particolare, la usabilità)
  • 4. Perché prototipizzare● Per tenere il design centrato sull’utente● Per sperimentare design alternativiPrototyping is the way to find what doesn’t workearly and cheap, and spend your time and money onsolutions that do work
  • 5. Principi baseBrainstormingI dettagli non sonoimportanti, statecercando di stabilire ilflowTestare ilprototipocodingfeedbackDATIesperienza
  • 6. L’importanza dei testTesting 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
  • 9. Parte tecnica
  • 10. 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
  • 11. I componentihttp://ionicframework.com/docs/
  • 12. Protokit https://github.com/Alexintosh/Protokit/A prototype kit forIonic Framework
  • 13. Struttura dei file|-- www|-- css|-- img|-- js|-- lib|-- templates|-- index.html|-- hooks|-- platforms|-- plugins|-- scss|-- config.xml
  • 14. Features● Splashscreen● Sidemenu● Social login (auth0)● List view / Split view + Detail View● Api calls● Maps
  • 15. RisorseDoc: 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/
  • 16. Grazie dell’attenzione!@alexintoshCredits: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/
  • Fly UP