Microbe GUI Finalisation

TheRabiesGuineaPig wrote:

Thanks :). Why has it been so quiet lately? Everyone is off school 

Summer's been around for two months for me now, and I'm just as confused as you are. Could be summer internships, summer classes, summer... everythings, I suppose. Adding to that, you've got people from around the world helping out, so that could affect it, too.

Anyway, for the sake of saying something productive, I think the "alphabet reel" thing works great, and the search option, too. Adding to that, even though avoiding having a really big parts grid was the entire point of the scroll reel, would having one of those taking up the middle of the screen work well if the person forgot the name of the organelle? Especially if we've got lots of organelles at that point, which would be when the search option would be needed most. It'd give a fall-back plan to the player that doesn't consist of scrolling through the whole thing looking for it, or making wild guesses at its name. Just my 2 cents.

RabiesPig wrote:

so quiet

My fault mostly -- I was making lots of noise some time ago, but juggling work and studying has eaten all my time lately. I also took it upon myself to start reading ASOIAF a week ago (foolishly, since I barely have any time to spare anyway), but I just finished that a few seconds ago so you can probably expect me around more. Oddly enough though, I'm running out of productive things to say.

We could perhaps start planning out the concept for the multicellular stage?

TheRabiesGuineaPig wrote:

Thanks :). Why has it been so quiet lately? Everyone is off school 

My summer break started a few days ago (probably the same day as yours, seeing as we both live in the UK), but I've been having a brief rest for a few days before getting back to working on things such as Thrive.

There's still a lot to do on the microbe stage GUI concept before moving on to the multicellular stage (although having the latter in mind when designing both would be a good idea) - for one, if there's no objection, the design I posted for the environment GUI needs to be mapped to XML so it can be added to the build. I can get started on that as XML is one of the few programming languages I'm slightly familiar with.

What's been put forward recently looks good, although I do personally like interfaces which focus on the righthand side of the screen rather then the left. I also write in Boustrophedon, so my opinion on orientation should probably be ignored. It looks playable and fairly practical, which is positive and the main thing in an interface. I'm afraid I wouldn't be any help coding things, but if frames of animation are needed for button presses or if a sound effect for the same is desired I could provide.

TheRabiesGuineaPig wrote:

Why has it been so quiet lately? Everyone is off school 

As MitochondriaBox said Summer stuff is going on! For example, I'm going to my dad's house, but don't worry! I'll still be here up, running and modeling! :sunny: 

Well, I don't have anything productive to say...
I just really liked the poll idea, I guess... It makes things much easier to decide. We need more polls!

Ok guys, as we seem to be tuning the GUI concepts towards the final concept. I will add my latest and greatest concept. It displays some new and discussed features like multiple compounds in one bar and a simple chat log to show gained and produced compounds
With background: https://i.imgur.com/XHosh2H.jpg
Without background: https://i.imgur.com/F6xc5Qu.png
Imageset: under construction

I really like the chat log idea (though it'll have to be condensed so as not to impede the view of the environment), but wasn't it decided that we wouldn't have an image of the player's microbe in the GUI, and that radar charts would take the place of any sort of bar representation of compounds?

Sure thing, ill tweak it when i get time

TheRabiesGuineaPig wrote:

Ok guys, as we seem to be tuning the GUI concepts towards the final concept. I will add my latest and greatest concept. It displays some new and discussed features like multiple compounds in one bar and a simple chat log to show gained and produced compounds
Imageset: under construction

I agree, the small representation at top left is entirely unneeded. If people are set on the idea, a stylized representation, perhaps a '1st person' crossection view or something like an old textbook diagram *might* work. Otherwise, just removing it would be best. It's a good spot for a pie chart, though. I agree that the event log should be smaller and more contained, and there should probably be a secondary log interface accessible by shortcut so that people can review it. I presume that the polygon in the lower left is a button to access the ingame menu? If that is the case, would opening said menu pause the game? If so, it could be an interesting graphical effect to have the game world zoom in or out considerably when it opens, replicating the effect of switching lenses on a microscope. I don't have any clue how hard that would be to animate or code, mind, so feel free to ignore the idea.

There was one thing that I liked about the representation and that was that it would display how damaged a part of the membrane was. EG: if a side of the membrane was damaged it would show as red on the display. Maybe the log should also show entered hotkeys? It should definitely be collapsible.

Some quick pointers for Oliver and anyone else interested in making the xmls for the GUI:

• In gui/imagesets you'll find ThriveGeneric and ThriveEditors .imageset and .png files (ThriveGeneric is the more important one). For each, the png stores a bunch of gui image things, and the imageset "cuts up" the png into all the image things.
  
• Note, the images do not have to be laid out in the png in any way related to how they go in-game (which would be impossible anyway, since some images get used in a lot of places).
  
• Each image in a png must be the only thing in its respective rectangle define in the imageset file.
  
• A bunch of the things in the png, like the textbox backgrounds, only need to be recolored to the blue scheme Oliver made. No change is needed to the imageset file for these, unless you wanna move them around.
  
• Following the examples provided by the buttons and panels, though, you'll need to define new button and panel images.
  
• Next up, the layouts: In gui/layouts you'll find the MainMenu, MicrobeEditor, and MicrobeStage .layout files. They're mostly straightforward -- the changes needed in these are mostly limited to moving things around, and changing the images used to the ones you added. There are a few unnecessary panels you could get rid of or appropriate for another use, too.
  
• You'll see a bunch of brace-enclosed pairs of pairs -- these are positions and dimensions, made using CEGUI's special dimension system. 
  
• So, recap -- you need to do two things: 1, change the images used by the actual GUI elements; and 2, move/update the GUI elements.
  

If there's anything I've missed, I'm sure crovea can fill the holes in. You'll note that I've neglected to mention the schemes, looknfeel, and animations folders -- as far as I can tell, no editing currently needs to be done for those. And you'll also note that I've ignored almost all the files sitting in even the folders I mentioned -- we have loads of example files that come with CEGUI, all sitting there to be read by people who want to make GUIs and need some examples for syntax, cool ideas, and so on. Feel free to skim them, but I think the Thrive files will provide enough examples for your needs.

Moopli is correct.
regarding ThriveGeneric.png/imageset and ThriveEditor.png/imageset the former is meant for stuff that is generic for all of Thrive while the second for stuff specific to the [microbe] editor. This structuring isn't super thought out currently so it could change if you'd prefer.
Note that the pngs use actual alpha transparency and not a placeholder color for transparency, it works for gradual transparency as well.

schemes, looknfeel, and animations are for new types of windows/widgets which are a bit more complicated to work with and would probably be left to me. The scheme file can however be useful to get an overview of what types are currently available.

I've already said to oliver over skype that I'm happy to help if he wants to get into it!

Thanks for the information. :) 

