General UI discussion

[tkashkin]

Some users find GameHub UI confusing. I also think it may be confusing for new users.

Use this issue for general UI related feedback and suggestions.

[treymerkley]

An easy fix might be to add UI and navigation information to the wiki with a link built into GameHub, and then slowly work on long-term UI improvements.

Edit: Now that I think of it, you could just lean super hard into being a Steam Big Picture clone and then build from there.

[Saroufim]

Perhaps decreasing the number of buttons on the headerbar can be a good start? IMO, you don't need a UI button for every source. You can have a popup with tickboxes instead.

[neuromancer]

1. Perhaps the first time, GameHub can highlight the different screens or buttons to guide the user.
2. We could revive the old "recent games" screen idea if this is somehow better for users (at least, it is very common in game stores nowadays..)

[neuromancer]

Additionally, the use of a small blue dot for games wuith updates available is too difficult to see..

[Lucki]

I don't have that first user (and maybe confusing) experience anymore. I'm generally confident with the design but what really bugs me is that the settings and details screen (and some more) really don't fit into the design. They're using the old gtk2 window bar and the elements are sometimes misaligned. The new settings content looks really good though 👍 .
Not sure how to make this better, maybe:

• If you want to keep the popup dialog use a pre-build one from gtk?
• Or maybe blend the main view over into the settings menu?

Also there's the hidden functionality. Gamehub looks really easy but is also really powerful by digging deeper. This is good and I like that, keep it clean and simple but I still remember this very enlightened moment. When someone finds that additional functionality it has to be clear what it's doing.

[dreamer]

Hello everyone; I asked for the creation of this issue in #300.

For a bit of context: I tried using GameHub in the past (several times, actually), but each time I bounced off due to bugs and overall unintuitive design. I spent some time over last few days trying different things and so far I found 4-5 outright bugs and several inconsistencies. One of bugs was so severe that normally I would've uninstalled GameHub already (GH "removed"/permamently hides a game from my GOG library after I disabled Steam integration). As I'll have some time I will report these bugs in their specific issues.

I am software developer, use Linux for 15+ years and I think I understand reasons behind certain design decisions you made when developing GameHub UI (I even can pinpoint probable root causes for some bugs - like game being shown as "installed" after cancelling installation) - but newbie user won't be able to handle it and will bounce right off.

All my points are based on GameHub 0.14.2.1, packaged in Fedora and use default Gnome 3 theme. If there are some significant changes on master branch, I can test those as well.

@tkashkin Thank you for creating this issue - overall I think functionality behind GameHub interface is stellar and appreciate the way you handle things around here. UI design is hard and interface that is convenient for developer/tester might not be the best interface for end-user.

@Saroufim In my opinion Header Bar is one of areas that is ok already and is not in urgent need or redesign.

@Lucki I think that conclusion, that interface is good already is affected by survivor bias - to make GH more appealing to more users UI-wise you need to ask opinion of new users and their first-time experiences. Ideal way would be to organize some testing with new users (e.g. with screen sharing) and observe what is causing them problems.

OK, so now the most basic interaction with GameHub post installation. When writing this post I wanted to double check what version of gamehub am I running…

Usecase 1: check version of GameHub

As advanced user, who spends most of the time in terminal, for me it's natural to try:

[dreamer_@case ~]$ gamehub --version
bash: gamehub: command not found...

Welp, I don't know how new user is supposed to know that gamehub binary is called com.github.tkashkin.gamehub by default.

OK, so maybe there's "About" dialog in application/hamburger/"Primary" menu - just like e.g. Gedit or Nautilus or Lollypop or almost any other Gnome application? Nope - menu triggers "Settings dialog", which is different behaviour than any other Gtk-based application. So maybe it's in application menu - there's "Show Details" in there, which triggers Gnome Software that informs me "Unable to find com.github.tkashkin.gamehub.desktop".

Version and related information is actually hidden in the very bottom of "Settings" dialog. It does not make much sense.

Usecase 2: log-in to Steam/GOG/Humble

It is mostly ok. I think it could be improved, but it's very low-priority. It is a bit annoying that this interface is not skipped automatically on second start of application and even when I change preference to skip it - UI flashes for a fraction of a second when GH starts, but these are not huge issues.

Usecase 3: Browsing my collection

