Slides from https://www.meetup.com/Blockchain-Experience-Design/

1. Blockchain Experience Design Meetup:
Onboarding (Part 1)
6 September 2018
Gendry Morales & Josh Lee

3. A hacker,
hipster and
hustler walked
into a meetup...
Has ‘X’ in their title
“All about the Customer Experience”
Creative, Empathetic, Thoughtful
Allergic to PowerPoint, lives on Soy Lattes
Eats, builds and breathes code
“It’s about #BUIDL”
Analytical, Focused, Reliable
Knows about ‘Alice and Bob’
Visions, partnerships and business model
“There’s a real market opportunity here...”
Growth mindset, Go-getter, Disciplined
Growth hacking

4. Your 3 minute
challenge:
Building your
All-star team!
In teams of 3 or 4, find your
hacker, hipster and hustler!
● Find 1 thing in common
● Come up with a team name!
● Stranger ≠ danger
(meet someone new!)

5. Today’s
agenda
02 mins - Who are we?
30 mins - Blockchain basics and Intro to Decentralised Apps (Dapps)
05 mins - State of Blockchain today + Why Blockchain XD?
15 mins - The Onboarding Experience and Journey Mapping basics
30 mins - Your Design Challenge begins!
15 mins - Shareback
15 mins - Emerging best practice for blockchain onboarding
05 mins - Wrap up and the next meetup!

6. What’s this
Blockchain
buzzword?
Distributed and
decentralised
Append only
You can program
permanent rules
and self executing
contracts

7. trust
/trʌst/
noun
firm belief in the reliability, truth, or
ability of someone or something.
What does this mean in the
context of Design?
What unique characteristics
does blockchain give us,
which makes it better than
other technologies?

8. PERMANENCE
STORY OF ORIGIN
TAMPER-PROOF
EVERLASTING

9. AUTHENTICITY
FROM TRUSTED SOURCE
CROWDSOURCED TRUST / ORACLES
COUNTERFEIT-PROOF

10. DISINTERMEDIATION
P2P / DIRECT RELATIONSHIP /
REMOVAL OF 3RD PARTIES
REDUCED COSTS
CENSORSHIP RESISTANT

11. DIGITAL SCARCITY
RARITY
LIMITED SUPPLY

12. What’s
a Dapp?
Decentralised
application
ONTHECHAIN
Protocols, chains
and storage
Application layer/
smart contracts
Front End
interface
Combination of
on chain & off chain

13. ONTHECHAIN
Protocols, chains
and storage
Application layer/
smart contracts
Front End
interface
No coiners and
regular users Cypherpunks and
crypto savvy
Integrating
experiences cross
chain and protocol
D-centralisation
The effect of decentralisation and Dapps

14. DEMO:
these weird cats
http://cryptocats.thetwentysix.io/

15. Why start Blockchain
Experience Design?

16. The
blockchain
ecosystem
& tech
stack
Chains, distributed
storage & protocols
Web3 layers like IPFS. Backend
Dev tools like Parity, Geth,
Truffle
Application layer
Wallets, crypto, smart
contracts
Integration to offchain
world Web3.js Metamask
Infura
Front End
The usual suspects
like JS, CSS, HTML

17. Journey
mapping
It’s a
post-hype
thing
Apparently we are
about here now
Gartner Hype Cycle and Roger’s Adoption curve

18. Dapps and the current experience
Today, users interact with a Smart Contract on the Blockchain in several ways. Check out
https://www.stateofthedapps.com/ and https://dappradar.com/ if you want to play with
some examples
Entered directly via a
command line
Rich front end
Dapp browsers via
Wallets (e.g. Metamask)

19. Web3 UX
START HERE
https://designforcrypto.com/
http://discuss.conflux.network/
https://medium.com/@lyricalpolymath/we
b3-design-principles-f21db2f240c1
The global blockchain design
community has emerged and
is working together to create
patterns and share
knowledge

20. So many
design
challenges
So much fun to
be had!

21. Unpacking the problem

22. First
impressions
matter
One in four mobile apps are abandoned
after the first launch (Localytics, 2015)
77% of users drop an app just 72 hours
after download (Quettra, 2016).
Users have a model of the Internet that
doesn’t always match blockchain reality
or the current experience.

23. Blockchain
onboarding
challenge
Designing great onboarding experiences
for blockchain products are inherently
difficult. Some of the constraints we’re
dealing with include:
● Regulatory requirements
(e.g. KYC, AML)
● Delays in wait time confirmation
dependent on the chain
● Unfamiliar concepts and language
for users

24. Your
design
challenge:
For anyone who has bought crypto or interacted
with a blockchain Dapp (decentralised
application), you’ll know it’s a strange and
unfriendly land filled with emotional and
functional barriers.
In this challenge, you will:
● 30 mins - map the user journey interacting
with the following live Dapps, highlighting
key pain points, delight points and insights