So far I've exported the .png and I've written a preliminary .imageset file, although there are a few general questions I have regarding it:
- Does the rectangle defined around each element have to match up with its x and y boundaries exactly, or can it be any size as long as it encompasses the entire element and doesn't run over into any others?
- The current ThriveGeneric files cover both the environment and menu GUI, but at the moment I'm only worried about the environment. Should this be split further?
- You mention text boxes, and they're outlined in the .imageset file, but their relation to the .png seems strange. How exactly should these be handled?

No problem

1. The latter -- however, the size and position of the bounding rect will affect where and how large the image appears in-game, relative to a GUI element containing it. For example, I could define a large rectangle with a small thing visible in it, and then make a button with a large clickable area but only a small visible tab (maybe for some panel that slides in off the screen).
   
2. I think you can safely ignore the menu stuff completely -- as long as the menu elements still have the images they need, the menu will remain unperturbed. Splitting the imagesets up is probably not too hard, but I'm not sure how to do it and we don't particularly need to yet. Oh, and From what I can tell, ThriveGeneric also provides most of the editor stuff too -- ThriveEditors is only used to store the organelle button pics right now.
   
3. Text boxes have background patterns, edge patterns, and corner patterns -- all of these need images in the imagesets. For those, what you want to make sure is that the different parts that must tessellate together will match properly and tessellate well. Since the current ones already do, all you'll need to do is color-shift them all to fit your color-scheme, but you could do more if you like (though I'd recommend holding on the extra stuff until the GUI is releasable).
   

If someone could do me the favor of making a list of all the required GUI elements, EG: Menu button, corner panel, then I could make a quick imageset -unless we still haven't decided on the design. Personally I like the semi-transparent bubbly design, although this might be bias as I made the design

As seen on the previous page Oliver has already started with imagesets and later layouts, so the two of you should put some effort into coordinating!

As previously stated, I've started work on creating imagesets for the main environment, and at the moment I'm working on creating an editor concept, but that does leave a gap in the shape of the main menu. There's been a lot of discussion on it in this thread, but as of yet nothing's been decided upon. Personally I think something based on Nick's layout but with a design more in line with the rest of the GUI aesthetic would work.

Hey, I'm up for it! Although I need refreshing on both the design scheme you are using and also Nick's concept. In fact, I feel quite useless at the moment. We need to work together more instead of going on our own opinions. We need to decide:

• The overall layout

• The colours used

• The shapes and formatting

• The texture overlays(if any)

Also, has the microbe Editor layout been decided? Are we going with the concept that Moopli and I discussed-or still up for debate?

~scio created a concept for the Microbe Editor which is what we decided to use. It's the gameplay that we are still deciding on a GUI for (well we actually do have it mostly finalized).

The editor layout will look something like a combination of ~scio's original concept:

Spoiler:

and the reel idea you and Moopli have been working on:

Spoiler:

with a colour scheme (I presume) similar to what's so far been decided for the environment:

Spoiler:

Oliveriver wrote:

The editor layout will look something like a combination of ~scio's original concept:

Spoiler:

and the reel idea you and Moopli have been working on:

Spoiler:

with a colour scheme (I presume) similar to what's so far been decided for the environment:

Spoiler:

I think it's best to keep stats as a minimize-able thing on the right side of the screen, since some people'll want to see how their edits affect their creature while they're making them.

I presume the reel's only going to be in the structure tab.

Is blue going to be the theme color of the Microbe Stage?

There are no theme colours. We just use what looks nice.

What color should the grid in the editor and select hey be? I'd go with white. Also I think we should have selected organelles black borders turn white and make them flash between it's texture and white every second.

These are all really nitpicky things that will naturally be implemented as we work on the GUI and don't need to be worried about right now.