Friday Facts #238 - The GUI update (Part II)

[QGamer]

Its...beautiful So...beautiful. But the colors are a bit too vibrant. Factorio has a muted color scheme, and the colors in this technology tree are too vibrant. Please tone down the colors a little bit.

And for the featured technology view: The terms "Queue" and "Queued" are too similar. I get the feeling that many players will look at the first few letters and not notice the distinction. Instead, have it say, "Available," and "In queue." Have the button to add to queue be in one of the corners (bottom-right?). Also, we'll need a button for queued items that says, "remove from queue."

Also: How can I change the order of items in the queue? For example, what do I do if I suddenly realize that I want to research Shotgun Shell Damage 2 before nightvision goggles?

Also as an aside for the blueprints: I agree that the buttons in the top right corner are not obvious. I'm glad that you're thinking about standardizing it. The idea is to look at a button and immediately figure out what it does. Currently, the buttons in the blueprint confirm screen do not live up to that standard.

I remember when I first played Factorio version 0.15 after getting used to 0.14. The difference was stunning. I predict that the experience will be the same when I play 0.17 for the first time.

Great work

[Avezo]

Why different research needs different unit times anyway?

[IronCartographer]

Where's this confirmation button? I still can't see it.

It's the green checkbox in the top right of the blueprint window screenshot, not on the tech tree mockups.

Why different research needs different unit times anyway?

FFF #106 -> Eei value: Easier progression at the start, before the challenge ramps up.

[Mike5000]

Promoting research queues and FNEI from mods to vanilla will be good as they can be linked deeper into the game than is possible for mod authors.

But Candy Crush colors????? Looks pre-alpha.

I'm also in favor of standardizing the GUI. Please give a thought to default key bindings while you're at it. But it's hardly a priority.

Let's take a step back. Who was complaining about the old GUI? No-one! Why not fix map generation instead? RSO is just about essential these days. Or fix trains so we can avoid thundering herds without LTN? Or enhance power cables to use the robust circuit mechanism instead of the brittle Array[5]?

[HurkWurk]

seconded on STANDARDIZED interfacing. all buttons that do the same thing should look the same and be in the same place on the interface.

[Gecko]

This new design looks amazing! it's so pleasing to the eye. The colors clearly say what is what and the intensity and vibrant look adds so mutch to the research GUI. Also the descriptions are way better now. Man... sometimes with those updates... I remeber the old days. I would say all in all Factorio changed for the better.

I wish it could be like that every where in the game. Colors on gray look so good. And you can abuse this fact to your advantage! Srsly f*** standards if I can have it so beautiful!! Freedom for all the buttons!!

Look at the poor little blueprint window, it looks somehow wrecked. Even pale, outdated, old, soo simplistic, without contrast? Anyways in comparison to the new magnificent research GUI it just looks bad. Albert is absolutely on the right track there!

Love what you are doing there! Keep it up!

[Ben R4m-Z]

Could you add a feature that automatically queues research for you when you click on a certain tech?
Like a "Queue Pre-Requisite Technologies"" button or something....
That would make a lot of things much easier and allow you to focus on building while the research does all the work....
Just a thought I had while reading.
Ben R4m-Z

[Charidan]

I wanna start with that I really like the direction this is taking and I think it's an improvement overall. I need to make that clear in advance though, cause most of this post is gonna be suggestions on fixes to it.

Good:

• The queue
• The way progress is displayed on a research card
• Large research description appearing in the tree (it looks a little out of place but I like the idea).

Needs Improvement:

• Queue and Queued are too similar, both the text and the colors.
• It looks like the tiny bottom strip on a research card is a button, as opposed to making the entire card clickable. I would expect the whole card to react to clicks the same way. Single click to focus the tree on the right, double click to add/remove from queue, and drag to insert into a particular part of queue (or drop back into the list as a dequeue).
• "Queue" option in the tree does not look like a button. Would be nice if it followed the same control scheme as the research cards in the list (the ones I just described above, although the "drag" option should probably spawn a temporary copy in the hand so you can't pull things out of the tree).
• Research level strip is incredibly inobvious. It looks like some super special modifier instead of a level counter. I feel like a level counter should go in the top right instead of the bottom right, but I can't explain why. Probably put the number in a circle instead of a strip and it'll look fine in either place. Consider making it look like a depression in the card instead of something on top, so it's more "part" of the research than an addition to it.
• The lines in the tree are hard to see, especially compared to the new high-contrast colors.
• The completed research green is very bright even though those are the least important research cards (you don't need to make choices between things you already have). Right now they're brighter than the other two colors, making them the focus. Dim those down.
• Do the science packs really need to be in a strip of a different color? It would help the one-ness of the card if there was less separation there. It looks like I'm seeing two rows: a research, and some unrelated science packs.

[maniak1349]

Buttons looking like buttons and more standardization please!

Some other thoughts:

• Technology tiles background colors are way to vivid and mess with readability.
• Those levels of UI transparency combined with blur effect are adding too much noise to the picture.
• Orange color does not really suit queue role and kind of misleading. It's midway between red and yellow while logically queued color should be between available (yellow) and researched (green). And I don't really think that separate color is necessary for queued technologies. Better make it highlighting in the queue window when it's mouse-overed in the tree or technology list.
• What if research requires more than 7 types of science packs? What if research provides more than 8 effects (like 50 of them)?

[tetryon]

Please fix the typo of 'Unavaliable' -> 'Unavailable'. (see combat robotics screenshot)

Literally unplayable!

[system]

Do I understand correctly, that you going to add local coop mode? So 2 players could use 2 cursors simultaneously?

[Therax]

1) Background colors are too saturated. Think not only about contrast between different elements (cards vs. surrounding backdrop) but different parts of the same element (technology icons vs. card background).

2) I agree with Kovarex that it is quite difficult to identify the "Research" button as actually being a button on first glance. An important principle of UX design is the call-to-action. Clearly differentiate between informational elements and elements that perform actions.

