Mais conteúdo relacionado Semelhante a Mobile UX (20) Mais de Naga Chokkanathan (20) Mobile UX2. 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)
Mobile UX www.crmit.com
© CRMIT 2012
3. 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
Mobile UX www.crmit.com
© CRMIT 2012
4. Must Have? Really?
• Imagining / Designing
good UX is difficult
• Agreed!
• Unfortunately, Realizing
bad UX is very easy
• People are doing it
everyday!
• Even Kids!
Mobile UX www.crmit.com
© CRMIT 2012
5. 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!
Mobile UX www.crmit.com
© CRMIT 2012
6. UX Vs UI
UI = Cycle, Handle Bar,
Seat, Pedal, Wheels,
Water Bottle, MP3
Player etc.,
Mobile UX www.crmit.com
© CRMIT 2012
7. UX Vs UI
UX = Feeling you get
from cycling
Mobile UX www.crmit.com
© CRMIT 2012
8. Continuous Cycle
• Before
• During
• After
• Every Cycle Enforces
Our Views About The
Product
• Positive, Or
• Negative
Mobile UX www.crmit.com
© CRMIT 2012
9. UX Vs UI : @ Mobile Apps
• User’s perceptions and feelings
• Before, during and after their interaction with
your mobile presence
Mobile UX www.crmit.com
© CRMIT 2012
10. 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
Mobile UX www.crmit.com
© CRMIT 2012
11. 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?
Mobile UX www.crmit.com
© CRMIT 2012
12. 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
Mobile UX www.crmit.com
© CRMIT 2012
13. Mobile UX Considerations
• Device types / Features
• Screens
• Input mechanisms (Touch / Non Touch etc.,)
• Connectivity
• User Types
• Technology
• More…
Mobile UX www.crmit.com
© CRMIT 2012
14. 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)
Mobile UX www.crmit.com
© CRMIT 2012
15. UX Design Points (2)
• Good News, These 6 Design Points apply
to anything
• Games
• Productivity Apps
• Information Apps
• Enterprise Apps
• Even Entertainment Apps!
Mobile UX www.crmit.com
© CRMIT 2012
16. 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?
Mobile UX www.crmit.com
© CRMIT 2012
17. 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
Mobile UX www.crmit.com
© CRMIT 2012
18. 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!
Mobile UX www.crmit.com
© CRMIT 2012
19. 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
Mobile UX www.crmit.com
© CRMIT 2012
20. 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
Mobile UX www.crmit.com
© CRMIT 2012
21. 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!
Mobile UX www.crmit.com
© CRMIT 2012
22. 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
Mobile UX www.crmit.com
© CRMIT 2012
23. References
• The Elements Of The Mobile User Experience By
Lyndon Cerejo
http://mobile.smashingmagazine.com/2012/07/12/ele
ments-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 Welie
http://www.welie.com/papers/Welie-PhD-thesis.pdf
Mobile UX www.crmit.com
© CRMIT 2012
24. 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
Mobile UX www.crmit.com
© CRMIT 2012
25. Thank You
Mobile UX 25 www.crmit.com
© CRMIT 2012