Needed suggestion for tech-screen UI

Development of artwork, requests, suggestions, samples, or if you have artwork to offer. Primarily for the artists.
Message
Author
User avatar
miu
Graphics Lead Emeritus
Posts: 286
Joined: Mon Aug 25, 2003 2:33 am
Location: Finland/Helsinki

#16 Post by miu » Sun Dec 05, 2004 8:03 am

Awwh, It'll take me till monday-evening till I make my suggestion, (have internship entrytest-tasks to finish yet, wish me luck :)) so little more time to polish your ideas.

pd - would you like to send me a nice scientist-pose of that alienchick of yours? :)

cheers
Miu
Difference between a man and a gentleman is that a man does what he wants, a gentleman does what he should. - Albert Camus

User avatar
pd
Graphics Lead Emeritus
Posts: 1924
Joined: Mon Mar 08, 2004 6:17 pm
Location: 52°16'N 10°31'E

#17 Post by pd » Mon Dec 06, 2004 5:38 pm

miu, you have to be content with one of the current 3 poses for now, sorry. i don't have the time to do another one.

but luckily i found the time to do the research screen ui layout. notice that it's only a plain layout(i'll aply our current minimalistic ui theme later). take a look:

Image

i have left the techtree for now, because i wasn't quite sure how the interconnections are working exactly. for example, does an application always need a theory? if so, are there applications which need more than one theory? can someone point me to a thread where this is beeing discussed? i've searched a bit but haven't really found something, thanks.

ok, back to what we have here.
in the top left corner we have all those numbers and things that are important to the player. i've added some, feel free to suggest more.

right next to this, is the place where you view the current projects available to research. first choose one of the categories and then the project. those category selection buttons could maybe also work like filters, allowing multiple selections. via dubble click you can add one of the projects to the research queue. maybe a radio button in front of them would be also usefull, because it allows to either just select the project(by clicking on it) or select _and_ add to queue(by clicking the radio button).

in the top right corner you can see some details of the selected project. the 'description tab' shows an icon or image(theory or application) and a short textual description. the 'effects tab' shows what effects the tech actually has in the game(things like '+3 to farming' , '+50 armor' and so on).

on the bottom left we have the queue. we can see the techs name here, it's status(researching, unfunded, queued), the amount of turns it takes to completion and the amount of research points you decide to spend for the tech each turn.
you can change thoses values with the arrows to the right.
since you need to spend a certain amount of RPs per turn, the tech is only being researched once you've set up this value. if you spend more than needed, researching is accelerated until it reaches a fixed turn count(could be about 50 - 75% or the original value).
if you spend less than needed, the project is unfunded, and it won't research.
if you spend 0, it's queued.

