Designing for web 3 - Speaker Deck

Designing for web 3

by Donna Spencer

Slide 1

Slide 1 text

Designing for Web 3 Donna Spencer, YOW! Perth, Sep 2022

Slide 2

Slide 2 text

About me Principal Product Designer at MakerX 20+ years of design experience Author of 5 UX books @maadonna Linkedin: Donna Spencer At MakerX we design and build products for ventures and startups.

Slide 3

Slide 3 text

How we’ll do this About web 3 Designing in transition UX fundamentals Web 3 now Web 3 design

Slide 4

Slide 4 text

About web 3

Slide 5

Slide 5 text

About web 3 A cluster of technologies and ideas Decentralisation (and individual ownership) Blockchain Crypto currencies Decentralised ﬁnance (DeFi) Assets as tokens, including non fungible tokens (NFTs) Metaverse Decentralised autonomous organisations (DAOs)

Slide 6

Slide 6 text

Designing in transition

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

Mainframe Menus and forms Keyboard

Slide 9

Slide 9 text

Mainframe Menus and forms Keyboard Software GUI Point and click Usability

Slide 10

Slide 10 text

Mainframe Menus and forms Keyboard Software GUI Point and click Usability Accessibility Web 1 Static web pages Navigation IA Centralised content

Slide 11

Slide 11 text

Mainframe Menus and forms Web 2 User-generated content Rich internet apps Templated layouts UX Keyboard Software GUI Point and click Usability Accessibility Web 1 Static web pages Navigation IA Centralised content

Slide 12

Slide 12 text

Mainframe Menus and forms Web 2 User-generated content Rich internet apps Templated layouts UX Keyboard Mobile Mobile navigation Card-based layouts UI Gestures Software GUI Point and click Usability Accessibility Web 1 Static web pages Navigation IA Centralised content

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Patterns form over time

Slide 15

Slide 15 text

Working from ﬁrst principles

Slide 16

Slide 16 text

Understand the tech New technologies bring new opportunities and constraints And new mental models

Slide 17

Slide 17 text

Fundamental UX concepts

Slide 18

Slide 18 text

Understand your users Your actual individual users, not groups of types of people Can’t transfer previous research I can’t give detailed design advice, as I don’t know your users

Slide 19

Slide 19 text

How people learn

Slide 20

Slide 20 text

Understand mental models

Slide 21

Slide 21 text

Innovators, early adopters, later adopters Attribution: CC BY 2.5, https://commons.wikimedia.org/w/index.php?curid=113543416

Slide 22

Slide 22 text

Web 3 now

Slide 23

Slide 23 text

It is hard to understand The concepts are quite different (I think so at least) Everyone talks jargon Hard to ﬁgure out what the use cases are Lots of hype Talked about as if it’s one thing My favourite series - search “freakonomics podcast crypto”

Slide 24

Slide 24 text

User research Users for research may be hard to ﬁnd (which is a warning bell for a product) Go to where the users are

Slide 25

Slide 25 text

Negative press

Slide 26

Slide 26 text

People have lost a lot of money

Slide 27

Slide 27 text

Current user experience is awful Poor usability Complex processes Confusing processes …and nowhere to turn when things go wrong

Slide 28

Slide 28 text

Poor usability - can I have a ﬁlter please

Slide 29

Slide 29 text

Poor usability - can I have a ﬁlter please

Slide 30

Slide 30 text

Poor usability - what happens next?

Slide 31

Slide 31 text

Complex processes: 28 steps to get an account to buy crypto

Slide 32

Slide 32 text

5 steps to set up a wallet, 8 to add it to the browser

Slide 33

Slide 33 text

And another 10 to move coin to my wallet

Slide 34

Slide 34 text

Not to mention writing down the 12-25 word recovery phrase

Slide 35

Slide 35 text

Checking out and paying…

Slide 36

Slide 36 text

Checking out and paying…

Slide 37

Slide 37 text

Checking out and paying…

Slide 38

Slide 38 text

Loads of scams

Slide 39

Slide 39 text

Loads of scams

Slide 40

Slide 40 text

Decentralised means there is no help Where do you go when something happens? Nowhere…

Slide 41

Slide 41 text

Web 3 design

Slide 42

Slide 42 text

Mental model: Transferring funds My bank Friend’s bank Me Friend Me Friend My wallet Friend’s wallet Z2DE4… RT4PM…

Slide 43

Slide 43 text

Mental model: Buying a digital product Me Shop Me Shop

Slide 44

Slide 44 text

Mental model: Banks

Slide 45

Slide 45 text

Mental model: Proving ID digitally

Slide 46

Slide 46 text

Mental model: Signing in

Slide 47

Slide 47 text

No content

Slide 48

Slide 48 text

Match the mental model or the system model? Decide whether to expose or hide what’s under the covers

Slide 49

Slide 49 text

Understand appetite for risk Innovators Early adopters Later adopters (early - late majority) Risk-takers (and comfortable) Will tolerate risk Reasonably risk averse May have access to finance Usually have access to finance Carefully assess the value High social status / thought leadership Often connected to the tech Need some information Need more information and to see others adopting Like being part of a new thing Evangelise the idea Just use the product

Slide 50

Slide 50 text

Help people learn Understand where people are Understand where we need them to be Make the steps as small as possible (even if it means more steps) Help them understand what is similar and different Expose more and hide less than we might in a mature system, so they can learn and develop new mental models Provide more feedback and support when an action takes place

Slide 51

Slide 51 text

No content

Slide 52

Slide 52 text

Choose partners carefully When choosing wallets and services, assess the UX for their service and use that in your choice

Slide 53

Slide 53 text

Design onboarding

Slide 54

Slide 54 text

Design for trust What are people worried about What makes you credible How are you keeping users data safe How are you managing their data or assets How are you different from other similar projects

Slide 55

Slide 55 text

Summary

Slide 56

Slide 56 text

Summary Web 3 isn’t one thing - you’ll be designing for speciﬁc parts of it There are not yet patterns of good practice The current user experience is terrible Understand your users’ mental models and design to connect them and the system model Design for learning, onboarding and trust

Slide 57

Slide 57 text

Q&A You can ﬁnd me here: ● @maadonna ● Linkedin: Donna Spencer (mention you saw me at YOW!) ● Insta: maadonna_m (which is just renovations, sewing and cats)