Bitcoin-Wallet icon indicating copy to clipboard operation
Bitcoin-Wallet copied to clipboard

3. Main wallet screen

Open Cobra-Bitcoin opened this issue 4 years ago • 10 comments

Design goals:

  • Display both the BTC amounts and the fiat currency amounts
  • Allow the user to refresh and re-sync their balance
  • Give the user a way to switch between the different tabs (overview, send, receive, settings)

By default the first tab displayed is the overview tab, this should contain a list of transactions. Currently the main way to traverse through the transactions is with the "Back" and "Next" buttons, but as stated in the design guidelines, it would be nice to have the pagination designed into the table in a nicer way.

Current design: overview

Cobra-Bitcoin avatar Sep 05 '20 16:09 Cobra-Bitcoin

Here is a preview of the "Overview" screen. I decided to try the sidebar navigation instead of the top navigation. Let me know if that's a good direction.

natiwa avatar Sep 14 '20 12:09 natiwa

@natiwa Looks great! Yeah, I think the sidebar navigation makes sense and looks a lot better to be honest.

I think we can simplify the table a bit here, there's too much going on, maybe instead of mined/confirmations and transaction hash and the amount, we can instead only have the following:

Date Amount Status Link to transaction in explorer

And within the status, we have either "Unconfirmed", "Pending", "Complete", the real design can have these color coded or use icons.

Other than that, it looks basically perfect.

Cobra-Bitcoin avatar Sep 14 '20 16:09 Cobra-Bitcoin

@natiwa Also, we need to remember that we need some empty state display, for when there are 0 transactions (e.g. when the user has just created a new wallet).

But other then that, I think we are all done with the wireframes and can start with the actual designs now.

Cobra-Bitcoin avatar Sep 15 '20 17:09 Cobra-Bitcoin

Absolutely. empty state

natiwa avatar Sep 16 '20 13:09 natiwa

@natiwa Looks great!

Cobra-Bitcoin avatar Sep 16 '20 14:09 Cobra-Bitcoin

@natiwa Just a heads up, but I remembered we'll also need a 512x512 app icon.

It should incorporate the Bitcoin logo, and also match the darker theme. Maybe some nice dark gradient with a Bitcoin logo on top of it? Not sure.

Cobra-Bitcoin avatar Sep 19 '20 20:09 Cobra-Bitcoin

That looks like the wallet i would get use to introduce my mom to bitcoin

DrBeta avatar Sep 25 '20 23:09 DrBeta

@natiwa Something seems to have broken on Figma. The flow doesn't work anymore.

Cobra-Bitcoin avatar Oct 01 '20 23:10 Cobra-Bitcoin

Now should be ok> LINK TO THE PREVIEW

natiwa avatar Oct 02 '20 11:10 natiwa