“We want an App!”<br />Øyvind Malin - @oyvindmal<br />Oslo WordpressMeetup – 13. july 2011<br />
Why?<br />
Agenda<br />Whygo mobile?<br />Different ways to be present onthe mobile platform<br />Demos and samples<br />How to make ...
About<br />Studiedinteraction design at NITH<br />Playingaroundwith web since 1999<br />Startedfoucsingonthe mobile platfo...
Some terms<br />Customer (in thispresentation) is theend user.<br />Company (in thispresentation) is thecompany providing ...
Three different types ofapps(simplified)<br />
Three different types ofapps<br />Informationalapps<br />Utilityapps<br />
Three different types ofapps<br />iPhone used as sample | * Dependingonplatform and device<br />
-”Wewant an APP!””<br />
What to offer?<br />Doesthecustomerneedthis?<br />Does it addvalue for thecustomer?<br />Does it addvalue for thecompany?<...
Two approaches?<br />
Wrapping the existing web app in a mobile friendly skin<br />
Wrapping existing solution<br />Pros<br />Shorter development time<br />Easier to maintain<br />Content can be targeted to...
Tailoring content for the mobile platform<br />
Tailoring content for the mobile platform<br />Pros<br />Good user experience<br />Direct and concrete information to the ...
Let’s get ready to rumble?<br />
Mobile != Desktop<br />
8 out of 10 uses their mobile phone in the free time<br />
This means<br />The typical usage time could 2-5 minutes (i.e while waiting at an intercection)<br />Quick and direct info...
But this isn’t always true<br />
Other user situations<br />Transportation<br />Taxi, Train, Bus, Boat etc. <br />This means -><br />The typical usage time...
iPad != iPhone<br />
“iPad'snot mobile…next question”-Mark Zuckerberg<br />
Tablets<br />Larger screen<br />Different usecases<br />Used more like a laptop<br />…But also on the go<br />So you need ...
My project<br />
Whatsupweb.net<br />Page about web development and user experience.<br />New version coming ultimo 2011<br />Tailored vers...
Some examples<br />
LIVE DEMO<br />
WPTouch<br />
Blackbelt tricks<br />
Testing in Safari<br />Using the developer bar you can get Safari (5 and newer) to identify as Mobile safari(http://macs.a...
Testing in simulator/emulator<br />Simulators/emulators are almost always available for free download:<br />iPhone/iPad – ...
Libraries<br />jQuery Mobile – http://www.jquerymobile.com<br />Sencha Touch – http://www.sencha.com<br />iScroll - http:/...
Statistics<br />Usage statistics for smartphones and tablets in Norway can be found at<br />http://labs.finn.no/<br />
Mobile firstStart off as if you were making a mobile website even if no mobile version is plannedhttp://www.lukew.com/ff/e...
Want to go native(ish)?<br />Phonegap offers a way to wrap normal web applications in a native shell<br />Support for most...
Questions?<br />
Summary<br />Everybody (almost) can go mobile.<br />But not with anything<br />Content Context is king<br />Give your user...
Øyvind Malin<br />Consultant<br />+47 909 71 598<br />oyvind.malin@bekk.no<br />
Upcoming SlideShare
Loading in...5
×

"We want an APP!"

864

Published on

Published in: Technology, Business
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
864
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • http://www.joker.no
  • http://en.m.wikipedia.org/wiki/norway/
  • Financial times
  • "We want an APP!"

    1. 1. “We want an App!”<br />Øyvind Malin - @oyvindmal<br />Oslo WordpressMeetup – 13. july 2011<br />
    2. 2. Why?<br />
    3. 3. Agenda<br />Whygo mobile?<br />Different ways to be present onthe mobile platform<br />Demos and samples<br />How to make Wordpress mobile friendly<br />Make yourwebsite mobile friendly right now?<br />
    4. 4. About<br />Studiedinteraction design at NITH<br />Playingaroundwith web since 1999<br />Startedfoucsingonthe mobile platform in recentyears<br />Frontend Developer at BEKK<br />
    5. 5.
    6. 6. Some terms<br />Customer (in thispresentation) is theend user.<br />Company (in thispresentation) is thecompany providing the service<br />I useiPhoneand otheriDevices as samples buttheprinciplesaresimilaronotherplatforms.<br />
    7. 7. Three different types ofapps(simplified)<br />
    8. 8. Three different types ofapps<br />Informationalapps<br />Utilityapps<br />
    9. 9. Three different types ofapps<br />iPhone used as sample | * Dependingonplatform and device<br />
    10. 10. -”Wewant an APP!””<br />
    11. 11. What to offer?<br />Doesthecustomerneedthis?<br />Does it addvalue for thecustomer?<br />Does it addvalue for thecompany?<br />Can it save thecompanymoney?<br />
    12. 12. Two approaches?<br />
    13. 13. Wrapping the existing web app in a mobile friendly skin<br />
    14. 14. Wrapping existing solution<br />Pros<br />Shorter development time<br />Easier to maintain<br />Content can be targeted to multiple platforms<br />Cons<br />Information overflow<br />Bad user experience (possibly)<br />
    15. 15. Tailoring content for the mobile platform<br />
    16. 16. Tailoring content for the mobile platform<br />Pros<br />Good user experience<br />Direct and concrete information to the customer<br />Cons<br />Longer development time<br />Harder to maintain<br />Content must be targeted at a specific platform<br />
    17. 17. Let’s get ready to rumble?<br />
    18. 18. Mobile != Desktop<br />
    19. 19. 8 out of 10 uses their mobile phone in the free time<br />
    20. 20. This means<br />The typical usage time could 2-5 minutes (i.e while waiting at an intercection)<br />Quick and direct information <br />Limited bandwidth<br />Usually 3g or Edge<br />If the user can’t get the information they want in this timespan. They have to look somewhere else.<br />
    21. 21. But this isn’t always true<br />
    22. 22. Other user situations<br />Transportation<br />Taxi, Train, Bus, Boat etc. <br />This means -><br />The typical usage time could be longer from 20 minutes up to several hours.<br />You must also serve these users<br />Providing links to more detailed information<br />
    23. 23. iPad != iPhone<br />
    24. 24. “iPad'snot mobile…next question”-Mark Zuckerberg<br />
    25. 25. Tablets<br />Larger screen<br />Different usecases<br />Used more like a laptop<br />…But also on the go<br />So you need to support both separate<br />
    26. 26. My project<br />
    27. 27. Whatsupweb.net<br />Page about web development and user experience.<br />New version coming ultimo 2011<br />Tailored versions for phones and tablets<br />Targeting most phones and iPad<br />“Read it later”<br />Showcase for mobile tailoring web pages<br />Looking for guest writers<br />
    28. 28. Some examples<br />
    29. 29.
    30. 30.
    31. 31.
    32. 32. LIVE DEMO<br />
    33. 33. WPTouch<br />
    34. 34. Blackbelt tricks<br />
    35. 35. Testing in Safari<br />Using the developer bar you can get Safari (5 and newer) to identify as Mobile safari(http://macs.about.com/od/usingyourmac/qt/safaridevelop.htm )<br />Resize the window to match iPhone viewport(http://davidchambersdesign.com/resize-browser-window-to-match-iphone-viewport-dimensions )<br />
    36. 36. Testing in simulator/emulator<br />Simulators/emulators are almost always available for free download:<br />iPhone/iPad – http://developer.apple.com<br />Windows Phone – http://create.msdn.com<br />Android – http://developer.android.com<br />
    37. 37. Libraries<br />jQuery Mobile – http://www.jquerymobile.com<br />Sencha Touch – http://www.sencha.com<br />iScroll - http://cubiq.org/iscroll-4<br />
    38. 38. Statistics<br />Usage statistics for smartphones and tablets in Norway can be found at<br />http://labs.finn.no/<br />
    39. 39. Mobile firstStart off as if you were making a mobile website even if no mobile version is plannedhttp://www.lukew.com/ff/entry.asp?933<br />
    40. 40. Want to go native(ish)?<br />Phonegap offers a way to wrap normal web applications in a native shell<br />Support for most modern platforms including iPhone and Android<br />Offers javascript access to device specific hardware apis<br />
    41. 41. Questions?<br />
    42. 42. Summary<br />Everybody (almost) can go mobile.<br />But not with anything<br />Content Context is king<br />Give your users what they need and expect in every situation<br />Mobile web will be suitable in many cases<br />
    43. 43. Øyvind Malin<br />Consultant<br />+47 909 71 598<br />oyvind.malin@bekk.no<br />

    ×