Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Enterprise Mobile App UX: Designing from UI to Backend

6,313 views

Published on

Enterprise Applications are typically no more than a User Interface to a set of complex back-end systems. They allow Systems of Record to become Systems of Interaction by putting the records and the ability to interact with them in the palm of your hand. A good User Experience with such a Mobile App requires designing the entire end-to-end architecture with the User Interaction in mind. What is your enterprise mobile apps’ back-end? Is it a single ‘black-box’ serving up data via REST calls? Or is it a set of back-ends, communicating with your app’s UI via multiple APIs. Does your back-end include services that require you to change your app’s UI every time it gets updated? Does the nature of your back-end impact how you build your app, impact the UI design decisions you need to take? How do you test all your back-end(s) for functionality and performance? How do you integrate all these pieces together? How do you provide a good User Experience? As you build complex mobile apps, the architecture of your complete end-to-end system – Backend to UI – becomes critical to your application’s success. This presentation will help attendees identify key architectural decisions that they need to take early in their mobile app development lifecycle to help address these challenges, reduce risk and cost and enhance the User Experience. It will do so by presenting examples of successful architectures of mobile apps and explore key decisions they took and why.

Published in: Technology, Business
  • Be the first to comment

Enterprise Mobile App UX: Designing from UI to Backend

  1. 1. © 2013 IBM CorporationIBM Internal Use Only1Enterprise Mobile App UXDesigning from UI to BackendSanjeev SharmaExecutive IT SpecialistRational SoftwareIBM Software Group
  2. 2. © 2013 IBM Corporation#whoami20 year in the software industry17+ years as a solution architect with IBMAreas of work:–DevOps–Agile Transformation–Mobile Development–Software Delivery Platforms–Enterprise ArchitectureBlog @ sdarchitect.wordpress.comTwitter: @sd_architectSanjeev Sharmasanjeev.sharma@us.ibm.comIBM Software Group
  3. 3. © 2013 IBM Corporation3Elements of Mobile UXElements of Mobile UXSource: http://mobile.smashingmagazine.com/2012/07/12/elements-mobile-user-experience/
  4. 4. © 2013 IBM CorporationYou Are Not Making Angry Birds (or Bad Piggies)4
  5. 5. © 2013 IBM CorporationIt’s all about the Backend(s)Source: http://www.flickr.com/photos/doug88888/8689222557/sizes/z/in/photostream/
  6. 6. © 2013 IBM CorporationIt’s all about the Enterprise Backend(s)Mobile Apps are thefront-end to a complex(enterprise) back-endsystem–Mobile Apps are rapidlybecoming a critical userinterface to enterprise systemsHeterogeneous EnvironmentsPublic CloudPrivate CloudData Warehouse MainframeEnterpriseService BusDirectoryIdentityFilesystemsCollaborationMobile AppRoutingServiceThird-partyServicesPortalsContentProvidersEJBSharedServicesArchivesBusinessPartnersMessagingServices
  7. 7. © 2013 IBM CorporationFragmented Platforms Native Mobile Web (HTML5) Hybrid
  8. 8. © 2013 IBM CorporationMobile Application Architecture: LinkedInSource: http://engineering.linkedin.com/testing/continuous-integration-mobile
  9. 9. © 2013 IBM CorporationArchitectural Decisions determine your UXI. UI TechnologyII. Backend ArchitectureIII.UX Flow9
  10. 10. © 2013 IBM CorporationI. UI Technology: HTML5 v Native v Hybrid• UI is different between iOS, Android and BB–Style guides are different• Common code still needs to be branched• Performance of Cordova is an issue• Hardware SDKs require native–Samsung Pen–NFC• Data Needs–Connectivity or not–Free data or not10
  11. 11. © 2013 IBM Corporation11App v. Mobile web: Content v Biz logic
  12. 12. © 2013 IBM CorporationKnow thy audience• What platforms?– BlackBerry is still huge in Asia and Africa• <10% of paid apps are on Android• Cultural content consumption is almost 100% oniPhone12
  13. 13. © 2013 IBM CorporationII. Backend Architecture: Separation ofarchitectural components• Build a platform• Minimize theimpact of change• UI and Backend13Source: http://econsultancy.com/us/blog/10072-what-every-executive-needs-to-know-about-api-technology
  14. 14. © 2013 IBM CorporationMobile Application Architecture: LinkedInSource: http://engineering.linkedin.com/testing/continuous-integration-mobile
  15. 15. © 2013 IBM CorporationIII. UX Flow: Mobile UX == Backend UX15Match your User Interaction with the UI to InteractionPatterns with Backend Systems
  16. 16. © 2013 IBM CorporationChoose a UI Architecture to matchInteraction Flow16Source: http://www.uxbooth.com/articles/designing-for-mobile-part-1-information-architecture/
  17. 17. © 2013 IBM CorporationIBM Confidential Mobile Test Automation− Support for native and hybrid applications running onAndroid and iOS− Natural language test and visual test editing− Simplified IDE and mobile device clients for testauthoring, execution, and reporting Eclipse environment− Mobile Test Automation− Support for Selenium web GUI test automation− Multi-channel test scenarios− Integration with Rational Quality Manager and the IBMWorklight mobile development platform End-to-end mobile testing− Virtualization of middle-tier and back-end systems− Dynamic instrumentation of mobile applications− Capture and high-fidelity replay of multi-touch eventsBETA availablenow!BETA availablenow!IBM Rational Test WorkbenchHigh quality mobile apps built and tested for a rapidly evolving mobile infrastructureA Word from My Sponsors: Mobile User Interface Automation
  18. 18. © 2013 IBM CorporationIBM ConfidentialVerificationPointsLocalizedstringCommandeditorInstructionssetSupported Mobile Operating Systems–Android 2.2+–IOS 6+–Android & iOS hybrid apps• HTML5/CSS3• JQuery MobileFour step-testing approach:–Recording: play your test first with the recording-ready app and generate a test script–Authoring: edit and enhance the test script byadding verification points and others instructions–Playback: run the test script on a real device or anemulator–Reporting: generate an HTML reportRational Test Workbench automated mobilefunction testingVisual Object PickerExecution Report
  19. 19. © 2013 IBM CorporationParting Words: Steph Hays of FirstCustomer19“What the cr*p is this, whyam I here, and is it worthmy time?”Source: http://www.stephaniehay.com/the-1-ux-failure-of-new-products/‘Im great at clarifyingcontent and UX so usersdont wonder, "Whats thismean?”’
  20. 20. © 2013 IBM Corporation2020www.ibm.com/software/rational
  21. 21. © 2013 IBM CorporationAcknowledgements and Disclaimers:© Copyright IBM Corporation 2013. All rights reserved. U.S. Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP ScheduleContract with IBM Corp.IBM, the IBM logo, ibm.com,WebSphere, Rational, and IBM Mobile Enterrise are trademarks or registered trademarks of InternationalBusiness Machines Corporation in the United States, other countries, or both. If these and other IBM trademarked terms are markedon their first occurrence in this information with a trademark symbol (® or ™), these symbols indicate U.S. registered or common lawtrademarks owned by IBM at the time this information was published. Such trademarks may also be registered or common lawtrademarks in other countries. A current list of IBM trademarks is available on the Web at “Copyright and trademark information” atwww.ibm.com/legal/copytrade.shtmlOther company, product, or service names may be trademarks or service marks of others.Availability. References in this presentation to IBM products, programs, or services do not imply that they will be available in allcountries in which IBM operates.The workshops, sessions and materials have been prepared by IBM or the session speakers and reflect their own views. They areprovided for informational purposes only, and are neither intended to, nor shall have the effect of being, legal or other guidance oradvice to any participant. While efforts were made to verify the completeness and accuracy of the information contained in thispresentation, it is provided AS-IS without warranty of any kind, express or implied. IBM shall not be responsible for any damagesarising out of the use of, or otherwise related to, this presentation or any other materials. Nothing contained in this presentation isintended to, nor shall have the effect of, creating any warranties or representations from IBM or its suppliers or licensors, or alteringthe terms and conditions of the applicable license agreement governing the use of IBM software.All customer examples described are presented as illustrations of how those customers have used IBM products and the results theymay have achieved. Actual environmental costs and performance characteristics may vary by customer. Nothing contained in thesematerials is intended to, nor shall have the effect of, stating or implying that any activities undertaken by you will result in any specificsales, revenue growth or other results.
  22. 22. 22

×