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.

Webinar: Mobile UX: Doing It The Right Way

Mobile exceeds desktop web usage! This was one landmark change which was documented in early 2014. Now, a year later, businesses are still trying to come to the grips with this tectonic plate-shifting change. According to Goldman Sachs, mobile commerce sales would hit $626 billion by 2018, and according to Forrester Research, 54% of the total e-commerce sales would be done on a mobile device in the next three years.

The ubiquitousness of the mobile devices accompanied by the ever improving infrastructure (speed, connectivity, etc) are the catalysts for this growth. But just as every coin has two sides, mobile poses a great challenge for many businesses which they are yet to tame.

One of the most common mistakes firms do, is to presume that users would be navigating through your app, or mobile site in the same manner as they do with a desktop. Simply having an app or a mobile web site should not be your Mobile First Strategy. Providing a good mobile user experience (UX) is indispensable in today’s business environment.

Thank you, for joining us for the webinar on “Mobile UX: Doing it the right way” on Wednesday, February 11, 2015. In this webinar attendees got insights on the various practices, processes and design strategies to create and deliver a rich mobile UX.

THE WEBINAR KEY TAKEAWAYS :

1- Designing an optimal, intuitive and rich UX with improved collaboration and consultative approach
2- Insights on user centric design strategies for mobile
3- Mitigate common challenges in app design and development
4- Enhance your mobile experience with the right balance between standards and creatives

  • Login to see the comments

