# Padawan wallet(Case study - Design 2/2)

This article describes the summary of the second part of my summer of bitcoin internship designing padawan. To read part 1, [click here](/A9VdfOAHR0WB0REiG_ku0A)

### Milestones covered in this period
- [ ] User Research
- [ ] Low fidelity wireframe
- [x] High fidelity wireframe
- [x] Developer Hand off

[**Figma Prototype link**](https://www.figma.com/proto/DmYMU0gvQfeMwH4XXAWkQV/Padawan-Final-UI?page-id=923%3A7158&node-id=923%3A9396&viewport=530%2C-2658%2C0.13&scaling=scale-down&starting-point-node-id=923%3A9396&show-proto-sidebar=1)

## Designing Padawan UI in high fidelity.
We had a couple of ideas of what we felt the app would look like visually after our research and low fidelity.

- Design an interface that is simple
- Introduce astyle that is welcoming.
- And add illustrations

## Trying out various design concepts


*exploration 1*

**Another one**

*exploration 2*

An attempted at two styles that didn't check out all our boxes

For exploration 1, it was about fine-tuning the style and finding an illustration that matchs well.

In exploration 2, the structure of the design ticked the boxes but it looked like what could pass for a fintech app.

That was not too say any of these designs wouldn’t have passed the goal of what padawan could be, It’s that with each time we explored a better design was made.

## Making decision design

Taking all we know from the other designs, we picked and chose from the exploration we had done. This came with back and forth, giving rationle of why we made certain decisions. At any point we felt stuck we looked back at the goals we outlined for this project, and what problem we were solving. This ensured we were always on the right track.

This was the phrase i learnt to fall in love with the process and not just the result.

## Style Guide

To keep a consistent and appealing visual style across, It was essential to develop a style that appeared friendly to the user. This we showed in the Colours and typography.

### Choosing Colours

We wanted the brand to feel inviting and playful. So we choose to go with a blend of orange and red. For text, a dark brown brought good contrast and accessibility into play. The result was like an inspiration from a comic book.

Adding custom colours gave a flexiblity to play around with


### Typography

In choosing a type It was necessary we picked somthing simple, playful, and easy to read. Since Outfit satisfied requirement these we went for it.


# Simplifying the bitcoin experience for newbies.

Getting into features we designed

### **Onboarding**

To give a glimpse of what the app experience is about, we split the onboarding experience into four discrete screen. Reading it gives a sense a what the whole app is about.


*Bitcoin made simple.* *Simplified learning.* *Hands-on experience.* *Hassle-free journey*

### Creating a wallet in seconds

A typical wallet usually takes few minutes to set up; A 12-word seed phrase is randomly created for you and in that time users are asked to backup their 12 words. Based on what we discovered, it’s better to show the seed phrase much latter.

Since Padawan is testnet wallet, this wasn’t coming at cost of securing the wallet.

We made the decision to turn this into a teachable moment for new users in the learn tab.


## Home screen

As soon as the user is finishs creating the wallet, a wallet card and a transaction list is shown. The wallet appears empty until an the user taps to the 'get coin' button to populates the wallet balance.

### Toggling Sats/bitcoin

You can measure bitcoin in two units; sats and btc. It's easy to convert between the two unit by clicking.


### Receiving bitcoin

The receive button is one of the primary buttons you will find in bitcoin wallets. To show users how to receive bitcoin, we had to make the receive-bitcoin flow interactive. That’s how we came up with a gif screen before a receiving address is generated.


### Sending bitcoin

Sending bitcoin comes with 3 steps; sending amount, sending address, and transaction fee. As extra options, a users can scan in the recipient’s address and play with changing the default transaction fee.


### Transaction fee

Understanding what a transaction fee is and what fees to input is a tricky one for new users in bitcoin. While the topic of calculating Fee rate is quite complex, it helps to simplify the rate into 2 category — normal fast.


## Learning bitcoin

### Skills and Concept

Drafting out the learning content in text, we found it better to split these contents into concepts and skills. A user gets to read the idea behind a term in bitcoin then practice after that.


### Learning as journey

In order to make the learning journey smooth, it was grouped into 3 chapters. Covering bitcoin basics, Transactions and Security.


*These 3 chapter cover all a user needs to know to confidently start using a mainnet wallet.*

### Securing your wallet, Back up phrase

Apart from showing the user the backup phrase in the learning phase, the backup can also be found in the menu.

It fitting to put this in the menu page for easy access. The Menu contains extra items that doesn’t fit into the home and learn category.


### Reset Tutorial

After the finishing a tutorial a user can reset it to make the app seem new. For instance, a sibiling might want to try out padawan wallet on your phone, reseting the tutorial offer a way for them to clear the app and start from the beginning.


## Learnings from designing padawan

#### Staying Open-Minded

The incredible folks I had the pleasure of working with on this project taught me some of valuable lessons. They were open-minded, diligent. We shared feedback with each other, asked for it, and constantly tried to make the app better.

#### Collaboration and communication are Key

I attribute the success of this project with how aligned we were every step of the way. We worked on this project from varying time zones, 7 to be exact. So you can imagine how communication would be, but every time there was a meeting we all made sure to show up. We meet once every week at the same time, and communicated the rest via text, asynchronously in the discord server.

#### Building product is a never ending cycle

One things was for sure, the many times we explored different concept, the better the solutions we came with. But it was easy for us to lose sight of the project timeline and goals if we were not careful. Thankfully with our mentors guidance we were to keep thing under control to the point we have it now. They were keen to remind us that “Done is better than perfect, and with a great design comes many iterations.”

#### Everything is learnable

Confusion wasn’t far fetching going into this project. Starting a project that was this niche, Meeting diverse people, collaborating together with them was new to me. However having to constantly believe in my ability to learn had me at peace that it was only a matter of time i’d figure things out.

#
---
### Thank yous
A big thanks to my mentors: **Stephen DeLorme**, **Christoph Ono.** Their help was instrumentally both in this project and my growth as a designer. Making themselves available for various questions i had. To **Thuderbiscuit**, he started this as a side project about a year ago and I'm happy to see how it coming to fruition

**Himanshu** and **Autumn**, two designers i worked with and i’d happy to work with again.

To summer of bitcoin team for organising this program. Thank you.

###### tags: Bitcoin, Design, UX