Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions _compress_images_cache.yml
Original file line number Diff line number Diff line change
Expand Up @@ -1429,3 +1429,7 @@ assets/images/guide/glossary/signature@2x.jpg: signature@2x.jpg
assets/images/contribute/alby.png: alby.png
assets/images/contribute/bitcoin-smiles.png: bitcoin-smiles.png
assets/images/contribute/hello-bitcoin.png: hello-bitcoin.png
assets/images/guide/designing-products/wallet-interoperability/hardware-wallets.jpg: hardware-wallets.jpg
assets/images/guide/designing-products/wallet-interoperability/hardware-wallets@2x.jpg: hardware-wallets@2x.jpg
assets/images/guide/designing-products/wallet-interoperability/user-interface.jpg: user-interface.jpg
assets/images/guide/designing-products/wallet-interoperability/user-interface@2x.jpg: user-interface@2x.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 5 additions & 5 deletions guide/designing-products/common-user-flows.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
layout: guide
title: Common user flows
description: Overview of the most common user activities in Bitcoin applications.
nav_order: 7
nav_order: 8
parent: Designing Bitcoin products
permalink: /guide/designing-products/common-user-flows/
main_classes: -no-top-padding
Expand Down Expand Up @@ -567,11 +567,11 @@ This can be a tricky experience to address. For one, non-custodial cryptocurrenc

---

On to [wallet interoperability]({{ '/guide/designing-products/wallet-interoperability/' | relative_url }}) which is essential for smooth interaction and migration between Bitcoin products.
On to [interoperability]({{ '/guide/designing-products/wallet-interoperability/' | relative_url }}) which is essential for smooth interaction and migration between Bitcoin products.

{% include next-previous.html
previousUrl = "/guide/designing-products/personal-finance/"
previousName = "Personal finance"
previousUrl = "/guide/designing-products/getting-to-know-your-users/"
previousName = "Getting to know your users"
nextUrl = "/guide/designing-products/wallet-interoperability/"
nextName = "Wallet interoperability"
nextName = "Interoperability"
%}
2 changes: 1 addition & 1 deletion guide/designing-products/design-resources.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
layout: guide
title: Design resources
description: Design files by and for the Bitcoin Design Community
nav_order: 9
nav_order: 10
parent: Designing Bitcoin products
permalink: /guide/designing-products/design-resources/
main_classes: -no-top-padding
Expand Down
8 changes: 7 additions & 1 deletion guide/designing-products/designing-products.md
Original file line number Diff line number Diff line change
Expand Up @@ -70,13 +70,19 @@ If we consider Bitcoin money, we need to consider how Bitcoin users think about

---

### [Getting to know your users]({{ '/guide/designing-products/getting-to-know-your-users/' | relative_url }})

This section will give you some tips on how best to understand and develop knowledge about your users.

---

### [Common user flows]({{ '/guide/designing-products/common-user-flows/' | relative_url }})

Most Bitcoin applications share certain user activities, from initial setup to making a transaction. It is vital to follow users' expected patterns and behaviors to reduce mistakes and enable seamless switching between products.

---

### [Wallet interoperability]({{ '/guide/designing-products/wallet-interoperability/' | relative_url }})
### [Interoperability]({{ '/guide/designing-products/wallet-interoperability/' | relative_url }})

Get to know the points of interaction and overlap connecting payment links, wallet recovery, node configurations, and more.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,23 @@
layout: guide
title: Getting to know your users
description: How best to understand and develop knowledge about your users.
parent: Onboarding
nav_order: 1
permalink: /guide/onboarding/getting-to-know-your-users/
parent: Designing Bitcoin products
nav_order: 7
permalink: /guide/designing-products/getting-to-know-your-users/
main_classes: -no-top-padding
image: https://bitcoin.design/assets/images/guide/onboarding/getting-to-know-your-users/getting-to-know-your-users-preview.png
---

<!--

Editor's notes

Illustration sources

- Sources needed

-->

{% include picture.html
image = "/assets/images/guide/onboarding/getting-to-know-your-users/getting-to-know-your-users.png"
retina = "/assets/images/guide/onboarding/getting-to-know-your-users/getting-to-know-your-users@2x.png"
Expand All @@ -21,12 +31,12 @@ image: https://bitcoin.design/assets/images/guide/onboarding/getting-to-know-you
%}