btw. the arrows should work in 2 different ways:
1. clicking on an arrow raises or lowers the 'spent value' by 1
2. clicking on an arrow(doens't matter which one), holding and moving the mouse up or down will change the value depending on how much you move the mouse.

oh, that's it for now. c&c please.

User avatar
Bastian-Bux
Creative Contributor
Posts: 215
Joined: Fri Jun 27, 2003 6:32 am
Location: Kassel / Germany

#18 Post by Bastian-Bux » Mon Dec 06, 2004 6:24 pm

Can't find refinements on your proposal. Where would you place it?

AFAIK every application will need at least one parent theory, but might also need more theories, applications or even certain refinement levels on an application.

Like refinement 5 on lasers to be able to develop CD drives.

User avatar
utilae
Cosmic Dragon
Posts: 2175
Joined: Fri Jun 27, 2003 12:37 am
Location: Auckland, New Zealand

#19 Post by utilae » Mon Dec 06, 2004 8:23 pm

Bastian-Bux wrote:Can't find refinements on your proposal. Where would you place it?

AFAIK every application will need at least one parent theory, but might also need more theories, applications or even certain refinement levels on an application.

Like refinement 5 on lasers to be able to develop CD drives.
Isn't it true that applications can lead off other applications.

Also, I think it would be a good idea to have refinements in a seperate screen if there is lots of information for refinements (you need to see previous refined applications that are refineable and be able to select those to refine and queue them up, etc).

@pd
You research screen is very nice, good layout and looks easy to use.

The tech tree (which you left out) is the hardest part to imagine I think, because it can possibly take up tons of space (requiring scrolling) and will need to look more like a tree than a grid (my preference is a tree). Maybe you can do something where the most current part of the tree is shown by default, but it is scrollable if you want to see the rest.

User avatar
Geoff the Medio
Programming, Design, Admin
Posts: 12405
Joined: Wed Oct 08, 2003 1:33 am
Location: Munich

#20 Post by Geoff the Medio » Mon Dec 06, 2004 11:23 pm

pd,

Concerns:

Why only space for 5 slectable techs in the available research box? There could be often many more available (or not...?)

What is the purpose of this sub-box of available techs to select..? Couldn't things work more like the CivIII tech screen, where you can click on a tech on the tree itself in order to research it (add it to the queue for FO).

I'd also imagine we could have refinements queuable on the tree view. Perhaps applications that are unresearched are one colour (eg. green), researched and which have available refinements are another (eg. purple), or reserached without refinements (eg. greyed out).

Alternatively, refinements might not be a linear progression (eg. get refinement 1, then 2, then 3) but rather a branching tree themselves (get. enhansed range, or enhased damage, or reduce cost, then get double firing if you have both the range and damage refinements...). In this case, an expandable / collapsable tree structure for refinements (as well as everything else) might be in order... How the expandable / collapsable works with multiple prerequisites, I'm not sure... (And is a bit off topic form your mockup, other than that I don't see how the 5 selectable techs box is supposed to work)

The space for description of techs seems rather small. A more verbose description might be desirable... I also worry about having to fit all the effects in that tiny space as well... could difficult.

Another issue is whether it's possible to show only one category at a time on the tree... IF so, we could have the selection buttons (which could act like tabs... or perhaps should be drawn as such) to flip between the categories, each of which would have it's own branching tree structure. Perhaps if there are a reasonably small number of inter-category prerequisite links, these could be indicated in a tree with a stub-prerequisite that doesn't get expanded on, but which indicates whether it has been researched, and can be clicked on the flip the tree to the appropriate category, centred on that tech.

I guess my main concern is that I don't see the point of the five category buttons and small box of selectable techs at the top of your (pd's) mockup. IMO that functionality could be better implimented on the tree itself, somewhat like CivIII, but with a dynamic expandable / collapsable tree structure (somewhat like a computer directory / folder browser UI). Removing that stuff would also leave more room to show the effects and description... though perhaps those should be treated as sidebars or subpanels that can be collapsed to little tabs or icons if the player doesn't want them taking up space in the tree view window...

User avatar
pd
Graphics Lead Emeritus
Posts: 1924
Joined: Mon Mar 08, 2004 6:17 pm
Location: 52°16'N 10°31'E

#21 Post by pd » Mon Dec 06, 2004 11:58 pm

Bastian-Bux wrote:Can't find refinements on your proposal. Where would you place it?
utilae wrote:Also, I think it would be a good idea to have refinements in a seperate screen if there is lots of information for refinements (you need to see previous refined applications that are refineable and be able to select those to refine and queue them up, etc).
i've totaly forgotten refinements. in mid or late game there might pile up pretty many of them. they will be treated like theories and applications.
i've added some checkboxes so that the user can easily filter what is shown.
utilae wrote:]The tech tree (which you left out) is the hardest part to imagine I think, because it can possibly take up tons of space (requiring scrolling) and will need to look more like a tree than a grid (my preference is a tree). Maybe you can do something where the most current part of the tree is shown by default, but it is scrollable if you want to see the rest.
yep, the tech tree is a tough task and i also prefer a tree like approach because it provides better clearness. i have some ideas how it could work. it's basicly a node-based system similar to world machine or xsi.

i'll think about it and present a proposal tomorrow.

edit: forgott to add the updated version(checkboxes, yay!)

Image