I don't like default "huge banners" interface and "list" interface has bad default settings, but these are more of a personal gripes. Elements I find weird:

• Some games have "dot" in bottom-right corner of banner / to the right of their name. I have no idea what is this supposed to mean. Hovering over banner does not show any tip, it's impossible to hover over it in "list" interface, because scrolling interface appears over the dot.
• List view: Why 16px icons next to the game name are enabled by default? They are too small to recognize any details, do not serve any purpose and can't be preloaded for all games - it's annoying.
• I went over my "monthly IGDB request quota" in less than 2 hours of using GameHub. Why IGDB is enabled by default if their default quota is so low?
• Clicking on banners sometimes does not trigger install dialog, sometimes dialog appears with a delay (I suggest making request to GOG api on hover or mouse press, not on mouse release - it'll speed it up from user perspective)
• Search by typing does not work (it works in most Gnome applications)

Overall a bit confusing, but not a deal-breaker.

Usecase 4: Install a GOG game

This is a mess. It's nice that GH offers advanced options and tweak on installation… but almost all of them should be hidden by default.

Few screenshots:

• Innoextract is "Compatibility layer"? Can I use it to run my game?
• If you know that Innoextract 1.7 is buggy, then why is it selected by default? If 1.8 is needed, then you need to make >= 1.8 a dependency for your application, otherwise packagers won't care to upgrade dependency.
• I have no idea what "Import" button is supposed to do. And why is it presented in Install dialog. Clicking it prompts me to select a directory and I have no idea what directory and what for.
• Why "Download" button is in here? I asked other user what he thinks about this UI and he was convinced you need to click "Download", otherwise "Install" won't work. Also, clicking "Download" does not give proper feedback. I just clicked it to download X-COM: UI froze for a moment, then dialog closed and nothing changed. From my previous attempts I know that downloads appear after clicking on arrow button in top-right corner - but there are no finished downloads in there - it's greyed out.
• Information about installer size is useful, but not enough - user needs more context here (how much space do I have available?)
• There is no icon indicating that this is Windows installer

This installer window has different size and different layout than previous one. Installer size is shown in different location. And it instructs me to "select" installer when there's only 1 shown.

Installer windows has "Install" button grayed out… In other places throughout GH UI useless functionality is hidden by default - so why is Mac installer available here?

Separating Download and Install functionality would streamline the interface here.

Offering all available installer language versions in here is… too much.

Switching "Compatibility layer" changed UI layout again… But another confusing part: when I don't have Steam running in the background, Proton does not appear as "compatibility layer"… Why?

For Linux installers GH selects all defaults and does not give user an option to change them when installing a specific game… So why do you offer GOG-Innosetup options in UI here? These should be hidden in some advanced options, or not exposed to the user at all. I know what these flags do, but what is normal user supposed to expect after clicking "Silent installation" or "Very silent installation"?!

Following combination of flags will just work by default and show progress bar to the user: /NOGUI /SUPPRESSMSGBOXES /SILENT /DIR=<path>.

In next post I will try to prepare mockup for more streamlined interface for Install dialog.

[tkashkin]

I'm currently rewriting and redesigning installation dialog.
I'm thinking about splitting installation options into separate small steps.

There's still a lot of work to do, but here's how it looks now:

Installer selection

• Installer selection step is skipped if there's only one installer
• Installers are sorted by platform and language
• macOS installers are not selectable, but can be downloaded (there's no reason to restrict it)

Installation directory selection

• Directory selection step is skipped if there's only one directory
• Multiple directories are supported. Directories can be added in Settings. Automatic games import may be implemented in future (Detect native GOG installed games in their default folder #189)
• Free disk space is shown
• Selected installer from previous step (or automatically selected installer if step was skipped) is shown

Other steps are not implemented yet.

What do you think and do you have any suggestions?

[Lucki]

Please keep in mind that I'm a experienced user but here some thoughts:

• macOS installers are not selectable, but can be downloaded

Not sure if that download selection is supposed to happen in the shown dialog but the list entries are grayed out which usually indicates a non-functional/disabled UI element to me and I would be surprised if I'm able to select and do something with them.

• Directory selection step is skipped if there's only one directory
• Multiple directories are supported. Directories can be added in Settings.

Questions and possible solutions I have from this screenshot:

• If I'm new to gamehub and haven't looked at the settings before or forgot it: How I'm able to add other locations?
  • Adding a quick link to the relevant settings page which gets updated live in the installer dialog, mutliple open dialogs, probably bad
  • Allow directly adding folders from the installer dialog similar to the settings counterpart
• Do the games get placed in a subfolder or is that the location they're get installed to?
  • Append the resulting game folder in a less visible manner
  • Make it clear that games are placed in a subfolder of the chosen location

---

More questionable questions:

• Are these non existing directories pre-defined, default by gamehub?
  • If not: I had to select them earlier in the settings, how can they be non existent? Manually deleted? Filesystem not mounted?
  • If yes: How can there ever be only one directory? Manually removed in the settings?
  • If I'm able to choose/select them, will they be created for me?
    • Adding a 'create folder' icon button before the list item is selectable

[tkashkin]

@Lucki good questions.

Not sure if that download selection is supposed to happen in the shown dialog

Downloading installers without installing them seems useful, and I'm not sure where else to place this functionality.

list entries are grayed out which usually indicates a non-functional/disabled UI element to me

That's an interesting UX problem. It should be somehow visible that it's possible to download an installer (if this functionality is still there), but not possible to install it. Would just inability to select it and disabled Next button in headerbar be enough?

Allow directly adding folders from the installer dialog similar to the settings counterpart

That's possible, directories list widget is already shared in both places and can optionally be editable. But there's a couple of problems:

• This dialog can potentially be used in multiple contexts (game, DLC, patch, maybe some custom .exe to run in Wine prefix, etc.).
• In this case skipping this step won't make sense, but it's likely most users will only have one directory.

Do the games get placed in a subfolder or is that the location they're get installed to?

Currently games are installed in a subfolder, but I have an interesting idea that may allow to support FSOverlay for all games and solve some issues with spaces in paths:

• Install games into a hidden directory like ${root}/.gamehub/${game_id}/game
• Make a symlink ${root}/${game_name} -> .gamehub/${game_id}/game or to mounted overlay if overlays are enabled

Are these non existing directories pre-defined, default by gamehub?

Default list for GOG is ~/Games/GOG (current GameHub default) and ~/GOG Games (default for native GOG installers). GameHub will try to import installed games from these dirs if #189 will ever be implemented.

how can they be non existent? Manually deleted? Filesystem not mounted?

Both are possible.

How can there ever be only one directory? Manually removed in the settings?

Yes. Or it's a DLC/patch and there's exactly one possible option.

If I'm able to choose/select them, will they be created for me?

Yes, GameHub will try to create required directories during installation.

[Lucki]

installer selection

Downloading installers without installing them seems useful, and I'm not sure where else to place this functionality.

Maybe mark the download arrow or next button with a tiny exclamation mark which explains on hover/click that it's download only? This is how Firefox makes a failed download visible:

Would just inability to select it and disabled Next button in headerbar be enough?

IMHO no. How could I interact with it and tell I want to download the installer? Clicking on the download arrow and going back/abort?

folder selection

Yes, GameHub will try to create required directories during installation.

If they get created anyway I don't need to know if they exist already. Here's a quick mockup which would make the created folder location more clear? Not sure.

Currently games are installed in a subfolder, but I have an interesting idea that may allow to support FSOverlay for all games and solve some issues with spaces in paths:

• Install games into a hidden directory like ${root}/.gamehub/${game_id}/game

• Make a symlink ${root}/${game_name} -> .gamehub/${game_id}/game or to mounted overlay if overlays are enabled

This is nothing about the UI anymore but installing in a different location and symlinking afterwards will probably make it unclear where the disk space will be used. Since you're trying to circumvent spaces in the path: couldn't ${root} already contain spaces which wouldn't make the workaround better?

Default list for GOG is ~/Games/GOG (current GameHub default) and ~/GOG Games (default for native GOG installers).

So a new user will see two location path options. It's likely he wants to install to another path and it should be easy to archive that when he just opened gamehub for the first time and pressed the install button. (Assuming he hasn't been forced into the settings by adding a gog account through an wizard)

---

I'm eager to see what others think.

[tkashkin]

I've done some small tweaks based on suggestions.

Installers

Now installers that can't be installed:

• Are explicitly marked as not installable
• Have same colors as installable, only icon is slightly transparent instead of the whole installer row
• Can't be selected
• Download button is active and looks active

Install dirs

• There is install dir name suffix
• Free space is also measured for directories that do not exist.
  GameHub tries to get fs attributes for parent directory recursively, so it should show free space for closest mounted filesystem.

---

How could I interact with it and tell I want to download the installer? Clicking on the download arrow and going back/abort?

I think download button should have multiple states:

• Download - initial state
• Cancel download - after download is started, should show download progress
• Completed - if installer is already downloaded, should open directory with downloaded file

[Lucki]

download button

I wasn't aware that was a button. Maybe because it's only a picture.

Looks good IMHO.
Personally I would like to be able to add new directories in the selection window but I'm also more thinking of manually setting up games instead of the automatic installation which is a different case.

[ghost]

Heya. 🙂
I started to use GameHub recently and I must to say it's a very great software, I'd not expect it would evolve so far and however so quickly.
I am actually thinking about putting my games on Linux, so I know what I'll use now.

However there's still things to improve in UI domain, and if you want some suggestions tkashkin, I can give you points I'd change first if I was at your place, but in a nutshell : it sounds like "take example on Playnite".

1. Global personnalization
Playnite allows users to customize its user interface in a lot of details ; GameHub doesn't and is still a bit limited despite of its dark theme. Indeed, it's not made with the same techs (written in Vala with gnome libs) than Playnite (C#/.NET), but I don't think it's such a problem.

2. Being able to disable the "Install" startup page
It's annoying to be always forced to click on "Skip" button just to directly access its games.
... Unless I missed this feature since the begin, but so where is it ?

3. Improve game presentation sheets
I am not sure "sheets" is the correct word, but you'll probably get my point. GameHub's description sheets are not especially ugly, but they could be a lot better. The grey aside used as backgrounds for data fields and summaries doesn't look very good.
And besides all, there's NO WAY to give a specific background image to each game description... let's compare GameHub with Playnite on this domain.

GameHub
https://i.ibb.co/LzxrGpS/list-1024x613.png

Playnite
https://i.ibb.co/nkPJR5V/5.jpg
https://i.ibb.co/nCx4yZQ/raw.png
(the second one to put the finger again on the magic of customization)

I must to say: GameHub's global design is nice, very nice to see, refined... the "uglyness" is about game descriptions sheets. It looks like my first web pages with HTML/CSS (well tbh my pages were worse but HM).

4. if possible... try to remove "refreshing" when switching between game entries ?
Hmm, I doubt it's my PC configuration since I've a very good one. So it's probably GameHub ; when I switch quickly through entries, it looks like the view is literally, in a second level, deleting everything and showing the recently selected entry's description.
It seems like a unimportant detail but it can be very annoying to picky people like me. 😛

Well, that's all I would recommand. If GameHub could make such progress it would be really nice.
In the meantime, you have my full support. Keep it up!

[tkashkin]

@Parnosys

2. Being able to disable the "Install" startup page
   It's annoying to be always forced to click on "Skip" button just to directly access its games.
   ... Unless I missed this feature since the begin, but so where is it ?

Disable sources you don't use in Settings.

[ghost]

@tkashkin
Oof. Ok, I didn't saw that, my bad. So well, what do you think about my suggestions?

[Nonononoki]

I'd like to suggest something. It's very intuitive that you have to click on the small Skip Button on the top right EACH TIME you want to access your game. I'd love to have that button right above the Steam Button, which makes it clear for new user on what to do after setting up your accounts. Maybe name it something play "Play" instead of "Skip".

[tkashkin]

@Nonononoki yes, it's not exactly intuitive and will likely be changed in future, but this screen is not shown when user is authenticated in all enabled game sources. It's possible to disable sources you don't use in Settings.

[Jabster28]

It's possible to disable sources you don't use in Settings.

maybe it could automatically disable the ones that aren't authed when the user presses skip?

[shakeyourbunny]

Move the search bar from the top of the list to the left above the game list. In addition add some keyboard navigation in the list (cursor keys, Home = 1st game, End = last game, page up / down = browse a page up / down). Also fix the scroll bar.

make tags collapsable in the game list.

The application in general is very sluggish if you have more than some hundred games (I have about 12.000 - 14.000, and it is getting REALLY slow and eats up my RAM).

[vasti]

How do I update already installed games?

Specifically - I have some games installed from GOG. I see that there are installers for a newer version on GOG's website, but no way that I can find to update it.