Wireless Wednesdays: Part 1


Published on

Your business users want to access their Notes & Domino applications on their mobile devices. Join our first free webinar in a four-part series and have two experienced experts, Matt White and Rich Sharpe, guide you through what you need to know.

The first webinar takes a look at the tools and frameworks that can help you, with follow-on sessions taking a deeper dive into the 3 main alternatives: IBM XPages mobile controls, Unplugged Mobile Controls and JQuery Mobile. Matt and Rich will pick out the good, the bad, and the ugly stories from their Domino development experience.

In Part 1, learn:
-Why to mobilize a Domino application
-Mobile development options for Domino developers
-The basics of mobile app performance tuning
-7 tips for a successful mobile business app

1 Like
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Wireless Wednesdays: Part 1

  1. 1. Getting Started with Mobile Development
  2. 2. Who are we?   Matt White –  Domino web developer since 1996 –  XPages developer since 2008 –  Consultant with London Developer Co-op   Rich Sharpe –  Developer/Manager since 1998 –  Originally Java, More recently focused on mobile web development using XPages –  Worked on Mobile Apps/Architecture on and off since 2000 2
  3. 3. What’s the point of Wireless Wednesdays?   Mobile is coming fast –  Web or native   We want to talk about the options from the point of view of the Domino developer –  What frameworks can we use? –  What are the pros and cons of different frameworks   Talk about mobile development in more detail –  Based on our “real world” experience –  Learn from our mistakes! 3
  4. 4. What will we be covering?   January / February –  At IBM Connect, Rich and Matt will be presenting a session about the Unplugged Mobile Controls. –  BP201- Tuesday 28th January - 3pm   March –  Deep dive into Dojo Mobile Controls   April –  Deep dive into jQuery Mobile   May –  Deep dive into Unplugged Mobile Controls 4
  5. 5. Agenda 1 Why mobilize your application? 2 Mobile development options for Domino developers 3 The basics of mobile app performance tuning 4 6 tips for a successful mobile business app 5
  6. 6. Why mobilize your application?   Increased user base –  Often users use their mobile device before their PC –  Users aren’t tied to the office   Extend the life of your application –  A chance to re-invigorate your application –  If it can be used in more places will it get more use?   Extend the potential uses for your application –  Offline mobile support? 6
  7. 7. Why mobilize your application?   Your application will be competing with 1m apps from the app store   If you do mobilize your application you must… –  Make it easy to use –  Pay significant attention to user interface design 7
  8. 8. Mobile development options for Domino developers   Dojo Mobile Controls –  Ships with Domino   jQuery Mobile –  The populist choice   Other popular options: –  Sencha Touch –  Kendo UI   Unplugged Controls –  The mystery third option  8
  9. 9. Dojo Mobile Controls   Integrated into XPages   Started out as an OpenNTF project in 2010   Fed back into the main Domino product in 8.5.3 –  as part of the Extension Library –  or via Upgrade Pack 1   Supported by IBM and no extra install required –  In 9.0.1 we use Dojo 1.8.3   Tries to provide a “native” UI for each mobile device 9
  10. 10. Dojo Mobile Controls 10
  11. 11. Dojo Mobile Controls   Built into Domino –  no approvals or installation required so your admins are happy! –  Very little coding required, just drag and drop controls   Very quick to develop a basic application   Is being worked on actively by both IBM and Dojo 11
  12. 12. Dojo Mobile Controls   Poor user experience on tablets –  Targeting phones and tablets can be quite challenging to get a nice looking result   iOS UI is still iOS 6 –  Though you can style this yourself   Gets much more difficult quite quickly –  If you want to support editing –  If you go below 3 levels of breadcrumb history   Performance not the best 12
  13. 13. jQuery Mobile   One of the most popular mobile web frameworks   Very simple to change theme to match your corporate style   Creating more complex applications is easier than Dojo Mobile Controls –  It’s more like creating a multi page XPages application 13
  14. 14. jQuery Mobile 14
  15. 15. jQuery Mobile   You get the choice of single page app (like Dojo Mobile Controls) or to load full pages for complex functions –  Single page app == speed –  Multi page app == complexity   Can be used in Mobile Web or offline with Teamstudio Unplugged   Huge developer community so lots of resources, plugins etc   Very easy to pick up and get started with 15
  16. 16. jQuery Mobile   Potentially slow performance over 3g networks –  860kb for jQuery Mobile vs 150k for Dojo for same page functionality   Very JavaScript heavy, every element needs to be processed once downloaded –  For older phones this slows things down –  Becoming less of an issue with iPhone 5S for example   Harder to integrate into Domino from v1.3 and later –  http://notesin9.com/index.php/2013/04/20/jquery-mobileseems-incompatible-with-xpages-in-domino-9-0/ 16
  17. 17. Unplugged Controls   Created by us specifically for XPages developers   A suite of 18 Custom Controls which allow you to quickly create a simple application –  And also allow the creation of more complex apps as well   Easy to change the UI using our Restyler website –  http://restyler.teamstudio.com   Under active development for XPages developers   Designed to work well with tablets and phones 17
  18. 18. Unplugged Controls 18
  19. 19. Unplugged Controls   We’re aiming to offer the best of both Dojo Mobile Controls and jQuery Mobile worlds –  Easy to create XPages applications of both simple and complex varieties –  Easy to change UI –  Performs well –  High quality tablet and phone user experience –  Easy to add offline capability •  With Teamstudio Unplugged 19
  20. 20. Unplugged Controls   Framework has to be added manually to Domino Designer   Small development team and community compared to other frameworks   At the moment requires use of XPages rather than other more modern server technologies 20
  21. 21. Mobile App Performance Tuning   Best solution for good performance is good design   Know your audience –  Which devices •  Phones or tablets / iOS or Android / both or all? –  Which use cases •  Online or offline?   Know your application –  Identify key features –  Reduce screen sizes –  Progressive disclosure 21
  22. 22. Mobile App Performance Tuning   Make a decision about the balance between initial page load times and in app performance   If you can load a page via Ajax do it –  Even if it’s not faster you can provide feedback to the user   Optimize your code –  Minify JS and CSS –  Do you really need to use graphics? •  Maybe use font icons instead? –  We use Font Awesome in Unplugged Controls   Write good code! –  Code reviews are a wonderful (if scary) thing 22
  23. 23. Mobile App Performance Tuning   Understand from the outset what your targets are: –  Page load times need specifics •  Which device(s) –  Latest iOS devices are significantly faster than even the previous generation •  Amount of data –  For initial page load vs. subsequent pages •  Network conditions –  Wi-Fi vs. 3G or 4G –  Network Latency 23
  24. 24. 6 tips for a successful mobile app   Developing applications for mobile users is a different experience for us as developers than with the desktop which we’re used to, so here are some tips we have picked up… 1.  Be selective in project scope Pick the most important functions of your application to mobilize. Not everything is needed by people away from their desktop 2.  Less is more Screens on mobile devices are smaller than the desktop, reduce the amount of data you expect users to input to the base minimum 24
  25. 25. 6 tips for a successful mobile app 3.  Imitation is the sincerest form of flattery Your users all use other mobile apps on a daily basis. Don’t try to reinvent the wheel. Make use of common design patterns. 4.  Get a second opinion We’re developers not designers (well most of us). Design is a skill and it’s worth getting an expert in to help with your UI. 25
  26. 26. 6 tips for a successful mobile app 5.  Keep ‘em separated Mobile and desktop are not the same. Generally you will want to implement different interfaces for each one. Merged designs will be compromised on one or both environments. 6.  Ask, Listen, Edit, Repeat Make sure your users are involved from day 1 of the project, it will give them ownership but also head off any last minute “could you just…” moments 26
  27. 27. Further Resources   Dojo Mobile Controls –  http://dojotoolkit.org/features/mobile   jQuery Mobile –  http://jquerymobile.com   Unplugged Controls –  http://unplugged.openntf.org –  http://restyler.teamstudio.com 27
  28. 28. IBM Connect Sessions   BP201 - Creating a Mobile Application Framework with XPages –  Tuesday 28th Jan 3pm –  If you create a lot of mobile web applications, you may notice other frameworks such as JQuery Mobile and the XPages Mobile Controls just don't do exactly what you need. So we created our own, specifically designed for XPages. In this session you'll learn about the open source framework that's been have created. We'll show how it allows you to quickly drag and drop standard custom controls into an XPage to create a mobile application. We'll also talk about the process of creating an open source project and future plans.   BOF - Creating an Unplugged Controls Virtual User Group –  Please come along! 28
  29. 29. 29