Tussentijdse presentatie maart 2013

699 views

Published on

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

  • Be the first to like this

No Downloads
Views
Total views
699
On SlideShare
0
From Embeds
0
Number of Embeds
439
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Tussentijdse presentatie maart 2013

  1. 1. Vergelijkende studie vanraamwerken voor deontwikkeling van mobieleHTML5 applicatiesTim Ameye Sander Van Loock 26 maart 2013
  2. 2. Inhoud● Inleiding● Vergelijkingscriteria● Raamwerken● Evaluatie● Slot
  3. 3. Inleiding
  4. 4. Doel Vergelijkende studie van raamwerken voor de ontwikkeling van mobiele HTML5 applicaties
  5. 5. Doel Vergelijkende studie van raamwerken voor de ontwikkeling van mobiele HTML5 applicaties Productiviteit Performantie Gebruik Omkadering Ondersteuning
  6. 6. Doel Vergelijkende studie van raamwerken voor de ontwikkeling van mobiele HTML5 applicaties
  7. 7. Doel Vergelijkende studie van raamwerken voor de ontwikkeling van mobiele HTML5 applicaties
  8. 8. Doel Vergelijkende studie van raamwerken voor de ontwikkeling van mobiele HTML5 applicaties
  9. 9. Vergelijkingscriteria● Omkadering● Productiviteit● Gebruik● Ondersteuning● Performantie
  10. 10. Omkadering
  11. 11. Productiviteit● tijd opmeten ○ implementatie POC ○ implementatie loginscherm● vermelden tools, achtergrond, ...
  12. 12. Gebruik● uitdagingen met score ○ 2: ondersteund door raamwerk ○ 1: ondersteund via plugin ○ 0: niet ondersteund Forms (C1,C2,C3,C4,C5) C1: Create forms with placeholders, but without labels. C2: Use the text, number and email as form types. C3: Custom datepicker with data range. C4: Custom datepicker only with month and year. C5: Clearing the form.
  13. 13. Ondersteuning● uitdagingen testen op toestellen HCI ○ HTCDesireZ - Android 2.3.3 ○ GalaxyTab - Android 2.3.6 ○ Galaxy Gio - Android 2.3.6 ○ GalaxySII - Android 4.1.2 ○ Nexus 7 - Android 4.2.1 ○ iPad3 4GWiFi - iOS 6.0.1 ○ iPhone 3GS - iOS 6.0.1 ○ iPhone 3GS - iOS 6.0.1● native look-and-feel van webapplicatie
  14. 14. Performantie● Google PageSpeed● Dummy page met UI elementen● AJAX request● Loginschermen
  15. 15. Raamwerken● jQuery Mobile● Sencha Touch● Lungo● Kendo UI
  16. 16. 2012 versie 1.22013 versie 1.3● Autocomplete is nu standaard aanwezig● Input file veld heeft layout● Splitview● Handtekening● Opslaan expense op backend● Offline maken
  17. 17. ● Demo
  18. 18. ● Nieuwe update file upload plugin [Smirnov]● Sencha Cmd voor bouwen applicatie ○ Minify JavaScript ○ Manifest voor local storage [Smirnov] Constantine V. Smirnov. File-uploading-component-for-Sencha-Touch. https://github.com/kostysh/File-uploading-component-for-Sencha-Touch, 2012.
  19. 19. ● Demo
  20. 20. ● Markup gedreven● Gebouwd op QuoJS● Gemaakt door Tapquo● GPLv3 en commercieel2011 versie 1.0nu versie 2.1
  21. 21. ● Core● Data● DOM● Element● Notification● Router● Service● View
  22. 22. ● Product van Telerik● Hoog kostenplaatje ○ $ 699 Kendo UI Complete (per ontwikkelaar) ○ $ 999 Kendo UI Complete met server side wrappers● Versie 2013 Q1
  23. 23. ● Mark-up & JavaScript gedreven● Steunt op de jQuery bibliotheek● MVVM architectuur (cfr. Sencha Touch MVC architectuur)
  24. 24. Evaluatie● Gemeenschap● Productiviteit● Gebruik
  25. 25. Evaluatie - Gemeenschap● Sociale netwerken● GitHub ?● Up-to-date informatie ophalen?
  26. 26. Evaluatie - Productiviteit● Implementatie POC in nieuwe raamwerken bezig● Loginschermen jQM en ST klaar● Alles te vinden op tinyurl.com/htmobiel
  27. 27. Evaluatie - GebruikFormulier vullen: jQuery Mobile Sencha Touch Vul velden met data Zelf te MVC ondersteuning programmeren Maak velden read- Elementen uit select read-only only veld verwijderen eigenschap Score 0+0=0 2+2=4
  28. 28. Evaluatie - GebruikHandtekening: jQuery Mobile Sencha Touch Handtekening Plugin [Bradley] Plugin [SimFla] Score 1 1[Bradley] Thomas Bradley. Signature Pad. http://thomasjbradley.ca/lab/signature-pad/. [Online;accessed 22/02/2013][SimFla] SimFla. SimFla-signaturePad. https://github.com/SimFla/SimFla-signaturePad, 2011.
  29. 29. Evaluatie - GebruikLayout aanpassen aan toestel: jQuery Mobile Sencha Touch Toestel herkennen CSS3 Media query Methoden voor herkenning Split view CSS3 Media query vbox layout Smartphone menu Klikbare subheader extra knop Score 1+1+1=3 2+2+0=4
  30. 30. Slot● Status● Planning● Statistieken
  31. 31. Status november 2012● afgerond ○ gedeeltelijke implementatie POC (jQM & ST) ○ hoofdstuk 1● werkpunt ○ vergelijkingscriteria
  32. 32. Huidige status● afgerond ○ volledige implementatie POC (jQM & ST) ○ vergelijkingscriteria ○ draft paper ○ thesisstructuur
  33. 33. Planning● nu - week 15/4 ○ afwerken login ○ afwerken POC ○ afwerken hoofdstukken 1-3● week 22/4 ○ vergelijking uitvoeren (performantie, ondersteuning) ○ spiderweb maken● week 27/4 - 17/5 ○ poster ○ hoofdstukken 4-5 ○ herschrijven artikel
  34. 34. Statistieken Tim Ameye Sander Van Loock Blogposts 11 8 Comments 23 25 Tweets 64 44 Uren totaal 386 425 - lezen 75 85,5 - schrijven 72 64,5 - social network activities 30 12,5 - meetings 53 46 - reflectie 11 6 - ontwerp 2,5 1 - implementatie 118,5 192 - evaluatie 1 0 - presentatie 23 14,5Score: 14/20

×