User avatar
tzlaine
Programming Lead Emeritus
Posts: 1092
Joined: Thu Jun 26, 2003 1:33 pm

#22 Post by tzlaine » Tue Dec 07, 2004 12:21 am

I agree with Geoff that the box with the categories and available techs is not necessary, for the reason he stated: double-clicking an item in the tree should add it to the queue.

Also, I feel that the up/down buttons on the queue items are unneeded. You should just drag the queue items up or down as desired, and the topmost items will get funded, with possibly the last one getting partial funding. All you really need is a cancel button; this is far simpler. And iirc, overfunding is not part of the v0.3 DD.

The biggest problem is that you didn't provide a tree, which is the really difficult bit. The "tree" is really more like a graph, as in graph-theory, not as in a graph of x vs. y. The graph is acyclic, meaning that there are no loops in the dependencies in the graph, but there can be lateral dependencies. For example:

A has no requirements
B requires A
C requires B, D
D requires B

Code: Select all

A --> B ---------->  |---> C
      |              |
      ----> D -------|
Notice there are no loops, but the graph is not a simple branching tree, either.

So far, no restrictions have been placed on dependencies, other than all Applications must fall under at least one (but not necessarily only one) Theory, and that all Refinements must fall under at least one (but again, not always only one) Application.

It is possible that a Refinement will depend on its parent Application, some other Application, an unrelated Theory, and some other Refinement.

User avatar
pd
Graphics Lead Emeritus
Posts: 1924
Joined: Mon Mar 08, 2004 6:17 pm
Location: 52°16'N 10°31'E

#23 Post by pd » Tue Dec 07, 2004 12:31 am

Why only space for 5 slectable techs in the available research box? There could be often many more available (or not...?)
sure, especialy if you enable refinements(as well). the box is of course kind of a list, which means you can scroll down if the list is longer. i was just to lazy to make scroll bars. it's the same for the queue and the description.
What is the purpose of this sub-box of available techs to select..? Couldn't things work more like the CivIII tech screen, where you can click on a tech on the tree itself in order to research it (add it to the queue for FO).
the purpose of this is to be able to select _fast_ what is available to research _at the moment_. you don't have to worry about former or future techs. just select a category(or multiple) and then the tech.

of course you can also use the techtree to select and add something to the queue, but this might get tedious and complex.
Perhaps applications that are unresearched are one colour (eg. green), researched and which have available refinements are another (eg. purple), or reserached without refinements (eg. greyed out).
yep, i definitly plan using colors for such things.
The space for description of techs seems rather small. A more verbose description might be desirable... I also worry about having to fit all the effects in that tiny space as well... could difficult.
*scroll* :) seriously, i'm also a bit worried about this, but space is rare and you can't make it perfect, UIs are always a compromise. for the effects i don't see any problems, simply keep it simple and short. also the pic/icon doesn't have to be in the effects tab.
Another issue is whether it's possible to show only one category at a time on the tree... IF so, we could have the selection buttons (which could act like tabs... or perhaps should be drawn as such)
i've thought about using tabs, but i've come to the conclusion that selection buttons might be the better choice for several reasons:
1. they allow multiple selections, tabs don't
2. aq said it might be possible that we get more categorys if i remember right. i can easily add some more buttons while still keeping them pretty big with this layout. when using tabs it gets constricted.

guess my main concern is that I don't see the point of the five category buttons and small box of selectable techs at the top of your (pd's) mockup. IMO that functionality could be better implimented on the tree itself, somewhat like CivIII, but with a dynamic expandable / collapsable tree structure (somewhat like a computer directory / folder browser UI). Removing that stuff would also leave more room to show the effects and description... though perhaps those should be treated as sidebars or subpanels that can be collapsed to little tabs or icons if the player doesn't want them taking up space in the tree view window...
i just wanted to provide an additional, in my mind easier and faster way to select techs, besides the tree.

User avatar
Tyreth
FreeOrion Lead Emeritus
Posts: 885
Joined: Thu Jun 26, 2003 6:23 am
Location: Australia

#24 Post by Tyreth » Tue Dec 07, 2004 12:35 am