Some suggestions: interactable buttons ("Research") should be more saturated and more visible than buttons that are not currently interactable ("queued", "researched", "unavailable"). Consider the UI convention of "grayed out" items in menus when they are not currently available.

There should be more separation between the button and the icon frame, both in terms of color and actual negative space. Currently they blend into each other, and the button text has the appearance of being a title bar or caption for the technology icon.

[Koub]

How about a research interface that works like Galactic Civilization II's ?

Spoiler

2018-04-14 07_53_37-GalCiv2 v2.20 Twilight of the Arnor research panel.jpg (573.76 KiB) Viewed 5771 times

[Permittivity]

While reading the part about how you expect confirmation buttons to be in the bottom right, it occurred to me that might not be universal. Do right-to-left languages normally but those buttons in the bottom left?

IIRC, RTL languages are a common stumbling block for UI designs. Not only does text flow the other way, but also a common paradigm like forward and back arrows may need to be revised in cultures where the left facing arrow is the forward direction.

[Zool]

How about a research interface that works like Galactic Civilization II's ?

Spoiler

2018-04-14 07_53_37-GalCiv2 v2.20 Twilight of the Arnor research panel.jpg

ARGH, MY EYES !!!

[Snake_]

What about showing the names of products when hovering over a recipe? In the crafting menu or in the menu of the e.g. assembling Maschine.

This has been mentioned before but I don't know what the devs think about it.

[Philip017]

i like the integration of research que - i think it has been a feature that has been needed for a long time.
i think double click to add the research to the que, and right click it to remove it (in the que or in the main tree).
adding a deep tech should add all prerequisites of course. and removing a tech from the que will also remove everything that requires it.
suggest moving the red X to the top right as per the other functions in the game. or you can draw a red X in the corner when you highlight the tech in the que that is clickable to cancel it. right clicking anywhere in the card also cancels.
drag and drop also seems like something that could be considered as optional, but the double click to place it in the que is a must for me.
drag and drop can reorganize priorities. dragging a high level tech to the front also drags all prerequisites to the front as well, in order.

the colors are a bit vibrant for me (tone down the brightness and give it a more greyed look, can still keep the color choice)
we crashed on a alien planet after all - some thing (visually) could be wrecked in our ui if you go the "beautiful" route (sheared nuts, broken wires, torn metal panels, cracked screen)
i am perfectly happy with the plain route that you have used all this time and you can definitely keep it imo.

[Ilesere]

Really liking the new GUI overall. I've done some interface work and worked with proper UI teams so would like to make a couple of suggestionsabout colours for your consideration:
* The yellow and orange are a little similar and may be difficult for some users to distinguish, it might be worth considering blue
* It's definitely worth running the colours you use through various colour blind tests. Even with the classic red-green color blindness it is possible to select reds and greens that are distinguishable from each other by picking different tones.
* As others have said the green is really vibrant. From a UI perspective it's great but from a 'brand' perspective it doesn't fit so well... I know that muting it may be problematic to then fit in with color blindness tests like I've just said... welcome to the joys of colour selection where you have contradictory requirements....

But again overall really like the way you're going

[juliejayne]

As has been said already the yellow and orange are similar... but I think that their position will give away which is which.... we will get used to it.

The Queue "button " on top of the item graphic is subtle I understand why Kovarex missed it. But again it is something that we would rapidly get used to. Adding a confirm button to the bottom right, if always available on every UI that had the option, would of course be nice standardisation, but the big green checkmark is pretty clear, whether it is top right or bottom right. Maybe for the sake of standardisation add an extra confirm button on the bottom right.

[Taneeda]

Hi there,

I like the new UI, look really good and clear to me. Personally I have some trouble to differentiate yellow with green because of a light "color blindness" with my eyes (sorry, I don't know the correct english term ) So a slightly reduced color palallete would be nice to me, with colors that are easier to differentiate. Personally I prefere standardizing of dialogs (button right bottom) and no horizontal sliders

Greetings,
Taneeda