Graphene GUI testing and feedback

[Louis]

@DestBest woah that seems like a nice idea. That way an user could see if his portfolio grew in value throughout time in relation to a certain currency, like BTC for example. That would be a nice addition. Not one that is really needed but a fancy one. That's the type of stuff that will make the user have an attachment to the platform, those small details.

^^^^^This

[Akado]

@DestBest woah that seems like a nice idea. That way an user could see if his portfolio grew in value throughout time in relation to a certain currency, like BTC for example. That would be a nice addition. Not one that is really needed but a fancy one. That's the type of stuff that will make the user have an attachment to the platform, those small details.

[DestBest]

Dropping this here: A cool way to display your portfolio data (www.c*inigy.com)

[tbone]

@svk: Another suggestion. It would be helpful if there was greater visual distinction between the order book boxes and the history box.  For that and other reasons, I highly recommend removing the color coding from the bid and ask values since the colors don't vary from one value to the next (so the values themselves don't need to be color coded, just the box itself).  On the other hand, the color coding of the trades in the history does vary and therefore the individual values should remain color coded. 

In addition to the thin line in the headers of the bid and ask order books, you could also color code the entire header.  You can also place a thin box around both the bid and ask columns, which would have the additional benefit of calling attention to specifically which columns are the bid and ask columns.  I also recommend changing the bid/ask column headers to "Bid" and "Ask" instead of both saying "Price".  See image below.

On another note, the chart has become a bit short, too short to reasonably display indicators.  I think that is fine as the default, but it would be really nice if the user could choose to expand its height.  Perhaps you can put a gear icon in the chart header to select chart height: short, medium, tall?  Or even better, can the chart be sized by grabbing the bottom edge of it and dragging it down/up?  That would be great if it's possible.

[tbone]

@svk:  My suggestion to combine buy/sell was really only to save enough space in order to put the My Orders box on the second row.  But if you can do so without combining buy/sell, I agree that it's unnecessary to combine them at this time.

Speaking of My Orders, my suggestion to add My Positions was to show ALL positions, not just the positions for the current market.  This way we can see how our positions are doing without leaving the trading screen.  If we can add (either now or at a later date) P/L for each position, that would be great.  Also, each position should have a link which loads that market into the current view.  This would b a nice enhancement.

As for the mirrored order books, I'm glad we agree that it makes more sense that way.  Although perhaps we could give users the option.  Maybe the order book could have a gear icon that allows the user to choose 1) mirrored or not, and 2)  bid/ask vs. ask/bid (even though I've never understood why anyone would ever want to reverse the bid and ask window positions). 

[Akado]

I could swear on my Open Orders my METAFEES order for METAEX.BTC wasn't showing. Then I went to the market pair and it was there, then I went to my Open Orders tab and it now appears.

[svk]

Might not even be necessary to combine the buy/sell; how does this look to you all:

[svk]

@svk, very nice move narrowing the buy/sell boxes.  That's a nice enhancement on the vertical layout since the most critical live data elements were already visible.  Unfortunately it doesn't help much on the horizontal layout considering you still have to scroll down to place an order (unless you want to do it blindly i.e. without seeing the all-important order book, which is off the page now).  So now you pretty much always have to scroll to do anything on the horizontal layout, instead of having to scroll only when actually placing an order.  None of the serious UIs are set up like that, and this is one of Poloniex's biggest flaws.  I won't push for it anymore, but I do still hope we can correct that.  If/when we do, I have some additional suggestions for enhancing the horizontal layout.   

As always, thanks for your work on this.

Not sure what more I can do here tbh, on my screen which is 1920x1080 I can now see most of the price chart and most of the orderbook at the same time in horizontal mode, and everything easily in vertical mode. So you would still prefer the orderbook to be on the first row with buy/sell below it?

Thanks a lot for your feedback btw, it's much appreciated!

I would say yes, the order book should be on the first row (along with the history).  There's nothing to gain (only something to lose) by having the buy/sell boxes on the first row because you can't place an order without simultaneously looking at the order book, so you have to scroll in order to place an order either way.  Unless of course you can see both rows without scrolling, in which case you don't care very much about the order of the first 2 rows to begin with. 

As for placing the order book and history on the same row, your newly sized history box proves that it's perfectly viable since each order book box requires no more space than the history box does.  I highly recommend putting those elements together on the first row since it's important for them to be visible along with the chart at the same time.  See my mock-up below.

As for the 2nd row, you may notice that my mock-up also demonstrates we can combine buy and sell into one box in order to avoid needing a 3rd row.  So for those with high enough resolution, now they can see everything without scrolling.   And for those with lower resolution, the need to scroll is minimized.  That would be a nice improvement.  Keep in mind that not all crypto trading sites employ separate buy and sell order boxes.  And I don't think I had ever seen such a thing prior to crypto trading.  I really don't understand what the purpose is.  Seems like it's just a waste of space.

Lastly, also demonstrated in the mock-up below, I would like to propose orienting the order book so the buy side mirrors the sell side such that the bid and ask columns are immediately adjacent to each other.  This is a superior layout for the horizontal order book as it offers one of the great benefits of the vertical order book, but in the horizontal orientation. 

Great stuff once more, sometimes it's incredible how you get fixated on how things are until you suddenly see the light. Not once recently have I considering merging the buy/sell but that's what's we had in BTS 1.. I'd prefer to do it like in BTS 1 though where you have to switch between buy/sell, because of how the prices need to be handled. It might work the way you show it but it'll probably be a bit complicated.

I think I was a bit tired when I last read your feedback though cause I never got the fact you wanted the history with the orderbook but of course that makes sense.

"My positions" would have a maximum of 2 positions but I suppose it would be handy to have there.

Edit: Forgot one thing: I actually used to have the orderbook mirrored like you suggest, but think I removed it because people were complaining about it not being the same as Polo... I do agree that it's far more convenient that way though. Anyone else have an opinion on that?

[tbone]

@svk, very nice move narrowing the buy/sell boxes.  That's a nice enhancement on the vertical layout since the most critical live data elements were already visible.  Unfortunately it doesn't help much on the horizontal layout considering you still have to scroll down to place an order (unless you want to do it blindly i.e. without seeing the all-important order book, which is off the page now).  So now you pretty much always have to scroll to do anything on the horizontal layout, instead of having to scroll only when actually placing an order.  None of the serious UIs are set up like that, and this is one of Poloniex's biggest flaws.  I won't push for it anymore, but I do still hope we can correct that.  If/when we do, I have some additional suggestions for enhancing the horizontal layout.   

As always, thanks for your work on this.

Not sure what more I can do here tbh, on my screen which is 1920x1080 I can now see most of the price chart and most of the orderbook at the same time in horizontal mode, and everything easily in vertical mode. So you would still prefer the orderbook to be on the first row with buy/sell below it?

Thanks a lot for your feedback btw, it's much appreciated!

I would say yes, the order book should be on the first row (along with the history).  There's nothing to gain (only something to lose) by having the buy/sell boxes on the first row because you can't place an order without simultaneously looking at the order book, so you have to scroll in order to place an order either way.  Unless of course you can see both rows without scrolling, in which case you don't care very much about the order of the first 2 rows to begin with. 

As for placing the order book and history on the same row, your newly sized history box proves that it's perfectly viable since each order book box requires no more space than the history box does.  I highly recommend putting those elements together on the first row since it's important for them to be visible along with the chart at the same time.  See my mock-up below.

As for the 2nd row, you may notice that my mock-up also demonstrates we can combine buy and sell into one box in order to avoid needing a 3rd row.  So for those with high enough resolution, now they can see everything without scrolling.   And for those with lower resolution, the need to scroll is minimized.  That would be a nice improvement.  Keep in mind that not all crypto trading sites employ separate buy and sell order boxes.  And I don't think I had ever seen such a thing prior to crypto trading.  I really don't understand what the purpose is.  Seems like it's just a waste of space.

Lastly, also demonstrated in the mock-up below, I would like to propose orienting the order book so the buy side mirrors the sell side such that the bid and ask columns are immediately adjacent to each other.  This is a superior layout for the horizontal order book as it offers one of the great benefits of the vertical order book, but in the horizontal orientation. 

[tbone]

Yea I had this functionality in before but realized it wasn't adding up sums correctly so I decided to disable it until I could find the time to revisit it and see if I could implement it properly.

Trackable here: https://github.com/cryptonomex/graphene-ui/issues/758

Looks like you closed this out already.  Great!

[svk]

I noticed an issue earlier in the week and finally had a chance to finish writing it up.  This is a case where we should be emulating Poloniex because they are getting it right.  Basically, when you click on the order book, you are generally looking to do 1 of 2 things: either 1) you to want place an order on the book, or 2) you want to match one or more orders already on the book.  The buy/sell windows should be populated accordingly, but that's not happening.  And it's far more problematic than most would imagine. 

As an example (see image below), if you click the 4th row of the ask side, you are either looking to place your own ask onto the order book at that price, OR you want to match the orders on the ask side up to that price.  So 2 things should happen: 1) the sell window should be populated with the price you clicked in case you want to place an order on the ask side of the book at the clicked price, and 2) the buy window should be populated with a) the price you clicked, b) the sum of the share amounts on those first 4 rows, and c) the sum of the prices of the shares available on those 4 rows.  This allows you to see how many shares are available up to the price you are willing to pay before either clicking buy or clicking further down the book if you need more shares. 

Not having the order book behave in this manner is a major drawback.  In my estimation this is one of a small handful of things that is preventing Bittrex from getting much if any traction at all. In any event, please check out Poloniex to see how it should work.  Hopefully we can get this into the next update.  Thanks @svk!

Yea I had this functionality in before but realized it wasn't adding up sums correctly so I decided to disable it until I could find the time to revisit it and see if I could implement it properly.

Trackable here: https://github.com/cryptonomex/graphene-ui/issues/758

[svk]

@svk, very nice move narrowing the buy/sell boxes.  That's a nice enhancement on the vertical layout since the most critical live data elements were already visible.  Unfortunately it doesn't help much on the horizontal layout considering you still have to scroll down to place an order (unless you want to do it blindly i.e. without seeing the all-important order book, which is off the page now).  So now you pretty much always have to scroll to do anything on the horizontal layout, instead of having to scroll only when actually placing an order.  None of the serious UIs are set up like that, and this is one of Poloniex's biggest flaws.  I won't push for it anymore, but I do still hope we can correct that.  If/when we do, I have some additional suggestions for enhancing the horizontal layout.   

As always, thanks for your work on this.

Not sure what more I can do here tbh, on my screen which is 1920x1080 I can now see most of the price chart and most of the orderbook at the same time in horizontal mode, and everything easily in vertical mode. So you would still prefer the orderbook to be on the first row with buy/sell below it?

Thanks a lot for your feedback btw, it's much appreciated!

[tbone]

I noticed an issue earlier in the week and finally had a chance to finish writing it up.  This is a case where we should be emulating Poloniex because they are getting it right.  Basically, when you click on the order book, you are generally looking to do 1 of 2 things: either 1) you to want place an order on the book, or 2) you want to match one or more orders already on the book.  The buy/sell windows should be populated accordingly, but that's not happening.  And it's far more problematic than most would imagine. 

As an example (see image below), if you click the 4th row of the ask side, you are either looking to place your own ask onto the order book at that price, OR you want to match the orders on the ask side up to that price.  So 2 things should happen: 1) the sell window should be populated with the price you clicked in case you want to place an order on the ask side of the book at the clicked price, and 2) the buy window should be populated with a) the price you clicked, b) the sum of the share amounts on those first 4 rows, and c) the sum of the prices of the shares available on those 4 rows.  This allows you to see how many shares are available up to the price you are willing to pay before either clicking buy or clicking further down the book if you need more shares. 

Not having the order book behave in this manner is a major drawback.  In my estimation this is one of a small handful of things that is preventing Bittrex from getting much if any traction at all. In any event, please check out Poloniex to see how it should work.  Hopefully we can get this into the next update.  Thanks @svk!

[tbone]

@svk, very nice move narrowing the buy/sell boxes.  That's a nice enhancement on the vertical layout since the most critical live data elements were already visible.  Unfortunately it doesn't help much on the horizontal layout considering you still have to scroll down to place an order (unless you want to do it blindly i.e. without seeing the all-important order book, which is off the page now).  So now you pretty much always have to scroll to do anything on the horizontal layout, instead of having to scroll only when actually placing an order.  None of the serious UIs are set up like that, and this is one of Poloniex's biggest flaws.  I won't push for it anymore, but I do still hope we can correct that.  If/when we do, I have some additional suggestions for enhancing the horizontal layout.   

As always, thanks for your work on this.

[tbone]

@tbone why would you not want buy/sell just below the price chart? btc-e, bittrex, poloniex, yobit, bleutrade etc. does this.. esp for people who have low res, you'd have to scroll down to find the button. makes sense to me both intuitively and to get people to click the buy and sell button.

By the way, I forgot to mention that both Bitfinex and Coinbase Exchange both have their trading page laid out such that you can see the order book, ticker and chart without scrolling.  Bitfinex actually places their chart (collapsible) between the buy/sell boxes and the order book / ticker.  Clearly they recognize that it's not helpful to let the buy/sell box force the user to scroll back and forth between the important live data screen elements.

Anyway, I also took a look at OKCoin and BTC-China this evening, and both UIs also position the order book, ticker and chart on the screen such that no scrolling is necessary.  For what it's worth, Bitfinex, OKCoin, Coinbase Exchange, and Bitstamp are the top 4 bitcoin exchanges in the world.