We may want to include more flavour text than is permitted in the box you have provided. If there is a way that this box could be larger, so that the individual tech could receive more recognition, that would be good.

I'm imagining something similar to the tech display in SMAC, so that we have the opportunity to immerse the player into the world with the research.

User avatar
Geoff the Medio
Programming, Design, Admin
Posts: 12405
Joined: Wed Oct 08, 2003 1:33 am
Location: Munich

#25 Post by Geoff the Medio » Tue Dec 07, 2004 2:01 am

pd wrote:the box is of course kind of a list, which means you can scroll down if the list is longer.
So it's a bit like the popup in CivIII when you finish researching? In CivIII, when you finish researching something, you get a popup dialog with a drop-box of possible new techs to research, allowing you to pick one by name (turns to complete). This popup also gives you the option to "see the big picture", which takes you to the full research tree view. The popup doesn't show the tree or any info about the techs, other than name (turns).

In our case, it's not so simple, as we have more than one thing being researched at a time. The quick-pick box on the research UI screen does make some sense, in this situation... Though I'm not convinced it'd really be worth the space for a redundant selection system...
i've come to the conclusion that selection buttons might be the better choice for several reasons:
1. they allow multiple selections, tabs don't
2. aq said it might be possible that we get more categorys if i remember right. i can easily add some more buttons while still keeping them pretty big with this layout. when using tabs it gets constricted.
For 2) I don't really see what you're worried about... There seems to be plenty of space to put a row of tabs at the top of the "TECHTREE" box. 10 or more would fit reasonably easily... and if absolutely necessary, a second row of them could be added. The total space taken would be about the same as, or less, than the space the buttons take.

For 1) Assuming htere is a quicklist, I don't think it will be desirable to have more than one category on the quicklist at any given time. I anticipate (perhaps wrongly) having enough techs available that one category at a time would be plenty... if you end up having so many you have a scrollbar, then it's not really much better than having tabs anyway... at least tabs give an obvious logical arrangement of the techs in the list... if they're all together, how do you order them logically? (by category, perhaps?) You might end up needing various sorting options...

Assuming there are tabs to pick which category you're looking at the tree for, perhaps you could make the list of quick-pick techs also be restricted by the same tabs? ie. you click the growth tab, see the growth tree, and see a list of growth quickpick icons as well. I do like the checkbox options for showing / hiding any or all of theory / application / refinement options in the quicklist.


Extended rambly musings-for-thought:

Regarding the tree view, are there particular advantages / disadvantages to having a fixed CivIII-like graph, as opposed to dynamically generated system? If the graph is pre-arranged, then it's more difficult to add new techs to the game, as you have to fit them into the graph somewhere that looks good... But a dynamic system would probably be ugly and less useful / compact than a handmade arrangement.

Could we combine the two, so that every tech has a partly fixed location, but the graph can be expanded or collapsed somewhat like a directory tree? Something like a relative displacement of a tech on the graph up or down, and each theory having a level, eg. 3, and every application directly dependent on that theory appearing as level 3.1, and applications dependent on level 3.1 appliations being level 3.2, etc, and refinements of the first application being 3.1.1, 3.1.2 etc.

You'd be able to expand or collapse any level, so you'd open 3, open 3.1, open 3.1.2, close 3.1, open 3.2. Doing this would expand or collapse the view horizontally... opening a level would shift the higher levels and sublevels to the right to make room for what you open, and collapsing would shrink the opened level and bring the higher level stuff back.

Within each level, the relative up/down displacement would determine position.

There would need to be a distinction between direct dependence, and indirect dependence... so a refinement directly dependent on a level 3.1 application would appear in the 3.1.1 refinement level, but could also have a prerequisite in level 4.2.6 of another category, or level 5.1.1 of the same category... These backloopings (not making a cyclic graph though) would be hard to represent clearly or cleanly... Though that might be a problem for any system, hand-drawn or otherwise, if we allow crazy dependencies and prerequisites from other categories or far-removed techs...

