3

I am designing a dialog which would allow user to transfer credits from his account to "an object's account". Transfer is only in one direction -- after you confirm transfering credits to an object's account, you can't retrieve them.

Dialog has two buttons showing numbers of credits on both accounts -- user's and object's. When dialog opens, it has focus on middle textfield, where you can enter number of credits to transfer.

Dialog initially

While you are changing the number, number of credits on "Your account" changes accordingly to show how much credits you would have after the transfer. You can increase number in the textfield by clicking either the arrow or button below "Object's account". But despite the fact of clicking the button, number on it doesn't change -- only textfield value changes. I didn't want to repeat the information about number of credits being transfered, according to DRY principle.

Dialog after change

To be clear, I was inspired in part by Minecraft trading interface (screenshot below) as I wanted the dialog to be similar in look and behaviour (in sensible way) to it.

Minecraft trading interface

My question is: Would presented design of dialog be clear and comprehensible for average user? I'm looking forward to comments and suggestions / improvements.

  • 1
    Seems intuitive enough, but perhaps the "your account" label should identify "After transfer" somehow – Austin French Apr 30 '14 at 0:39
  • I think you should update both fields with the new number of credits: only updating one and the other staying static might seem a bit buggy to users. – ArtOfCode Jul 29 '14 at 22:07
1

If I am reading the description correctly, a person cannot type a different number into the text field that is in focus? If that is the case, that should be changed as placing that field in focus implies that the user doesn't have to use their mouse.

One idea would be to allow the user to type whatever value they want into the field, and then show updated numbers for both accounts below the originals.

Example:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

  • Thank you for your answer, but I'm afraid numbers below originals duplicate information. There are 5 numbers in one dialog now! – maciek May 3 '14 at 23:19
0

The general process seems intuitive enough.

I would change the arrow to be something non-clickable and then add + and - buttons on the side because as it is now if someone only wanted to use mouse clicks to do this, they would not be able to lower the value of the boost if they overclicked.

It's also not intuitive that the arrow itself is clickable in my opinion so you'd be better off designing a nicer arrow with a small "transfer" written over it or something.

Something else you could consider is simply having one text box where a user enters how many credits they want to transfer, with an account balance in a corner, and then generate and display a static CONFIRMATION screen once they place submit. Making this a two step process would only be 1 additional click for the user but would give them that extra chance to check and make sure that this is what they want to do (important if the process cannot be undone).

  • Please consider irreversible transfer in Minecraft UI is made with one click only. I'm not sure if your idea doesn't have too many confirmation clicks. But thank you for comments! – maciek May 3 '14 at 23:08
  • @maciek - Minecraft is a game and people playing it generally know what they're getting into. This is real life - confirmation on irreversible actions is commonplace and accepted to be useful. What if this was real money you were dealing with? – ArtOfCode Jul 29 '14 at 22:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.