From Desktops to Mobile and Smart Phones – Lessons Learned
This session at Lotusphere 2012 was presented by Usman Memonand focused on lessons learned and best practices many organizations face today when moving to mobile platforms. Some of the key lessons learned are highlighted here.
Development Approaches and Considerations
- Users are attempting to access your sites with mobile devices whether you have a mobile site or not
- There are trade-offs: Richness of your mobile presence increases total cost of ownership
- Native applications will be richest but highest cost
- Hybrid mobile applications are growing in popularity since they are web based but can use device capabilities such as a GPS or camera
- Cost and complexity goes up exponentially as you try to support custom interfaces for more than 1 device
Best Practices
Mobile web applications and hybrid applications are preferred
Native Applications
- Rich users interfaces
- Tighter integration with OS and hardware
- Device market is fragmented so yo need to pick specific platforms, devices and OS
- Delivery is controlled by the app store
- Role based access is challenging
- Development is expensive
Mobile web and hybrid
- Most devices support the web kit extensions and HTML 5
- Existing technology stack can often be leveraged
- Much easier to find than native applications since
- Must revisit existing interfaces to adapt them to mobile
Leverage automation technology for mobile solutions when possible
- IBM Web Experience Factory has quite a few mobile capabilities built in
- Profiling is supported in the factory to profile devices
Screen is Prime Real Estate
Screens are small so use the real estate wisely
- Consider size constraints when designing UI
- Optimized Navigation is very important, e.g. use accordions, light boxes, etc
- Device is important, e.g. tablet vs phone
- Always avoid horizontal scrolling
Minimize free form field entry
Mobile devices are error prone to typing and not optimized. Minimizing free form text entry when possible helps create a better experience.
- Use drop downs or list
- AJAX type ahead is important
- Tab order must be considered
UI design should be interaction based instead of visual
- Just because a design is aesthetically pleasing doesn’t mean it is usable
- Involving interaction testing reinforces this
- Mobile is not a desktop, it’s very different. e.g. hover over tool tips don’t work
Make sites orientation aware
Most devices change layouts depending on device orientation. This should be handled by the site
There are many performance considerations you must take into account.
- Use orientation to dynamically adapt content depending on portrait or landscape orientation
- Users expect this type of dynamic contact adaptatoin
Use hybrid applications for device specific features
Most devices change layouts depending on device orientation. This should be handled by the site
There are many performance considerations you must take into account.
- Hybrid applications can access device specific capabilities such as a phone, camera or contact list
- Consider the use of a 3rd party library like PhoneGap to help integrate mobile web app with native applicatoins
Performance
There are many performance considerations you must take into account.
- Network access varies, bandwidth is not unlimited. Users often access over 3G connections
- Reduce HTTP payload to make sure sites render faster and unnecessary things aren’t downloaded such as full dojo or jQuery libraries
- Caching should be used wherever possible. This can substantially reduces the impact of network limitations
- Use pagination on the server side. This not only reduces HTTP payload but reduces back end processing
Miscellaneous Considerations
A key message of the session that I could not agree more with is that when going mobile you can’t simply do a straight migration. There are quite a few considerations to deliver successful mobile solutions and the tips above are a great starting point and terrific advice.