# Getting to know your users
When building onboarding experiences, it is important to understand and develop knowledge about your users upfront.
Within the Bitcoin ecosystem, there is a wide range in the level of expertise. Identifying who you are building for is crucial, as these user groups value and understand varying characteristics of coin and key management tools. For example, [research](https://voskart.de/pdf/bits_under_mattress.pdf) suggests “rookies” often favor convenient, easy-to-use wallets, while well-versed bitcoin owners tend to prioritize security.
When building Bitcoin applications, it is important to understand and develop knowledge about your users upfront. Within the Bitcoin ecosystem, there is a wide range in the level of expertise. Identifying who you are building for is crucial, as these user groups value and understand varying characteristics of coin and key management tools. For example, [research](https://voskart.de/pdf/bits_under_mattress.pdf) suggests “rookies” often favor convenient, easy-to-use wallets, while well-versed bitcoin owners tend to prioritize security.


## Observe your potential users
This observation could take the form of [user research]({{ 'guide/designing-products/user-research/' | relative_url }}), user interviews and surveys aimed at a range of participants to observe and identify what they do, how they think, and what they want. Let's consider some things you might want to ask yourself when improving the onboarding experience for new users:
This observation could take the form of [user research]({{ 'guide/designing-products/user-research/' | relative_url }}), user interviews and surveys aimed at a range of participants to observe and identify what they do, how they think, and what they want. Let’s consider some things you might want to ask yourself when improving the experience for new users:


* [What is their perception of Bitcoin?](https://docs.google.com/forms/d/e/1FAIpQLSdzT8cb54NgT7hGUnC_5ow6rDy-A9p_CA-5ptiQxrG8wQWvzQ/viewform)
* Why do they intend to use Bitcoin, investment, savings or spending?
Expand Down Expand Up @@ -176,17 +186,17 @@ It's important to allow you and your team to be as free and creative about how y
## Prototype & Test
Next, you can think about prototyping a subset of these ideas and understanding your ideas' feasibility through feedback on these prototypes. Put your prototypes in front of real users and test to verify the solution meets the users' needs.

You might choose to lean on something like the [Bitcoin Wallet UI Kit](https://www.figma.com/file/VB3GQdAnhl8yta44DY3PSV/Bitcoin-Wallet-UI-Kit?node-id=616%3A0), which gives you several components that you can piece together for a specific [use case]({{ 'guide/case-studies/' | relative_url }}). This would allow you to prototype rapidly and get a feel for if the UI flow makes sense before committing to more detailed designs.
You might choose to lean on something like the [Bitcoin Wallet UI Kit](https://www.bitcoinuikit.com/), which gives you several components that you can piece together for a specific [use case]({{ 'guide/case-studies/' | relative_url }}). This would allow you to prototype rapidly and get a feel for if the UI flow makes sense before committing to more detailed designs.

Ultimately the goal of onboarding is that users trust the application, feel comfortable using it, and are set up for success. They should have an idea of how this application is going to fit into their lives and take care of certain needs. It's also ideal if they can already envision the next time they will use it.
Ultimately the goal of getting to know your users is to build trust in the application, feel comfortable using it, and are set up for success. They should have an idea of how this application is going to fit into their lives and take care of certain needs. Its also ideal if they can already envision the next time they will use it.

---

Next, we will cover [creating a new wallet]({{ '/guide/onboarding/creating-a-new-wallet/' | relative_url }}).
Next, we will cover [common user flows]({{ '/guide/designing-products/common-user-flows/' | relative_url }}).

{% include next-previous.html
previousUrl = "/guide/onboarding/introduction/"
previousName = "Onboarding"
nextUrl = "/guide/onboarding/creating-a-new-wallet/"
nextName = "Creating a new wallet"
previousUrl = "/guide/designing-products/personal-finance/"
previousName = "Personal finance"
nextUrl = "/guide/designing-products/common-user-flows/"
nextName = "Common user flows"
%}
6 changes: 3 additions & 3 deletions guide/designing-products/personal-finance.md
Original file line number Diff line number Diff line change
Expand Up @@ -263,11 +263,11 @@ Considering your product, ask yourself these questions:

---

Looking closer at these use cases, we can identify a series of user actions, as outlined in [common user flows]({{ '/guide/designing-products/common-user-flows/' | relative_url }}).
Next we will look at why it is important to [get to know your users]({{ '/guide/designing-products/getting-to-know-your-users/' | relative_url }}) when desiging Bitcoin applications.

{% include next-previous.html
previousUrl = "/guide/designing-products/usage-life-cycle/"
previousName = "Usage life cycle"
nextUrl = "/guide/designing-products/common-user-flows/"
nextName = "Common user flows"
nextUrl = "/guide/designing-products/getting-to-know-your-users/"
nextName = "Getting to know your users"
%}
2 changes: 1 addition & 1 deletion guide/designing-products/wallet-interoperability.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
layout: guide
title: Interoperability
description: Designing for seamless experiences across Bitcoin applications.
nav_order: 8
nav_order: 9
parent: Designing Bitcoin products
permalink: /guide/designing-products/wallet-interoperability/
main_classes: -no-top-padding
Expand Down
2 changes: 1 addition & 1 deletion guide/onboarding/backing-up-a-recovery-phrase.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: Backing up a recovery phrase
description: Handling recovery phrases during onboarding.
parent: Onboarding
has_children: true
nav_order: 3
nav_order: 2
permalink: /guide/onboarding/backing-up-a-recovery-phrase/
main_classes: -no-top-padding
image: https://bitcoin.design/assets/images/guide/onboarding/backing-up-a-recovery-phrase/backing-up-a-recovery-phrase-preview.png
Expand Down
4 changes: 2 additions & 2 deletions guide/onboarding/creating-a-new-wallet.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ layout: guide
title: Creating a new wallet
description: Steps to take when creating a new wallet, and tips for a great user experience.
parent: Onboarding
nav_order: 2
nav_order: 1
permalink: /guide/onboarding/creating-a-new-wallet/
main_classes: -no-top-padding
image: https://bitcoin.design/assets/images/guide/onboarding/creating-a-new-wallet/creating-a-new-wallet-preview.png
Expand Down Expand Up @@ -107,7 +107,7 @@ Below is an example of some carousel screens that might be useful in helping a u
Ok, now let's look at [backing up a recovery phrase.]({{ '/guide/onboarding/backing-up-a-recovery-phrase/' | relative_url }})

{% include next-previous.html
previousUrl = "/guide/onboarding/getting-to-know-your-users/"
previousUrl = "/guide/onboarding/introduction/"
previousName = "Getting to know your users"
nextUrl = "/guide/onboarding/backing-up-a-recovery-phrase/"
nextName = "Backing up a recovery phrase"
Expand Down
2 changes: 1 addition & 1 deletion guide/onboarding/funding-a-wallet.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ layout: guide
title: Funding a wallet
description: Outline of the ways users are likely to fund a wallet, from direct purchase to bitcoin gift cards.
parent: Onboarding
nav_order: 7
nav_order: 5
permalink: /guide/onboarding/funding-a-wallet/
main_classes: -no-top-padding
image: https://bitcoin.design/assets/images/guide/onboarding/funding-a-wallet/funding-a-wallet-preview.png
Expand Down
10 changes: 2 additions & 8 deletions guide/onboarding/introduction.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,12 +43,6 @@ Remember: Onboarding should not be a crutch for bad design. Avoid trying to expl

---

### [Getting to know your users]({{ '/guide/onboarding/getting-to-know-your-users/' | relative_url }})

This section will give you some tips on how best to understand and develop knowledge about your users.

---

### [Creating a new wallet]({{ '/guide/onboarding/creating-a-new-wallet/' | relative_url }})

An overview of what information to include when creating a wallet for the first time.
Expand Down Expand Up @@ -82,6 +76,6 @@ An overview of how users are likely to fund their wallets
{% include next-previous.html
previousUrl = "/guide/designing-products/design-resources/"
previousName = "Design resources"
nextUrl = "/guide/onboarding/getting-to-know-your-users/"
nextName = "Getting to know your users"
nextUrl = "/guide/onboarding/creating-a-new-wallet/"
nextName = "Creating a new wallet"
%}
2 changes: 1 addition & 1 deletion guide/onboarding/protecting-a-wallet.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ layout: guide
title: Protecting a wallet
description: How extra layers of security can be added to Bitcoin applications via PINs, Face Id, and other techniques.
parent: Onboarding
nav_order: 6
nav_order: 4
permalink: /guide/onboarding/protecting-a-wallet/
main_classes: -no-top-padding
image: https://bitcoin.design/assets/images/guide/onboarding/protecting-a-wallet/protecting-a-wallet-preview.png
Expand Down
2 changes: 1 addition & 1 deletion guide/onboarding/restoring-a-wallet.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ layout: guide
title: Restoring a wallet
description: Options for restoring a wallet, from automatic cloud backup to recovery phrases, and more.
parent: Onboarding
nav_order: 4
nav_order: 3
permalink: /guide/onboarding/restoring-a-wallet/
main_classes: -no-top-padding
image: https://bitcoin.design/assets/images/guide/onboarding/restoring-a-wallet/restoring-a-wallet-preview.png
Expand Down