Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Revise send flow visuals #2148

Open
GBKS opened this issue May 2, 2019 · 9 comments

Comments

Projects
None yet
4 participants
@GBKS
Copy link
Contributor

commented May 2, 2019

Making a transaction currently involves 5 steps. Step 1 is on the send page, and Steps 2-5 are modals, each one using a different visual style. I'd like to suggest streamlining those and making the final confirmation step a bit more useful with extra options to copy the transaction ID and a "View progress" option that takes you to the history screen to observe the confirmation progress. I find it pretty important to make users feel 100% confident that their transaction has been sent and is on the way.

There are also some minor tweaks here to standardize some of the button labels and visuals, etc.

Let me know what you think and if you have other ideas for improving this flow, I can update as needed and then push the designs to Zeplin.

monero-transaction-flow-gbks-190429

@GBKS

This comment has been minimized.

Copy link
Contributor Author

commented May 2, 2019

The "Creating transaction" modal could also be merged into the approval modal, as shown in the image below. Might be a better experience if the loader is not so pronounced.

monero-transaction-flow-tweak-gbks-190502

@selsta

This comment has been minimized.

Copy link
Contributor

commented May 2, 2019

Looking awesome. +1

@ph4r05

This comment has been minimized.

Copy link
Contributor

commented May 5, 2019

The visuals look awesome indeed!

How would "proceed to device" modal be solved? Is it going to be a splash screen or some indicator in the transaction signing window?

(We need to notify user that hardware device expects some user input in order to continue)

@rating89us

This comment has been minimized.

Copy link

commented May 5, 2019

Regarding #2141, fiat value could also be displayed:

  • Amount: 50 XMR (3,372.80 USD)
  • Fee: 0.00097857 XMR (0.07 USD)
@GBKS

This comment has been minimized.

Copy link
Contributor Author

commented May 5, 2019

@ph4r05 good call. Is there an existing screen you could maybe send me a screenshot of? And can you think of any other interactive states that should be considered?

@rating89us that definitely should be addressed here, I'll revise.

@ph4r05

This comment has been minimized.

Copy link
Contributor

commented May 5, 2019

@GBKS

I had the following in mind:

Screenshot 2019-04-05 at 22 16 01

During the transaction creation process, the device requires user input to continue. It may prompt to confirm the destination addresses or amounts but also other processes, such as key image refresh. Without the prompt, the GUI won't progress.

Currently, it is made in such a way that if device signalizes required user input the splash screen with "Please proceed to the device" is shown and after the input is entered the device signalizes to hide the splash. Without the splash screen, user could have trouble to notice the device requires some input and wonder why GUI is not doing anything.

Similar logic is in the Wallet wizard:

Screenshot 2019-04-05 at 22 11 42

@GBKS

This comment has been minimized.

Copy link
Contributor Author

commented May 8, 2019

@ph4r05 how about this? If possible, it would be great to have more descriptive copy in this overlay as to what users should do on their hardware wallet.

monero-finalize-transaction-gbks-190508

@ph4r05

This comment has been minimized.

Copy link
Contributor

commented May 9, 2019

@GBKS currently we don't have a more detailed device prompt notifications. The Trezor also prompts for other actions than transaction, such as confirmation of live refresh (key image sync) operation. Thus we decided to use more general "Please proceed to the device" phrase.

@GBKS

This comment has been minimized.

Copy link
Contributor Author

commented May 10, 2019

Here's an iteration that includes the fiat values and also takes a slightly different approach to the hardware wallet interaction. Let me know if this accurately reflects the user flow. The prompt to sign the transaction on the hardware wallet is less direct (= smaller text), but the modals are more consistent. Let me know what you think.

monero-transaction-flow-gbks-190510

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.