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.

Sign up for GitHub

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

Jump to bottom

UI Proposal #869

Open
alphathree opened this issue Sep 9, 2017 · 49 comments
Open

UI Proposal #869

alphathree opened this issue Sep 9, 2017 · 49 comments
Labels
proposal

Comments

@alphathree
Copy link

Guys, been testing the GUI and started to work on some layouts to help out if welcome.

home 2x
send 2x
@unknownids
Copy link

Personally this looks much better to me, much more clean and aesthetic.

@alphathree
Copy link
Author

thanks for your feedback. I think simple changes would go long ways in the UX and UI. From aesthetic to things like showing the list of transactions as default. Also, filtering and sorting dont have to be primary components on the UI. Can be secondary. Icons also help, maybe even a way of collpasing the left column would make sense so its more minimal.

@alphathree
Copy link
Author

alphathree commented Sep 11, 2017 •
edited
Loading

collapsed column sample

collapsed 2x

@scoobybejesus
Copy link

Looks very nice. Any chance you could mock it up to show two sync bars? When used locally, there are two synchronizations that take place. There is the sync status of the daemon downloading and building your local copy of the blockchain. And there's the wallet syncing with the blockchain. I think it would be helpful to see a Network Status and a Wallet Status.

Also, in the collapsed view, the unlocked balance should probably be black or bold, since it's arguable just as important as the total balance.

And the date should probably be YYYY/MM/DD, so people around the world aren't confused.

Whatever. I'm nitpicking. Looks clean. Could maybe use a teeny less white space. And the squared-off top bar screams Windows, but otherwise I like it a lot.

@alphathree
Copy link
Author

alphathree commented Sep 11, 2017 via email

@alphathree
Copy link
Author

did some updates, still thinking about the connection states.

collapsed copy 2x

@dEBRUYNE-1
Copy link
Contributor

I like this design, as it's quite aesthetic and more elegant than the current design.. However, would you be able to code / implement this yourself?

@alphathree
Copy link
Author

alphathree commented Sep 12, 2017 via email

@alphathree
Copy link
Author

alphathree commented Sep 12, 2017 •
edited
Loading

some updates

synced/connected state
normal

Syncing State
syncing

Daemon Loading
message-daemon

On this example a message appears and would fade out, messaging about the daemon

message-daemon2

This latest notification message on top could be used as a status indicator, so a whole popup doesnt block the wallet. If thats technically possible. So would be a background thing.

We could also use the top bar as status for things like the daemon, since its something quite technical, I dont think the regular user should be exposed that much to some things.

Sample below

daemon-windowchrome

@apezio
Copy link

apezio commented Sep 14, 2017 •
edited
Loading

Looks great! Much better than the existing GUI.

I was going to suggest displaying the name of the currently open wallet.

How about an estimated time to sync?

@0x63dev
Copy link

0x63dev commented Sep 18, 2017

Maybe also add estimated value of XMR in $?

@alphathree
Copy link
Author

yes @apezio name of the wallet is handy for sure. It could even be on the window chrome on top. Ill include that in a version. I was thinking time to sync, and remaining blocks could appear as a hover information. So if you want the detail you have it, without adding stuff to the UI.

@0x63dev yes, for sure valuable info.maybe it could appear as a hover initially. Hovering over the balances, we show the USD Estimate. As an initial implementation.

@0x63dev
Copy link

0x63dev commented Sep 18, 2017

@alphathree Maybe show it \w same font size but green color under unlocked balance?

@QuickBASIC
Copy link

Maybe also add estimated value of XMR in $?

Sure, but where would we get that info? Kraken, Polo, Bitfinex, PurpleCatSlaveTradeExchange? What about people that don't transact in USD or care about the USD value? What about ten years from now when your car note is priced in BTC?

I don't think it's wise to start adding extraneous information to the GUI. If someone cares about the value in fiat they'll know where to find that information.