Perhaps the "level" of a tech should be the level of it's highest prerequisites +1 (for theories), +0.1 (for applications) or +0.0.1 (for refinements). This would somewhat confuse the relationship between a theory and its applications, and make less clear point that refinements of an application are important only to that application...

User avatar
noelte
Juggernaut
Posts: 872
Joined: Fri Dec 26, 2003 12:42 pm
Location: Germany, Berlin

#26 Post by noelte » Tue Dec 07, 2004 9:05 am

over all this first mockup look nice.

IMO, being able to select a tech via two ways is not needed / provides no benefit. I guess you will very often research something (A) to get access to another tech (B). The tech tree selection area already provides a perfect way to do so.

Question, Is there a tech tree for every single category? (Construction, Eco,..)? If so, you could maybe use some kind of tabs.

small issue, i would like to see a progressbar behind currently reseached techs.
Press any key to continue or any other key to cancel.
Can COWs fly?

User avatar
pd
Graphics Lead Emeritus
Posts: 1924
Joined: Mon Mar 08, 2004 6:17 pm
Location: 52°16'N 10°31'E

#27 Post by pd » Tue Dec 07, 2004 12:06 pm

don't have much time atm, just want to explain why i decided to add those 'quick selection boxes' on top.

the techtree is perfect for showing those interconnections between theories, apps and refinements, but it's not that ideal for selection techs, because it might look pretty confusing(mid and late game = probably many interconnectins)

with the boxes on top the user is able to jump into the research screen, just select a categorie he likes to improve, select a tech, assign some RPs and he is done.
tzlaine wrote:Also, I feel that the up/down buttons on the queue items are unneeded. You should just drag the queue items up or down as desired, and the topmost items will get funded, with possibly the last one getting partial funding. All you really need is a cancel button; this is far simpler. And iirc, overfunding is not part of the v0.3 DD.
hmm, but this way there is no way to affect researching. you just add and research. and while overfunding might not part of the v0.3DD i hope it will be possible in future, right?

bbl

User avatar
Tyreth
FreeOrion Lead Emeritus
Posts: 885
Joined: Thu Jun 26, 2003 6:23 am
Location: Australia

#28 Post by Tyreth » Tue Dec 07, 2004 12:26 pm

pd wrote:
tzlaine wrote:Also, I feel that the up/down buttons on the queue items are unneeded. You should just drag the queue items up or down as desired, and the topmost items will get funded, with possibly the last one getting partial funding. All you really need is a cancel button; this is far simpler. And iirc, overfunding is not part of the v0.3 DD.
hmm, but this way there is no way to affect researching. you just add and research. and while overfunding might not part of the v0.3DD i hope it will be possible in future, right?

bbl
When talking about "overfunding" are we referring to excess PP being put into a project to underfund it? Or something else I've missed?
Requirements 0.3 wrote: Excess PP works identically to excess RP: the 'last' project in the queue to get any PP takes the excess PP until it has enough to advance one turn. Any excess PP that is not used by any project is wasted. Any minerals contributing to unspent PP are refunded back to the Empire.
http://www.freeorion.org/wiki/index.php ... Production

User avatar
pd
Graphics Lead Emeritus
Posts: 1924
Joined: Mon Mar 08, 2004 6:17 pm
Location: 52°16'N 10°31'E

#29 Post by pd » Tue Dec 07, 2004 4:41 pm

When talking about "overfunding" are we referring to excess PP being put into a project to underfund it? Or something else I've missed?
with overfunding i meant putting more RPs into a project than necessary to accelerate researching.

LonghornXtreme
Space Floater
Posts: 31
Joined: Fri Jun 11, 2004 1:54 am

#30 Post by LonghornXtreme » Tue Dec 07, 2004 5:13 pm

I kind of like that overfunding idea... There should be an increasing cost to RP's over the 'normal' funding level/rate... whatever you want to call the baseline value of funding...

This allows an empire with a butt kicking economy to accellerate technology to the highest point affordable while introducing diminishing returns to the system...

Free Orion is looking yummy....

except for those stupid starlanes :wink:

Post Reply