Post on 20-Jan-2015
description
Mobile UX
User Experience : Why the mobile space is important?
Naga ChokkanathanDirector, InnovationNov 2012
www.crmit.com © CRMIT 2012
Mobile UX
About CRMIT
• Pioneers in SaaS based CRM services and early adopters of Oracle Cloud
• 800+ man years of deployment, implementation & migration expertise
• 200+ certified CRM consultants
• 175+ successful CRM / CX deployments including custom development and integration
• 100+ CRM training engagements globally
• 20+ countries with on site support presence
• CRM++ PC & Mobile applications for accelerated deployments (3000+ user base)
www.crmit.com © CRMIT 2012
Mobile UX
Safe Harbor Statement
• This is not a session on UX design, Nor I am qualified to do one such session
• As a designer, developer and consumer of mobile apps, I have• Tried visualizing my apps in hands of an user• Arrived at best practices minimally required
• UX is NOT just “Good To Have“• A good mobile app with poor UX is outright
being rejected by people• they have enough choices
www.crmit.com © CRMIT 2012
Mobile UX
Must Have? Really?
• Imagining / Designing good UX is difficult• Agreed!
• Unfortunately, Realizing bad UX is very easy• People are doing it
everyday!• Even Kids!
www.crmit.com © CRMIT 2012
Mobile UX
So, What is UX?
• Before we get to that,• UX is different from UI
• I googled for it• User Interface design is the part of the
product that faces the user when he looks at the site, and the User Experience is how they feel when they look at the site
• Hmmm, Forget it, we need a simpler example!
www.crmit.com © CRMIT 2012
Mobile UX
UX Vs UI
UI = Cycle, Handle Bar, Seat, Pedal, Wheels, Water Bottle, MP3 Player etc.,
www.crmit.com © CRMIT 2012
Mobile UX
Continuous Cycle
• Before• During• After
• Every Cycle Enforces Our Views About The Product• Positive, Or• Negative
www.crmit.com © CRMIT 2012
Mobile UX
UX Vs UI : @ Mobile Apps
• User’s perceptions and feelings• Before, during and after their interaction with
your mobile presence
www.crmit.com © CRMIT 2012
Mobile UX
Mobile UX
• Creating mobile user experiences that delight users• Can't redo whatever available in desktop
• Don't Shrink, Rethink : Nokia• Example:
• Paper Survey Vs• Website Survey Vs• Mobile Survey
www.crmit.com © CRMIT 2012
Mobile UX
Mobile UX (2)
• Mobile has much more to offer in terms of hardware, software features• Example: GPS, Accelerometer, Apps
• We need to use them, but not for the sake of using them• What do we mean by THAT?
www.crmit.com © CRMIT 2012
Mobile UX
Mobile UX (3)
• Example: GPS• Vehicle insurance scenario• Courier Delivery scenario• Or, Easy to imagine, FourSquare / Facebook
Checkin• Example: Accelerometer
• Shake to Undo• Shake to Clear the drawing surface
• Match the experience expected, with the features available, not the other way
www.crmit.com © CRMIT 2012
Mobile UX
Mobile UX Considerations
• Device types / Features• Screens• Input mechanisms (Touch / Non Touch etc.,)• Connectivity• User Types• Technology• More…
www.crmit.com © CRMIT 2012
Mobile UX
UX Design Points
• Appearance: How it looks• Interaction: How I access it• Information: What it is• Structure: How it is presented• Conceptual Model: Whether it makes
sense to me• Value: Whether it matters to me
(From "User Experience Workshop" By Motivate Design)
www.crmit.com © CRMIT 2012
Mobile UX
UX Design Points (2)
• Good News, These 6 Design Points apply to anything• Games• Productivity Apps• Information Apps• Enterprise Apps• Even Entertainment Apps!
www.crmit.com © CRMIT 2012
Mobile UX
UX Design Points (3)
• Example: Espn Cricinfo Mobile App• How it looks?• How I access it?• What it is?• How it is presented?• Whether it makes sense to me?• Whether it matters to me?
www.crmit.com © CRMIT 2012
Mobile UX
Few Guidelines
• Identify your users, how things work from their angle
• Filter features, based on mobile relevance
• Use mobile features (Hardware, software) as applicable / available• Example: "Call Us" Button
along with Phone number• But at the same time, Take care
of the “minimal configuration” scenario
www.crmit.com © CRMIT 2012
Mobile UX
Few Guidelines (2)
• Optimize Content• 500+ different screen sizes
• Easy to Read, and Easy to Tap• Hei, I didn’t click THAT!
• Use Task Based Design• Focus on number of clicks (or
taps) required to get something done
• Allow easy search / filter• Time Is Precious!
www.crmit.com © CRMIT 2012
Mobile UX
Few Guidelines (3)
• Design For Interruption• Give control to users
• Example: Skip Introduction, Visit a full website (Wordpress)
• Use a prototyping development model• Experiment with Easy to build, Okay to
fail models such as HTML, before you develop native apps
• Get feedback from pilot group, rework
www.crmit.com © CRMIT 2012
Mobile UX
Few Guidelines (4)
• If using Advertisements, think of "Engagement Quotient“• More engaged users are, more true
clicks you get• Glanceability• Visual Consistency
• Across Mobile, Tablet, Web, Print etc.,• Provide Feedback• Make Actions Reversible
www.crmit.com © CRMIT 2012
Mobile UX
Few Guidelines (5)
• Limit inputs / Typing• Use Analytics to reveal mobile behaviors• Listen to your users
• Direct / Indirect feedback• Usage Logs• Crash reports• Uninstall statistics
• Keep Reviewing / Reworking your design!
www.crmit.com © CRMIT 2012
Mobile UX
Mobile First
• If you design mobile first, you create agreement on what matters most
• You can then apply the same rationale to the desktop version of the website
• We agreed that these were the most important features and content for our customers and business, why should that change with more screen space?
Luke Wroblewski
www.crmit.com © CRMIT 2012
Mobile UX
References
• The Elements Of The Mobile User Experience By Lyndon Cerejo
http://mobile.smashingmagazine.com/2012/07/12/elements-mobile-user-experience/
• Mobile First By Luke Wroblewski http://www.lukew.com/resources/mobile_first.asp
• User Experience Workshop By Motivate Design
http://www.slideshare.net/Motivate_Design/user-experience-workshop
• Ten Tips For Mobile UX By Alex Sbardella http://www.redant.com/articles/ten-tips-for-mobile-ux
• Task Based User Interface Design By Martijn Van Weliehttp://www.welie.com/papers/Welie-PhD-thesis.pdf
www.crmit.com © CRMIT 2012
Mobile UX
Image Credits
• http://www.apple.com/• https://foursquare.com/• http://delightcircle.com/• http://www.twitter.com/• http://www.lukew.com/• http://www.flickr.com/photos/kowitz/4177587044/• http://www.flickr.com/photos/mobikefed/433911702/• http://www.flickr.com/photos/14degrees/6036499491/• http://www.flickr.com/photos/alltheaces/2417204812/• http://www.flickr.com/photos/bodhack/3361470968/• http://www.pinterest.com/• http://en.wikipedia.org/wiki/File:M%C3%B6bius_strip.jpg• http://commons.wikimedia.org/wiki/File:Imovelwebmobile.jpg