Possibly, we should consider making it easier to copy the values from the balance (top left) or transactions list so that they can paste it into a calculator.

@jonathancross
Copy link
Contributor

Thanks @alphathree, looks nice! Did you create the icons yourself or are they public domain / CC? Can you make seperate svg files for each icon?

I noticed that your mock-up of the History tab doesn't include the transaction BlockHeights. I should point out that there is an issue with using dates -- they can be highly inaccurate and even out of order it seems. Only BlockHeight is reliable for ordering. See #679

Shouldn't the icon for Receiving have an arrow pointing to the coin instead of away from it

I agree with @geozdr, the current icon is unclear. Seems to rely on "moving right" = "send" and "move left" = "receive", but that is not intuitive to me. I'd suggest that "receive" somehow indicate an arrow "coming into" a box, wallet, coin, etc.

RE: New features:
The more straightforward and focused the design changes are, the more likely this is to be implemented. So please try and stay with current functionality rather than suggesting new features :-)

I was going to suggest displaying the name of the currently open wallet.

@apezio This feature request should be discussed here: #655

Maybe also add estimated value of XMR in $?

@0x63dev Fiat exchange rate feature should be discussed in #621

Finally: Any changes like this to the GUI are likely to interfere with / delay the launch of an official mobile wallet. So we might want to consider how important / urgent this is in relation to that effort.

@alphathree
Copy link
Author

alphathree commented Oct 20, 2017 via email

@acrelab
Copy link

acrelab commented Oct 22, 2017

Any considerations for the use of the Monero symbol "ɱ" or ɱ in addition to the stock ticker symbol XMR? Expressing 10.75ɱ or 10.75 XMR depending on preference?

@alphathree
Copy link
Author

alphathree commented Oct 23, 2017 •
edited
Loading

@jonathancross , made some changes, let me know if I prepare the assets for Dev.

I usually use Zeplin for sending specs and assets, with an email, i can send you an invite to that repository and specs.

I updated:

  1. Added wallet name at the top of the app
  2. added block height
  3. updated icons

monero-core-gui-0 2

@alphathree
Copy link
Author

alphathree commented Oct 23, 2017 •
edited
Loading

possible first run. No transaction history. it could contain some basic help for the user.

first run 2x

how the expansion of the icons would work.

mining 2x

Possible hover tooltip. In this case showing the remaining blocks when syncing. Can also show the label of the icons. (Transactions, Send, Receive, Tools, Settings, etc)

popups 2x

@zhlyzv
Copy link

zhlyzv commented Oct 23, 2017

Hey guys,

Has anyone started working on this UI?

I was thinking if we could create the GUI in Electron, we'd have much more control over the frontend, however this would result in bigger package size..

@basjoe
Copy link
Contributor

basjoe commented Oct 23, 2017 •
edited
Loading

@alphathree Cool designs..!

Ill be willing to pick up the code side of things - any way we can get in touch?

@alphathree
Copy link
Author

alphathree commented Oct 23, 2017 via email

@jonathancross
Copy link
Contributor

@defunkt1721 I personally haven't started on anything and I assume any major redesign should be discussed on IRC with devs like @Jaqueeee, @luigi1111 and @fluffypony

@alphathree
Copy link
Author

is there an easy URL to access that IRC channel? @jonathancross
will ping them. I have specs and assets ready.

@QuickBASIC
Copy link

QuickBASIC commented Oct 25, 2017 •
edited
Loading

@alphathree

https://mattermost.getmonero.org is relayed or you can use https://webchat.freenode.net.

@alphathree
Copy link
Author

thank you @QuickBASIC just sent a message there, will keep on pushin :)

@alphathree
Copy link
Author

alphathree commented Oct 26, 2017 •
edited
Loading

update considering latest features. have some questions. are accounts the same as wallets? or users have wallet files and accounts ?

accounts

@SamsungGalaxyPlayer
Copy link

@alphatree accounts are different than addresses. Each account is identified by its unique mnemonic seed. Under these accounts are addresses. One account can contain multiple sub-addresses.