25. Journey
map
A Journey Map should help you to visualize a
customer’s experience from beginning to end.
Like how a movie tells a story of an actor as a
sequence of scenes, a journey map visualizes your
user’s experiences as a sequence of steps.
Key steps and stages
(e.g. Search)
Storyboard or text
(e.g. Searching for ‘XX’
on Google but failed)
Emotional
Journey /
Graph
Insight/opportunities
(e.g. replace crypto
jargon with words
familiar to our users)

26. ReceivePay and waitQueue
Josh’s daily coffee routine
Key steps and stages
(e.g. Search)
Storyboard or text
(e.g. Searching for ‘XX’
on Google but failed)
Emotional
Journey /
Graph
Insight/opportunities
(e.g. replace crypto
jargon with words
familiar to our users)
Getting ready
Barely awake and cranky,
Josh has his commute on
a packed tram.
He has a habit of
‘over-snoozing’ and aims
to get out of the house as
soon as he can.
He dumps his bag at his
office, grabs a mug and
heads down for a coffee.
He’s greeted by the usual
‘peek coffee’ crowd. In
some days, the queue
feels longer that it is.
It’s finally his turn! Nick
the barista instinctively
greets him, grabs his mug
and spells out his usual
order.
Josh pays using his
phone.
A second barista calls his
name, and there you have it -
liquid gold in a mug.
:( Queuing is his
biggest frustration.
:) He pays more at Tukk
just because they
remember his name!

27. Journey
mapping
Try one
of these
dapps!
Create a Wallet, Receive and
Send Crypto (e.g. Jax, CoinJar)
Share a photo from your
travels on Travelstack
Post your first ‘tweet’ on
Peepeth
Post your first job ad
on Ethlance

28. Journey
mapping
1. Pick a primary user from your group and assign clear roles:
● Customer: You’re the star of the show. We’re interested
to hear about your experience, highlights and
frustrations getting started on the Dapp. Verbalise
your thoughts as best as possible
● Researchers: You’re the investigator of the night. Ask
open questions and let the conversations flow.
Understand why users are behaving as they are.
2. Take 5 minutes to understand your user and their context
3. Get started - observe your user’s experience using a Dapp
4. Map their journey using the template, highlighting key pain
points, delight points, insights and opportunities (Remember
to use your user’s language, not yours!)
5. Share your learnings with the broader community!
Quick
guide

29. USER INSTRUCTIONS:
Create your
first crypto
wallet
1. This is exciting - you’ll be creating your first crypto
wallet and own your own first bit of digital currency
2. Decide on a wallet - Jaxx, Bread or Coinjar are some
examples
3. Sign up!
4. Send Josh your Public Address to receive Bitcoin
5. Ask Josh for his Public Address to send some back
6. You did it!
Remember to verbalise your thinking as you are using the Dapp:
- How did that make you feel?
- What are you looking for? (e.g. a button)
- What specifically made it difficult or confusing? (e.g. language)

30. Shareback

31. Emerging best practice

32. Ethereum
Name
Service
(ENS) ‘Register’ your wallet’s public key to a
specific address of your choice

33. ‘Login
with
Coinbase’ Coinbase’s acquisition of Distributed Systems,
could signal serious intent for Coinbase to be the
‘Facebook Connect’ to decentralised apps.
(Techcrunch 2018)

34. Airdrops
or ‘free
play’
tokens
An idea gaining traction from the Web3 UX Global
community is to mitigate the need for tokens for
first time Dapp users. This could mean:
● Giving users free ETH or tokens to
experience the product
● Creating free tokens for users to interact on
the testnet (sandbox environment)

35. Wait, haven’t we seen this before?
ICQ and
Cryptographic Hashes
Facebook Connect SDK
and ‘Login with Coinbase’
Email address and
Ethereum Name Service
We’ve seen similar progress in identity and accessibility in the adoption of Web 2.0.
How else can we innovate?

36. Next meetup

37. Future
design
challenges
1. Onboarding Experience for Dapps
(Part 2: Ideation)
2. Language, metaphor and icons
3. Mechanism Design meets UX
4. <Your suggestion here>

38. Join us on telegram
tiny.cc/blockchainXD

39. Your feedback:
“More of” + “Less of”

40. 1. About the user (5 min)
A bit about them Any past crypto experience? Motivations and confidence for using a dapp:

41. Journey Map
Key steps and stages
(e.g. Search)
Storyboard or text
(e.g. Searching for ‘XX’
on Google but failed)
Emotional
Journey /
Graph
Insight/opportunities
(e.g. replace crypto
jargon with words
familiar to our users)

42. As a community,
here are our
insights about
Blockchain Onboarding

43. XX XX