Your SlideShare is downloading. ×
0
DesigningMOBILE APPS      withHTML5 & CSS3
JOHANNES IPPENSenior Graphics Designer, Wooga                     FLORIAN FRANKE                      Interactive Designer...
55.000
100.000
All made with …HTML5
No AppStore   Cloud-basedIndependent       Easy
HTML5   ROCKT!
WEBSITES   vsAPPS
Solve    Look &     CreateProblems    Feel    Experience
GOOGLE MAIL
SOUNDCLOUD
HOW TO design an app?
Identify thePROBLEM
In whichSITUATION will the app be used?
STORYBOARD  helps you understand
WIREFRAMES   & user flow
USABILITYTEST
DON‘T TELLthe user what to do, let himSOLVE   the problem
DON‘T TESTYOUR USER you are testing the App!
DON‘T LISTEN to what the user wishesOBSERVE      what he does
HTML5   CSS3JAVASCRIPT
don‘t reinvent the wheelTOOLS
BOOTSTRAP
ZEPTO.JS
JQUERY MOBILE
SENCHA TOUCH
HTML5ROCKT.DE
A look into theFUTURE
HTML5 IS HERE    and it‘s hereTO STAY
WEB GLon mobile? Hell, yeah!
WEB RTC
MAINSTREAMyour grandma uses webapps, too.
HTML5   ROCKT!
HTML5ROCKT.DE      @html5rockt       @presskindwww.asidemag.com    @ffranke1985   www.madein.io
Design mobile-apps-htm5-css3-2012
Design mobile-apps-htm5-css3-2012
Design mobile-apps-htm5-css3-2012
Design mobile-apps-htm5-css3-2012
Design mobile-apps-htm5-css3-2012
Design mobile-apps-htm5-css3-2012
Design mobile-apps-htm5-css3-2012
Design mobile-apps-htm5-css3-2012
Design mobile-apps-htm5-css3-2012
Design mobile-apps-htm5-css3-2012
Upcoming SlideShare
Loading in...5
×

Design mobile-apps-htm5-css3-2012

816

Published on

Design Mobile Apps with HTML5 and CSS3

Published in: Technology, Education
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
816
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
16
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Transcript of "Design mobile-apps-htm5-css3-2012"

  1. 1. DesigningMOBILE APPS withHTML5 & CSS3
  2. 2. JOHANNES IPPENSenior Graphics Designer, Wooga FLORIAN FRANKE Interactive Designer, made in
  3. 3. 55.000
  4. 4. 100.000
  5. 5. All made with …HTML5
  6. 6. No AppStore Cloud-basedIndependent Easy
  7. 7. HTML5 ROCKT!
  8. 8. WEBSITES vsAPPS
  9. 9. Solve Look & CreateProblems Feel Experience
  10. 10. GOOGLE MAIL
  11. 11. SOUNDCLOUD
  12. 12. HOW TO design an app?
  13. 13. Identify thePROBLEM
  14. 14. In whichSITUATION will the app be used?
  15. 15. STORYBOARD helps you understand
  16. 16. WIREFRAMES & user flow
  17. 17. USABILITYTEST
  18. 18. DON‘T TELLthe user what to do, let himSOLVE the problem
  19. 19. DON‘T TESTYOUR USER you are testing the App!
  20. 20. DON‘T LISTEN to what the user wishesOBSERVE what he does
  21. 21. HTML5 CSS3JAVASCRIPT
  22. 22. don‘t reinvent the wheelTOOLS
  23. 23. BOOTSTRAP
  24. 24. ZEPTO.JS
  25. 25. JQUERY MOBILE
  26. 26. SENCHA TOUCH
  27. 27. HTML5ROCKT.DE
  28. 28. A look into theFUTURE
  29. 29. HTML5 IS HERE and it‘s hereTO STAY
  30. 30. WEB GLon mobile? Hell, yeah!
  31. 31. WEB RTC
  32. 32. MAINSTREAMyour grandma uses webapps, too.
  33. 33. HTML5 ROCKT!
  34. 34. HTML5ROCKT.DE @html5rockt @presskindwww.asidemag.com @ffranke1985 www.madein.io
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×