Does that answer your question?

@scoobybejesus
Copy link

@ alphathree What you are referring to as an "account" is more specifically called a "subaddress."

One wallet will contain one private spend key and one private view key. From the private spend key, ultimately, the header address and the subaddresses are derived.

I tried to simplify the answer for you, as did @SamsungGalaxyPlayer, whose answer is also correct, though we sort of come at it differently.

@alphathree
Copy link
Author

got it.

thanks @SamsungGalaxyPlayer @scoobybejesus

@basjoe
Copy link
Contributor

basjoe commented Oct 26, 2017

@alphathree email sent btw.

@alphathree
Copy link
Author

heres a draft of the UX part of the proposal and rationale.
_
Monero Proposal_0.1.pdf
_

@alphathree
Copy link
Author

simplified version of transactions im exploring. the idea is to put most of the tx data after "details"

simplified

@SamsungGalaxyPlayer
Copy link

@alphatree thanks for your work!

I'm not sure if I agree that the proposal to fix problem 3 in the PDF is intuitive. The switch makes it appear as if a user could theoretically select multiple accounts at the same time. Perhaps highlight the selected one with an orange outline instead? Maybe a normal radio button?

@alphathree
Copy link
Author

@SamsungGalaxyPlayer agree the switch is not perfect. maybe some kind of custom radio button could work as well. or something depicting activated/deactivated. makes sense to explore that for sure. thanks for your feedback.

@unknownids
Copy link

I assumed the slider would only let you enable one wallet into the active position. Perhaps something like this https://healthycities.zendesk.com/hc/en-us/article_attachments/209780927/met-green-500px.png or a similar icon to indicate a wallet is active or something.

@alphathree
Copy link
Author

@unknownids was thinking something similar! will explore then. accounts are a powerful concept. but adds another layer of complexity. so definitely worth brainstorming the whole impact/behavior/design of them.

@sanderfoobar sanderfoobar mentioned this issue Nov 11, 2017
Closed
@tracyarciaga
Copy link

Interested to help, how?

@alphathree
Copy link
Author

alphathree commented Nov 16, 2017 via email

@alphathree
Copy link
Author

alphathree commented Nov 16, 2017 via email

@m-henderson
Copy link

looks great! how can I help?

@alphathree
Copy link
Author

alphathree commented Dec 19, 2017 via email

@m-henderson
Copy link

@alphathree is this just a wireframe or have you written the code to produce this UI?

@alphathree
Copy link
Author

alphathree commented Dec 19, 2017 via email

@fresheneesz
Copy link

fresheneesz commented Dec 27, 2017 •
edited
Loading

Sleek look! Some feedback:

I think you should keep the text descriptions of each section tab. This makes it easier for new comers and old goers alike. If you're worried about space, make the text small. Small text is better than no text (or even hover text).

I'd suggest that pressing "Details" expands the history item area with additional info instead of using a popup like it currently does. And rather than using up and down arrows for send and receive, use + and - to indicate debit from or credit to your account.

Your send form doesn't seem to include transaction priority or the "sweep unmixable" button.

Some additional areas for hover info:

Details should include ring size, number of confirmations, and the receiving address if available (is it against monero policy to store the address you sent a transaction to?).

@sanderfoobar
Copy link
Contributor

+proposal

@gene-telligent gene-telligent mentioned this issue Jul 2, 2018
Closed
@jonathancross
Copy link
Contributor

Hi All, there has been significant changes to the GUI since this proposal was last discussed. Many of the changes (or solutions to related issues) have been incorporated already. I suggest we close this issue.

@fresheneesz
Copy link

If we close this, can we enumerate the issues brought up here that have not been incorporated already? Perhaps it's worth making a new issue that focuses just on those.

@xanoni
Copy link

xanoni commented Sep 5, 2021

For awareness, wanted to make sure this is linked to these PRs and issues:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
proposal
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests