Bay 12 Games Forum

Please login or register.

Login with username, password and session length
Advanced search  

Author Topic: Trade Screen - Better Identification of Merchant vs. Fortress  (Read 8907 times)

Rekov

  • Bay Watcher
  • Elf Aficionado
    • View Profile

This is mostly a suggestion keeping in mind the new players we all assume the steam release will draw to the game. We veterans know full-well that the merchant is on the left, and our fortress on the right. Even knowing this, however, it took me a few moments to find any actual indications of this on the new trade screen. I imagine it might not be as obvious to entirely new players.

The only identifying information is small text, "Merchants from Etesîton" on the one side, and "Gósmerkûbuk" on the other. This text is the the same size as the otherwise detailed information below it.

Here is my proposed redesign. This is just me playing around with various changes, many of which could be made in isolation.

1. The faction identification is moved to the top, and enlarged.
      Optionally tinted with faction-appropriate colors for further differentiation.
      Further still, might be better to replace specific proper nouns with generic "Foreign Merchant Goods" and "Fortress Goods."

2. Value/Profit/Weight information also moved to the top. It's slightly easier to see here, and in-line with the goods' Value info.

3. Buttons are moved to a single row, and made pseudo-symmetrical.

4. Search bars are moved to the bottom. They're less in the way of more important information, and require less mouse movement between the buttons. This may or may not be relevant depending on whether they'll be active by default, or you'll have to click into them before typing, but still.


Spoiler: "Rekov's Trade Screen" (click to show/hide)
Spoiler: "Current Trade Screen" (click to show/hide)
Logged

Mr Crabman

  • Bay Watcher
  • A person with the head and pincers of a crab.
    • View Profile
Re: Trade Screen - Better Identification of Merchant vs. Fortress
« Reply #1 on: June 17, 2021, 03:52:18 pm »

I mean, it looks a lot better aesthetically, but in terms of functionality it's a bit less so (I wish there was an actual UX professional who was into this game/lurking on the forums, would be really handy to have that kind of expert input).

The faction info definitely needs to be more prominent, you're 100% right on that (took me ages to figure out how to tell which side is which), but you *might* have overdone the sizing a bit.

I'm not confident in the movement of the value/profit/weight info to the top, because it seems that you would want this information to be near the trade buttons, to minimize eye movement between them (as at the moment of deciding to trade, this would be important info to have), and if the value/profit/weight info is at the bottom, it might be better move the faction names to the bottom too (since all that space you've cleared for the faction name would be wasted up there), though maybe it could be kept at the top if it could be integrated with the topmost section (where the actual merchant is) somehow? It could make sense to have the representative of the faction right beside the name (only tricky part is where to fit their speech).

The search bar thing is... Difficult to decide on, because if you're not using it, it's definitely better at the bottom, but if you ARE using it, you want that on the top front and center, and in all other screens shown where there is a search bar, it's also at the top, so just for the familiarity it may be better to keep there.

The scaled merchant image... Toady said he wanted to center it, and I feel that might be good enough without enlarging it. One thing I definitely would want to see though is to have a "frame" around the merchant like with the items, because just having them casually in the UI whitespace like that is a bit weird (plus it would be nice to be able to click on/hover over their icon to see useful info about them).

The buttons... They look so much neater like that, but unfortunately, thinking of the mouse travel here.... It's not great to have the UI elements spread out so far from each other; maybe it would make sense to turn the mark/unmark buttons into a single toggle-able checkbox/icon (instead of being a text button) and have it aligned with the checkboxes in the item list? Since it has pretty much a similar function to the toggle boxes on the "item group tabs" anyway, and with a tooltip and good icon it should be clear what it does.

Continuing the "golden line" between the merchants and your fort might be a good idea (to further differentiate the seize and offer buttons); when it comes to the trade button, it could split both ways and "surround" the trade button, to indicate the nature of the trade being mutual/in between the 2 screens. On that same note, the trade button could maybe stand to be enlarged a bit/emphasized compared to the other buttons.

Finally, not a criticism of your design in particular; the weight thing might make more sense/would have a clearer meaning on the merchant's side, since the weight is relevant to the merchants caravans; but then again, it's also about how much you are offering them...

Fleeting Frames

  • Bay Watcher
  • Spooky cart at distance
    • View Profile
Re: Trade Screen - Better Identification of Merchant vs. Fortress
« Reply #2 on: June 17, 2021, 09:08:19 pm »

Maybe the search bar could be collapsible? So just the magnifying glass when not use, and entire bar when you click the glass. Click again to hide it.

Mobbstar

  • Bay Watcher
  • aka Mossbird
    • View Profile
    • my website
Re: Trade Screen - Better Identification of Merchant vs. Fortress
« Reply #3 on: June 17, 2021, 11:14:51 pm »

The buttons... They look so much neater like that, but unfortunately, thinking of the mouse travel here.... It's not great to have the UI elements spread out so far from each other; maybe it would make sense to turn the mark/unmark buttons into a single toggle-able checkbox/icon (instead of being a text button) and have it aligned with the checkboxes in the item list? Since it has pretty much a similar function to the toggle boxes on the "item group tabs" anyway, and with a tooltip and good icon it should be clear what it does.

I agree with this. Many people already know this checkbox behaviour from elsewhere (empty, square=partial, checked). More importantly, though, even if the mark/unmark stay regular buttons, they should be visually distinct from the seize/trade/offer buttons by virtue of being revertible non-final actions.

Rekov

  • Bay Watcher
  • Elf Aficionado
    • View Profile
Re: Trade Screen - Better Identification of Merchant vs. Fortress
« Reply #4 on: June 18, 2021, 11:51:55 am »

I take a lot of your points, Mr_Crabman. I think your idea of a global checkbox is a good one, though I personally have not had any luck getting something that looks great. Part of the problem is having to deal with the scrollbar, which is only present when needed.

fig. 1


fig. 2


fig. 3


As you can see, the spacing can get awkward. One option is to have the scroll bar run all the way to the top, as in fig. 2. This is what Windows File Explorer does. Its scrollbar extends past the header, even though the header doesn't scroll.

A better option might be to move the checkboxes to the left side. That way you don't have to deal with the scroll bar in terms of alignment.
Logged

Mobbstar

  • Bay Watcher
  • aka Mossbird
    • View Profile
    • my website
Re: Trade Screen - Better Identification of Merchant vs. Fortress
« Reply #5 on: June 18, 2021, 02:44:18 pm »

A better option might be to move the checkboxes to the left side. That way you don't have to deal with the scroll bar in terms of alignment.

If the entire line can be clicked to toggle its checkbox (proximity to the scrollbar for efficiency) then this sounds like a good solution to me. However, this would be dicy for category headers, since those also need to support a "collapse" action.

Pillbo

  • Bay Watcher
    • View Profile
Re: Trade Screen - Better Identification of Merchant vs. Fortress
« Reply #6 on: June 21, 2021, 11:58:25 am »

I like Rekov's changes, but I'd leave the search bar at the top too. Search filters are usually at the top of a GUI, it's where users would expect it. I don't see that being less important to anyone except old player's who are set in their ways.
Logged

Rafal99

  • Bay Watcher
    • View Profile
Re: Trade Screen - Better Identification of Merchant vs. Fortress
« Reply #7 on: August 16, 2021, 11:36:19 am »

I like your version, but normal-sized font would suffice.
To add my 2 cents, I would really sorting-by-value to be possible in the trade screen, the same way as it is possible in "Bring items to Depot" screen.
Every time I trade I try to find the cheapest items to buy, and most valuable to sell, and sorting would greatly help with that. I can do some preliminary filtering in "Bring items to Depot" screen, but frequently items are in bins, or I don't know how many I need to bring so I bring all, so the sorting in Trade Screen would greatly help too.
Logged
The spinning Tantrum Spiral strikes The Fortress in the meeting hall!
It explodes in gore!
The Fortress has been struck down.

Pillbo

  • Bay Watcher
    • View Profile
Re: Trade Screen - Better Identification of Merchant vs. Fortress
« Reply #8 on: August 17, 2021, 04:36:50 pm »

Sort by value would be great if it's not already planned. I do the opposite of Rafal99, I try to sell as many objects as possible so I start with getting rid of every cheap item I can before getting rid of the expensive stuff. It would also be handy for making sure the artifacts I accidentally mark as for trade don't get sold.
Logged