Designing Mobile Apps with Empathy - Why to create more accessible Mobile Apps

734 views

Published on

Designing w/ Empathy
- Why to create more accessible Mobile Apps (Star War Lego style!)
March 27 @ Conestoga College (Doon Campus)
AODA + Accessibility Seminar

Published in: Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
734
On SlideShare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Thanks for some promotional support
  • Why should listen to me? Well you shouldn’t. You should actually listen to my mentor Steve Krug (pronounced Kroog, like the street in Waterloo) who wrote two amazing books Don’t Make Me Think and Rocket Surgery Made Easy. His common sense approach style I find really resounds with developers. But since we can’t have Steve here, you’re stuck with me. I’ll try to do my best impression of him.Chapter 12A11y intro in 9 pages!4x Action items to improve #A11y
  • But do you really actually know Steve? Yes I do and I have evidence. Can anyone place the location of the photo on the left? Well it’s at a bar in the Drake Hotel in Toronto. In 2012 I heard Steve speak and then I got meet and work with a little afterwards. After that we kept in contact and traded ideas about UX + Mobile. Just this new year, Steve sent me a belated X-mas present, it was a hot off the press copy of new 3rd Edition of Don’t Make Me Think. Turns out without telling me he added me to his Acknowledgements page which is really very humbling. The book is currently #1 on Amazon in the Usability section and previous editions sold over 400,000 copies and was translated into 20 languages. It’s honestly the first UX book I recommend to anyone to read when getting into UX.
  • Still don’t believe I know anything about mobile? Well this is a picture of my desk in my office in Toronto a few weeks back. I’ve been told my lock-up draw is a little like ‘loading room’ in the matrix where Neo and Trinity stock-up before the final showdown. I have the awesome privilege to work just about every mobile device there is out there.
  • So what does SAP, a big Germany company know about mobile? Well this slide jus shows you the mobile B2B apps we have.
  • On the Google Play Android App Store SAP has 39+ apps for download.
  • On the Apple App Store SAP has 45+ apps for download.
  • On the Blackberry World App Store SAP has 30+ apps for download.
  • So as I’ve told Meyer before I was to share some tips and tricks from SAP, but I don’t want to impose our way of doing things to lighter weight more agile start-ups and student projects. Below is a list of ACC requirements we have to meet internally before we can even ship mobile apps. This is kind of boring, so I’m hoping to come at this from a different direction.
  • Let’s talk about Accessibility or A11y
  • When I talk about Accessibility, I’m not just talking about how people can get your apps from the various app stores.
  • While we’re on the top of App Stores, if you’re making a consumer-type mobile apps, let me show you some math. For every 1-star rating you get, you need seven 5-star rates just to average out 4.5 start rating! Wow. So keep that in mind.
  • So let’s talk a top near to me heart. Who hear has watched Star Wars movie? Who hear has heard about Start wars? OK, well the rest of you guys can tune-out. I’ve just made my presentation inaccessible to you! Just kidding.
  • So if you are familiar with Star Wars, there are these clone troopers, who are all genetic copies of a bounty hunter JangoFett. They turn out to the bad guys. Then there are the Jedi Knight who are the good guys. I’m going to suggest as human, we’re not clones, we are more like Jedi!
  • So clone troopers are exactly identical. They get the same armour an same blasters. They tried identically. On the other hand, Jedi basically make their light-saber, which is unique to each Jedi. Some have different colours and are often made from different crystals that they find themselves. Fun fact is that a Light Saber isn’t a true line, but actually a loop that Jedi knight help contain. That’s why it doesn’t blast off into space like a laser beam from a blaster!
  • So what about the 7 Billion people on earth? Let’s talk about Human variability. Hopefully you can understand how we are all so different and why we might need empathy for those differences.
  • So what does Empathy mean? Enough from me. I’m going to show you this video from Cleveland Clinic which it by far the best explanation of empathy I’ve seen so far.
  • So back great books, Whitney Quesenbery and Sarah Horton have an awesome book from Rosenfeld media on Accessibility called a Web for Everyone. They were really gracious enough to also help tweeting about this event!
  • One of things I learned from them (and is available free online at the link below) is the concept of personas. These humanize the laundry list of Accessibility requirements and it’s these types of Personas that I base the actual testing plans on. These were three that I found really resounded with me for mobile.CHW – Community Health Workerhttp://rosenfeldmedia.com/books/a-web-for-everyone/resources/
  • So I’ve seen the above image make it’s way around the inter-web and social media. It’s a great way to explain Equality and Equity. I believe that with accessibility were talking about ‘fairness’. We want equity so all people can enjoy our apps equally.
  • So I found these four principles great pillars when deciding what to do about accessibility of apps. All users want to be able to use your app equally.
  • So back to empathy. Steve says that in his chapter about Accessibility the first step is really making apps more usable. Overall more simple and easy to understand apps generally lend themselves being more accessible to start with. With Accessibility is one area, I believe in making great apps starts with having true empathy for the user, all users. I believe one way to simply what empathy for users means is look at ‘respect’ in the following 5 areas. I’m going go through these areas and give one particular example for each. While using an app for an example, please be aware I’m not endorsing the overall usability or accessibility of the app, but rather tried to find the best example to prove the illustration.
  • We are out of timeMakes wait, silly loading && splash screenTake up too memory or processing power waste my time w/ awkward navigationWastes my time learning new interaction
  • CHW – Community Health Workerhttp://rosenfeldmedia.com/books/a-web-for-everyone/resources/
  • Font too small or not resizableTouch item too small to tapOnly work online aren’t accessibleDo we want see others struggle?This is one of the reasons I think every dev team should do usability testingIt may look good, but it may not be usable
  • CHW – Community Health Workerhttp://rosenfeldmedia.com/books/a-web-for-everyone/resources/
  • We all are different and we all have different tastes and opinions. They say you can’t please all the people all the time, but we think you can try with settings and configuration.
  • CHW – Community Health Workerhttp://rosenfeldmedia.com/books/a-web-for-everyone/resources/
  • Look around you. I took this picture from a conference a few years back. See how many people are looking at the speaker? We’re all busy and connected these days. Good apps respect my priorities and let me do the things I need to get done first and most important to me.
  • CHW – Community Health Workerhttp://rosenfeldmedia.com/books/a-web-for-everyone/resources/
  • 1 in 5 Americans identified themselves as victims of ID theft. You only need to look at the fall Bitcoins&& Mt.Gox as an example of where companies don’t take security seriously enough. If not out of courtesy, then out of respect and empathy we need to make our apps secure. Even if the user never knows about or is aware about it, we need to do this.http://www.nbcnews.com/id/8409283/ns/technology_and_science-security/t/just-how-common-id-theft/
  • CHW – Community Health Workerhttp://rosenfeldmedia.com/books/a-web-for-everyone/resources/
  • On Android the built-inText-to-Speech is called Talkback
  • On Android the built-inText-to-Speech is called VoiceOver. This is the one I’m gong to trying to demo to you today.
  • On Backberry the built-inText-to-Speech is called ScreenReader
  • CHW – Community Health Workerhttp://rosenfeldmedia.com/books/a-web-for-everyone/resources/
  • Designing Mobile Apps with Empathy - Why to create more accessible Mobile Apps

    1. 1. Wayne Pau (@Wayne_Pau) Emerging Technologies March 27, 2014 Designing with Empathy
    2. 2. My Apology Slide “If I'm curt with you it's because time is a factor. I think fast, I talk fast and I need you guys to act fast if you wanna get out of this. So, pretty please... with sugar on top…” - Winston Wolfe (Pulp Fiction)
    3. 3. Steve Krug @skrug
    4. 4. Finance HR Manufacturing Supply Chain and Procurement Service LOB Apps Information Technology Sales Analytics SAP Cart Approval SAP Sanctioned- Party List SAP Transport Notification and Status SAP Transport Tendering SAP Inventory Manager* SAP BusinessObjects Explorer SAP BusinessObjects Mobile SAP Strategy Management SAP Employee Lookup SAP HR Approvals SAP Interview Assistant SAP Learning Assistant SAP Leave Request SAP Manager Insight SAP Timesheet SAP Travel Receipt Capture* SAP Travel Expense Approval* SAP Travel Expense Report* SAP Work Manager* SAP CRM Service Manager* SAP Replication Manager SAP TDMS Manager SAP User Experience Monitor SAP IT Change Approval SAP IT Incident Management SAP System Monitoring SAP WorkDeck SAP NetWeaver Portal TwoGo by SAP SAP Customer and Contacts SAP Customer Briefing SAP Customer Financial Fact Sheet* SAP ERP Order Status SAP Material Availability SAP Sales Order Notification SAP ERP Quality Issue SAP EHS Safety Issue SAP Inventory Manager SAP Visual Enterprise Viewer SAP Work Manager* SAP Rounds Manager SAP CRM Service Manager* SAP Customer Financial Fact Sheet* SAP GRC Access Approver* SAP GRC Policy Survey SAP Payment Approvals SAP Real- Spend SAP Travel Expense Approval* SAP Travel Expense Report* SAP Travel Receipt Capture* SAP Sales Diary SAP Receivables Manager TwoGo by SAP SAP NetWeaver Portal SAP Account Intelligence SAP Sales Manager SAP Fiori SAP Fiori SAP Fiori SAP Sales Companion SAP Sales Pipeline Simulator
    5. 5. 45+ Apps
    6. 6. 39+ Apps
    7. 7. 30+ Apps
    8. 8. SAP’s #A11y req list • 38x req (Android) • 41x req (iOS)
    9. 9. AccessibilityA11y
    10. 10. App “Ratings” Math 1x 7x 4.5
    11. 11. We are not clones…
    12. 12. VS. Clone Jedi
    13. 13. VS. Clone Jedi
    14. 14. 18© 2014 SAP AG or an SAP affiliate company. All rights reserved. • Non-related == Δ1.2K-1.5K DNA bases • 3M+ difference between you && someone else • DNA testing 1:1,000,000,000 (non-related) • DNA testing 1:1000 (id twins) • Even ID twins ~360 genetic diff/mutations Human Variability
    15. 15. Empathy http://www.youtube.com/wat ch?v=cDDWvj_q-o8
    16. 16. Whitney Quesenbery Sarah Horton @whitneyq @gradualclearing
    17. 17. #A11y personas • Vishnu - an eng. and global citizen with low vision • Maria - a bilingual CHW and mobile phone user • Carol - a grandmother with macular degeneration (https://rosenfeldmedia.com/books/a-web-for-everyone/)
    18. 18. Clone Jedi http://inclusiveactioneverydaylives.wordpress.com/2013/05/ 28/a-picture-speaks-a-thousand-words-4/
    19. 19. 23© 2014 SAP AG or an SAP affiliate company. All rights reserved. • Dignity • Independence • Integration • Equal Opportunity 4 Principles of A11y
    20. 20. Empathy Respect… 1. Time && Resources 2. Limitation && Weaknesses 3. Tastes && Uniqueness 4. Priorities 5. Privacy && Security
    21. 21. Time && Resources
    22. 22. iPhone Screenlock Camera
    23. 23. Limitations && Weaknesses
    24. 24. Multi Size Text Support
    25. 25. Tastes && Uniqueness
    26. 26. IFTT Automation
    27. 27. Priorities
    28. 28. Gmail Categories
    29. 29. Privacy && Security
    30. 30. SAP Mobile Documents
    31. 31. // How it ‘really’ happens You.CARE(end.USER);
    32. 32. Android - TalkBack
    33. 33. iOS - VoiceOver
    34. 34. BB10 - ScreenReader
    35. 35. SP - Scale Independent Pixels http://developer.android.com/design/style/typography.html
    36. 36. Accessible App Non- Accessible App
    37. 37. © 2014 SAP AG or an SAP affiliate company. All rights reserved. Thank you Contact information: Wayne Pau (wayne.pau@SAP.com) Development Architect – CD&SP Twitter: @Wayne_Pau Blog: http://waynepau.blogspot.ca/

    ×