Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Field-tested interfaces for the next billion

Field-tested interfaces for the next billion

This talk was given at Front Trends in Warsaw, 24 May 2017. "The next billion” is a phrase bandied around a lot these days. Connected smart phones are bringing computing and the internet to many people who are now learning to use digital interfaces for the first time – people all over the globe; from West Africa to India to Brazil. Serving these users is both an economic opportunity and an ethical imperative.

So what does this actually mean in practice? How does someone who’s been introduced to technology through a second-hand cheap Blackberry knock-off powered by a car battery respond to these new and shiny ways of interacting with machines? What effects do unreliable power and intermittent internet have on the user experience? How can we make sure that keeping up with the cutting edge won’t alienate the people in these fast-growing emerging economies who are just starting to get into the web?

In this talk we’ll go through examples from working with novice tech users in resource-constrained environments, and discover how they navigate apps, comprehend interfaces, input data, and understand screen flows. You’ll learn how certain UI patterns, animations, and navigation conventions hinder or help, and leave with an understanding of how to include these millions of new users in your product thinking.

Ally Long

May 24, 2017
Tweet

More Decks by Ally Long

Other Decks in Technology

Transcript

  1. Field-tested interfaces for
    THE NEXT BILLION
    ! @allyelle

    View Slide

  2. View Slide

  3. View Slide

  4. Europe
    80% connected

    View Slide

  5. View Slide

  6. USA
    75% connected

    View Slide

  7. View Slide

  8. Australia
    85% connected

    View Slide

  9. View Slide

  10. Canada
    88% connected

    View Slide

  11. View Slide

  12. Mexico & Brazil
    50% connected

    View Slide

  13. View Slide

  14. South Asia
    24% connected

    View Slide

  15. View Slide

  16. Sub-Saharan Africa
    22% connected

    View Slide

  17. View Slide

  18. View Slide

  19. Serving these users is the right thing to do

    View Slide

  20. 1 billion new users = 1 billion potential new
    customers

    View Slide

  21. It benefits everyone

    View Slide

  22. Empathy

    View Slide

  23. Empathy is bullshit !

    View Slide

  24. It’s hard to know what you don’t know

    View Slide

  25. Who am I anyway?

    View Slide

  26. I'm Ally Long
    @allyelle

    View Slide

  27. I’m a product designer and front-end developer

    View Slide

  28. View Slide

  29. View Slide

  30. View Slide

  31. View Slide

  32. View Slide

  33. View Slide

  34. View Slide

  35. View Slide

  36. View Slide

  37. View Slide

  38. Practical tips

    View Slide

  39. The typical user...

    View Slide

  40. There isn't one ¯\(ϑ)/¯

    View Slide

  41. Typical devices

    View Slide

  42. View Slide

  43. View Slide

  44. Anxid
    → Huawei
    → Lenovo
    → LG
    → Samsung (if you're fancy) !
    → Apple (if you're reeeeeally fancy)

    View Slide

  45. Condition
    → scratched up screens
    → glare protection films
    → big rugged cases

    View Slide

  46. View Slide

  47. Make sure Opera Mini is part of your testing process

    View Slide

  48. Connectivity

    View Slide

  49. Connectivity
    → remote and rural areas have very little cellular
    coverage
    → even in built-up areas and cities, network
    coverage is often poor
    → broadband internet / wifi very uncommon
    → data is still expensive

    View Slide

  50. Latency

    View Slide

  51. Optimise for responsive UIs
    → Don't tie UI elements to long-running operations
    such as network requests
    → Don’t block navigation
    → Loading indicators (spinners, progress bars)
    should be inline

    View Slide

  52. Difficult to charge
    Finding a working power source is not always easy

    View Slide

  53. View Slide

  54. View Slide

  55. Charging is slow
    → A diesel generator takes around
    two hours to charge a
    smartphone
    → Solar power takes 4-5 hours to
    charge a smartphone

    View Slide

  56. Phones off

    View Slide

  57. Touch screens are easier
    to use than laptops

    View Slide

  58. View Slide

  59. Gestures...

    View Slide

  60. ¯\(ϑ)/¯

    View Slide

  61. Where's it at?
    If elements are offscreen, they're not
    discoverable.

    View Slide

  62. View Slide

  63. View Slide

  64. Avoid concealed elements in general

    View Slide

  65. View Slide

  66. View Slide

  67. View Slide

  68. Proper affordance
    → make the buttons and actions bigger, clickier,
    more obvious
    → clear labelling
    → combine icons with labels

    View Slide

  69. View Slide

  70. What does this do?

    View Slide

  71. View Slide

  72. Animations

    View Slide

  73. Animations in form elements = !

    View Slide

  74. Animations to describe spatial model = ❤

    View Slide

  75. View Slide

  76. View Slide

  77. View Slide

  78. Consistency

    View Slide

  79. A consistent UI helps people learn and memorise

    View Slide

  80. Make it fun

    View Slide

  81. View Slide

  82. Steal!

    View Slide

  83. Ok fine. Borrow.
    → Facebook
    → Whatsapp
    → Gmail

    View Slide

  84. View Slide

  85. Process

    View Slide

  86. Adjust your design / dev processes to include in-
    person usability testing in these markets.

    View Slide

  87. Assemble a diverse team
    with local partners

    View Slide

  88. Keep calm and just shut up

    View Slide

  89. Give up control of the situation

    View Slide

  90. Document everything, and quickly

    View Slide

  91. To summarise...

    View Slide

  92. Be curious, have empathy.

    View Slide

  93. But do the research.

    View Slide

  94. African tech consumers
    are demanding and
    informed

    View Slide

  95. They want clear and
    reliable mobile solutions

    View Slide

  96. The same things matter

    View Slide

  97. Communication, connection, economic opportunity.

    View Slide

  98. View Slide

  99. View Slide

  100. View Slide

  101. View Slide

  102. View Slide

  103. Strip everything back to
    the essentials

    View Slide

  104. Know your users

    View Slide

  105. Be Curious

    View Slide

  106. “The Next Billion”
    is the future of the internet

    View Slide

  107. Thank you
    ! @allyelle

    View Slide