O slideshow foi denunciado.
Utilizamos seu perfil e dados de atividades no LinkedIn para personalizar e exibir anúncios mais relevantes. Altere suas preferências de anúncios quando desejar.

A Web of Anxiety: Accessibility for people with anxiety and panic disorders

594 visualizações

Publicada em

Examines how UI/UX design can contribute to feelings of anxiety and panic and explores how to improve accessibility for people with anxiety and panic disorders.

Publicada em: Tecnologia

A Web of Anxiety: Accessibility for people with anxiety and panic disorders

  1. 1. A web of anxiety: Accessibility for people with anxiety and panic disorders David Swallow Accessibility Engineer @davidofyork
  2. 2. Who am I? David SwallowAccessibility Engineer at The Paciello Group Formerly, academic researcher in human-computer interaction at the University of York, UK PhD in computer science, investigating how to support web developers in creating accessible websites Prior to that, a web developer, building usable and accessible websites for estate agents
  3. 3. What are anxiety and panic disorders?  A range of mental illnesses, characterised by excessive feelings of fear, apprehension, and dread - Social anxiety disorder: intense fear of being embarrassed, humiliated, or judged negatively by others in a social or work setting - Claustrophobia: fear of confined spaces - Agoraphobia: fear of being in a situation that would be difficult to escape from - Health anxiety: preoccupation with the idea that you have (or will have) a physical illness  Panic disorders: sudden, frequent, and intense feelings of panic or fear, sometimes for no clear reason
  4. 4. Social media poll of anxiety triggers
  5. 5. Method  Challenging to find people who are willing to talk about anxiety and panic disorders - Very sensitive subject, people are (understandably) reluctant to discuss it  Asked about it on discussion forums, message boards and social media  Talked with several people with anxiety and panic disorders about aspects of UI/UX design that contribute to feelings of anxiety and panic Image from Véronique Debord-Lazaro on Flickr Licence: CC BY-SA 2.0
  6. 6. Anxiety-related resources  Addressing Trauma and Stressor Related Disorders Thaddeus Cambron https://youtu.be/W8uVtwHBzbg www.w3.org/TR/WCAG21/  Building inclusive products for vulnerable customers David Caldwell https://youtu.be/e8qUCi-lqVo
  7. 7. More anxiety- related resources  Web Content Accessibility Guidelines 2.1 by the W3C www.w3.org/TR/WCAG21/  Inclusive Design Principles by The Paciello Group inclusivedesignprinciples.org  Designing for users with anxiety by the UK Home Office accessibility.blog.gov.uk/2016/09/02/dos-and- donts-on-designing-for-accessibility/
  8. 8. Urgency
  9. 9. Booking.com example
  10. 10. Ticketmaster example
  11. 11. Netflix example
  12. 12. BBC iPlayer example
  13. 13. 2FAexample “I find 2FA kind of stressful. ‘Enter this code!’ and watching the timeout tick down”
  14. 14. Stop the clock! Image from pngimg.com Licence: CC 4.0 BY-NC
  15. 15. Home Office Poster 1Do give users enough time to complete an action Do not rush users or set impractical time limits
  16. 16. WCAG 2.1 (Urgency)  2.2.1 Timing Adjustable (Level A)  2.2.6 Timeouts (Level AAA)
  17. 17. Netflix solution example
  18. 18. BBC iPlayer solution example
  19. 19. Unpredictability
  20. 20. Opt-out marketing checkbox example
  21. 21. Poor form example
  22. 22. Confirmation page example
  23. 23. Instagram Like feature example“I didn’t mean to ‘like’ it, but will I look weird or like a stalker if I leave it? Or will I look rude if I remove it? … I find Instagram immensely stressful.”
  24. 24. Read receipts example “You’re left wondering, have they read my message? Why aren’t they replying? Did I say something to upset them? Then you obsess over what you’ve written, trying to figure out if they could have misinterpreted it”
  25. 25. Manage expectations Image from pngimg.com Licence: CC 4.0 BY-NC
  26. 26. Simple form solution example
  27. 27. Home Office Poster 2 Don’t leave users confused about next steps or timeframes Do explain what will happen after completing a service Do make important information clear Don’t leave users uncertain about the consequences of their actions
  28. 28. WCAG 2.1 (Unpredictability)  3.3.2 Labels or Instructions (Level A)  1.3.5 Identify Input Purpose (Level AA)  3.2.3 Consistent Navigation (Level AA)  3.2.4 Consistent Identification (Level AA)
  29. 29. Inclusive Design Principles (Unpredictability)  Be consistent Use familiar conventions and apply them consistently
  30. 30. Powerlessness
  31. 31. Facebook deactivation example
  32. 32. Targeted advertising “A lot of my particular anxieties came into full swing when I learned more about how online advertising works. When I noticed Facebook ‘Like’ buttons on unrelated pages and when ads follow me around. The feeling that I had no privacy was claustrophobic and has led to so many anxiety attacks I have lost count”.”
  33. 33. Remove (or apply) friction Image from veggiefrog on Flickr Licence: CC BY-SA 2.0
  34. 34. Home Office Poster 3Don’t make support or help hard to access Do give users the support they need to complete a service
  35. 35. Inclusive Design Principles (Powerlessness)  Prioritise content Help users focus on core tasks, features, and information by prioritising them within the content and layout  Give control Ensure people are in control. People should be able to access and interact with content in their preferred way
  36. 36. Home Office Poster 4Don’t leave users questioning what answers they gave Do let users check their answers before they submit them
  37. 37. WCAG 2.1 (Powerlessness)  3.3.4: Error Prevention (Legal, Financial, Data) (Level AA)  3.3.6 Error Prevention (All) (Level AAA)
  38. 38. Monzo app example www.monzo.com/blog/2017/01/27/designing-product-mental-health-mind
  39. 39. Sensationalism
  40. 40. Fake news “Scaremongering and bias are sadly something our media are built on. Bias and negative skewed thinking is already a problem with anxiety or depression, so to be led into panic through over the top and biased, often speculative garbage parading as news is a common problem.”
  41. 41. Are men being ’nagged to death’? Stress really DOES turn your hair grey! CHILLAX ON HOL IS 'DEADLY' Lavender scent may help with anxiety
  42. 42. NHS poster example
  43. 43. Keep it real
  44. 44. HealthNewsReviews.org example
  45. 45. Mind guide example www.mind.org.uk/news-campaigns/minds-media-office/how-to-report-on-mental-health
  46. 46. NHS Choices example www.nhs.uk/news
  47. 47. Out of darkness
  48. 48. Deceived by Design  Report from the Norwegian Consumer Council  Documents the “deceptive” and “manipulative” techniques that companies use to nudge users towards disclosing as much information as possible  Describes the use of dark patterns and privacy-intrusive default settings by Facebook, Google and Microsoft as “unethical”, “misleading” and “exploitative” fil.forbrukerradet.no/wp-content/uploads/2018/06/2018- 06-27-deceived-by-design-final.pdf
  49. 49. Competition and Markets Authority  Expedia, Booking.com, Agoda, Hotels.com, ebookers and trivago investigated by UK Competition and Markets Authority over high- pressure selling tactics  The companies have all now agreed to not give a false impression of a hotel's popularity to rush customers into making a booking  The CMA will now seek to make the rest of the sector follow the same rules
  50. 50. Pattern library example www.designpatternsformentalhealth.org
  51. 51. Any questions? David Swallow Accessibility Engineer @davidofyork

×