Webinar: Mobile UX: Doing It The Right Way

  1. 1. Welcome to the Webinar Mobile UX: Doing It The Right Way by Harbinger Systems © Harbinger Systems | www.harbinger-systems.com
  2. 2. Panelists © Harbinger Systems | www.harbinger-systems.com Ritesh Thakkar Sr. UX Designer Harbinger Systems Smita Mohith K Lead UX Harbinger Systems Marketing Executive Harbinger Systems Sushant Saraswat
  3. 3. Agenda • Contributors in User Experience • UCD (User Centric Design) difference on Web and Mobile • Mobile UX Considerations • Mitigate common challenges in App Design and Development • Rich User Experience • Q&A © Harbinger Systems | www.harbinger-systems.com
  4. 4. Contributors in User Experience © Harbinger Systems | www.harbinger-systems.com
  5. 5. Contributors in User Experience © Harbinger Systems | www.harbinger-systems.com UX Designer UI Designer DeveloperStakeholder UX
  6. 6. UX Designer © Harbinger Systems | www.harbinger-systems.com Consulting Stakeholder Conceptualization keeping mobile usage in mind Defining Gestures and interactions Validation with Users Competition/market study Defining UX strategy
  7. 7. Stakeholder © Harbinger Systems | www.harbinger-systems.com Clear concept & requirements articulation Periodic review Selecting correct approach
  8. 8. Visual (or UI) Designer © Harbinger Systems | www.harbinger-systems.com Checking visual designs on devices Mobile real-estate consideration Tappable area and spacing between it Providing artifacts specific to device OS standards
  9. 9. Developer © Harbinger Systems | www.harbinger-systems.com Thinking beyond code Foresee feasibility R&D based on latest styles and trends
  10. 10. UCD (User Centric Design) strategies for mobile © Harbinger Systems | www.harbinger-systems.com
  11. 11. • On Web – Even for the minimum resolution, plenty of real estate is available • On Mobile – For mobile it is necessary to start with smaller screen size Why UCD different on Web and Mobile
  12. 12. • On Web Visual hierarchy & appropriate placement to guide user’s attention • On Mobile Tappable/target area, actionable near the thumb, motor load UCD difference Source: uxmovement.com
  13. 13. • Web - Architecture is defined based on task priority. Visual hierarchy and color usage to guide user’s attention. • Mobile - Architecture is defined based on usage scenario. Primary tasks upfront and funnel down to the secondary tasks. © Harbinger Systems | www.harbinger-systems.com UCD difference
  14. 14. • On Web – Detailed Navigation • On Mobile – Simplified Navigation © Harbinger Systems | www.harbinger-systems.com UCD difference Source: templatemonster.com Source www.templatemonster.com
  15. 15. Mobile UX Consideration in Scenarios © Harbinger Systems | www.harbinger-systems.com • Web - Situational/Environmental consideration is secondary, mostly inside the door. • Mobile - Situational/Environmental parameters are primary focus. This affects most of the elements on the interface.
  16. 16. Mobile UX Consideration in Task-flow © Harbinger Systems | www.harbinger-systems.com Home Page Category Article Related Article (Target) Home Page (Instant Search) Search Results Article (Target)
  17. 17. Mobile UX Consideration in Wireframes © Harbinger Systems | www.harbinger-systems.com Consider Gestures Orientation Change Operating systems constraints
  18. 18. Mobile UX Consideration in Visual design © Harbinger Systems | www.harbinger-systems.com Device Anatomy Device Resolutions Touch /Tappable area
  19. 19. Mitigate Common Challenges © Harbinger Systems | www.harbinger-systems.com
  20. 20. Mitigate Common Challenges Challenge - Break Journey of Gestures from Wireframes to visual design How to mitigate • Clear gestures definition in the wireframes. Along with annotations. • All Wireframes on cloud at one place with all review comments © Harbinger Systems | www.harbinger-systems.com
  21. 21. Mitigate Common Challenges Challenge - Losing on Interaction and Animation defined in visual design when transferred to development • Give the reference sites and app to developers while sharing the animation idea • Use of simulator tool for walkthrough. Pop app gives you gestures and transition effect experience. © Harbinger Systems | www.harbinger-systems.com
  22. 22. Mitigate Common Challenges • User experience defined wireframes and visual design getting implemented partially/differently • Feasibility issue comes in to picture at later stages • Gaps in Wireframe, Visuals and Functional App © Harbinger Systems | www.harbinger-systems.com How to mitigate these problems? Wireframe Visual Design Live App Collaboration
  23. 23. Collaboration is Required • But When at different stages of process • For What bridging the gap between all roles • How meeting, walkthroughs, annotating and taking balance decision © Harbinger Systems | www.harbinger-systems.com
  24. 24. Brief Process Stages Persona Scenario Task flow Wireframes Visual design Usability Study Development © Harbinger Systems | www.harbinger-systems.com StakeholderUX Designer UX Designer UI Designer UX Designer Developer UI Designer UI Designer Developer UI Designer, Stakeholder and Developer UX Designer UI Designer UX Designer
  25. 25. Rich User Experience Parameters • We have seen contributors in User experience • UX consideration on mobile/touch devices • Challenges and mitigation to it Now We will talk about Rich User Experience and its parameters © Harbinger Systems | www.harbinger-systems.com
  26. 26. Rich User Experience © Harbinger Systems | www.harbinger-systems.com Rich User Experience also comes with Interaction Gestures Animations and inbuilt functionality (Camera, Maps, Social)
  27. 27. Examples of Interactions © Harbinger Systems | www.harbinger-systems.com
  28. 28. Examples of Gestures © Harbinger Systems | www.harbinger-systems.com
  29. 29. Examples of Animations © Harbinger Systems | www.harbinger-systems.com
  30. 30. Examples of Inbuilt Features © Harbinger Systems | www.harbinger-systems.com
  31. 31. Summary © Harbinger Systems | www.harbinger-systems.com User Experience contributors UCD approach for mobile Rich User Experience Collaboration between contributors
  32. 32. Special Offer © Harbinger Systems | www.harbinger-systems.com One hour of free consultation for mobile UX by Harbinger for all the attendees today Write to us at hsplinfo@harbingergroup.com to avail this exciting opportunity.
  33. 33. Q&A © Harbinger Systems | www.harbinger-systems.com
  34. 34. Special Offer © Harbinger Systems | www.harbinger-systems.com One hour of free consultation for mobile UX by Harbinger for all the attendees today Write to us at hsplinfo@harbingergroup.com to avail this exciting opportunity.
  35. 35. Thank You! Visit us at: www.harbinger-systems.com Write to us at: hsplinfo@harbingergroup.com Blog: blog.harbinger-systems.com Twitter: twitter.com/HarbingerSys (@HarbingerSys) Slideshare: slideshare.net/hsplmkting Facebook: facebook.com/harbingersys LinkedIn: linkedin.com/company/382306 © Harbinger Systems | www.harbinger-systems.com

×