Microbe GUI Finalisation

Subject: Re: Microbe GUI Finalisation Sat Sep 06, 2014 10:01 am

Since I'm working on coding the environment GUI (but I still want to show some sort of progress before it's complete), I might as well post the editor concept I've put on hold to see if anyone has any thoughts:

Spoiler:

There's not really all that much, and the most important part, the part reel, isn't there, but it still gives a good platform to finalise the design.

Subject: Re: Microbe GUI Finalisation Sat Sep 06, 2014 1:07 pm

Good work on that so far. If you need any help, such as if you feel there might be some button you are missing, feel free to ask.

Subject: Re: Microbe GUI Finalisation Sun Sep 14, 2014 6:20 am

@Oliveriver Looks good! Although I feel that the coloration on the MP symbol is a bit off

Subject: Re: Microbe GUI Finalisation Fri Sep 19, 2014 1:59 pm

@TheRabiesGuineaPig
Meh, that was just a guess really. I think ~scio created a better MP symbol somewhere . . . I just need to find it.

Also, Moopli's agreed to help with getting some of the environment GUI into code, so in the meantime I went back and worked on the main menu GUI design, which will be part of the entire system anyway:

Spoiler:

Options, tools, extras and credits are, for the moment, greyed out, as they haven't actually been added yet. The background was made from an amalgamation of heavily edited microbe stage backgrounds and ~scio's original planet image.

Subject: Re: Microbe GUI Finalisation Mon Sep 22, 2014 11:16 am

It would be cool to have an actual planet behind the logo, and when you start the game there is animation of zooming into the planet before loading the cell stage. I might dust off blender/sculptris and give this a go.

Subject: Re: Microbe GUI Finalisation Wed Sep 24, 2014 11:42 am

There are several animation aspects planned in the main menu, but for now it's better not to worry.

EDIT: Also, huzzah, finally a complete ThriveGeneric image!

Spoiler:

(Although it may not look like it, every button is confined to its own rectangle).

Many of the buttons are greyed out as they currently don't function - statistics, for instance, doesn't yet have anything to show. I've also momentarily abandoned the idea of a parts wheel - by the time we have someone with in-depth knowledge of GUI design and coding, it will certainly be time to revisit, but for the moment trying to create a working image set makes my head hurt.

One of the reasons I've been struggling so far is a lack of forward planning. The buttons and files ended up ridiculously scattered and inconsistent (shadows...don't get me started on them...), and working with them became impossible. So I went back and started again, this time keeping some sort of size and format consistency throughout, while also retaining appropriate layouts for reference in preparation for writing the imageset and layout files.

ANOTHER EDIT: Forgot the cursor.

YET ANOTHER EDIT: Added it, but haven't bothered to upload the new png. If there's anything else I've missed I can do the same pretty easily.

Subject: Re: Microbe GUI Finalisation Thu Sep 25, 2014 2:01 am

Excellent work on the GUI Oliver! I especially like the design of the main menu, and as Rabies was saying in the future we could add in some interesting animations in the background, particularly when a new game is started.

What is the next step required now that this is completed?

Subject: Re: Microbe GUI Finalisation Thu Sep 25, 2014 4:05 pm

An imageset XML file and a layout XML file (both much easier to do than they were when I didn't have a progress save at each place) will need to be written, then it's of to the coders to write the looknfeel files which control animations. Since I have a free day tomorrow, I should completely finish the first two XMLs.

EDIT: Ok, the imageset's done, but there are a couple of quick questions I need to check:

What should I do about the microbe saving and loading panels in the editor?
Do all pixel measurements have to be integers?
What should I do with the main menu background?
The PNG of the current GUI has point 0,0 at the top left, whereas I've been using the bottom left. Is there a way to change the imageset XML to read this or will I have to replace the measurements with their positions relative to the top left?

ANOTHER EDIT: Scratch that, I'm still having problems with setting up the text boxes (and by problems I mean I forgot about them completely). I doubt simply colour-shifting the current set of images will work as every button has a slight gradient, so assigning a solid colour to the text boxes will result in it not matching entirely. Would making them all transparent work, or does that defeat the point?

Subject: Re: Microbe GUI Finalisation Thu Oct 02, 2014 2:24 pm

Quote :: Do all pixel measurements have to be integers?

For imagesets then yes. For defining layouts and sizes, you can define it as a fraction of the games windows width.

Quote :: or will I have to replace the measurements with their positions relative to the top left?

You'll want to replace them I can do it for you if you prefer

That's two of your questions at least.

Subject: Re: Microbe GUI Finalisation Sun Oct 05, 2014 1:41 pm

Right, new ThriveGeneric (with a corresponding imageset) created with point 0,0 in the top left, all pixel measurements in integers and the original GUI's text box pieces:

Spoiler:

I should be able to at least make a start on the Main Menu layout file today as well.

Subject: Re: Microbe GUI Finalisation Tue Oct 07, 2014 2:26 pm

Since I'll be incredibly busy until the end of the week and I don't want to slow progress on the GUI any further, I've compiled everything I've done so far and will post it here in case anyone wants to pick up on it themselves. The layout files in particular will be difficult for me to create in any reasonable amount of time anyway, so I've instead listed the pixel locations of each element (with the elements themselves the size defined in the imageset file) with a description of how they'll function.

ThriveGeneric PNG:

Spoiler:

ThriveGeneric Imageset XML:

Spoiler:

Layout information for constructing the XML files:

Main menu:

Spoiler:

Environment:

Spoiler:

Editor:

Spoiler:

A couple of moot points:
- The entire part selection section of the editor is temporary, to be replaced by a working scroll-wheel system at a later date.
- As of yet, there are no save and load dialogue boxes for the editor. A simple text box may suffice.
- The menu background is not designated anywhere hear - I expect that counts as a background and can simply be added into the background images folder and called for by the relevant XML file.
- The layout file coordinates aren't integers, but if that's a problem it might be possible to round one way or another as 0.5 pixels is largely imperceptible.

Other than that, if anyone has any problems contact me, but remember that I'll be mostly unable to do anything for a couple of days.

Subject: Re: Microbe GUI Finalisation Tue Oct 21, 2014 2:16 pm

I've finally managed to properly get to work on the layout files, and most of it seems straightforward after a little while spent familiarising myself with it. The MainMenu layout file is done and I've completed a fair amount of the MicrobeStage, except for the fact that I still can't get my head around the Unified Positions and Co-ordinates System for setting sizes and positions. I'll have another go at understanding it tomorrow, but if I can't it'll have to wait until Crovea completes the relevant section of his GUI tutorial (which, having taken a quick look at GitHub, should help immensely when positioning elements).

And, as usual, I have another question: How do you define which element is on top of another? Mostly this will affect shadows of elements, which I'll want to have cover some elements but not others.

EDIT: Oh, almost forgot, I used some of Thrive's existing images to create possible alternative main menu backgrounds (the second being a years-old spaceship concept colour-shifted to work with the menu elements). Perhaps the background could change depending on the stage, or for now just at random.

Spoiler:

Subject: Re: Microbe GUI Finalisation Tue Oct 28, 2014 12:36 pm

Woohoo! Forth post in a row here.

With Moopli's help I've been able to polish off the layout files and learnt the basics of the coordinates system, but there's still a while to go, as these images show:

https://i.imgur.com/Oe25RlC.png
https://i.imgur.com/hr9i4MM.png
https://i.imgur.com/ATTikDj.png

Only the main menu layout files has actually been completed, so that's why none of the GUI for the rest of the game is showing. Either way, there are evidently some changes which need to be made, but the fact that it now works in-game is a huge step forward.

Also note the incredibly cute tiny cursor...if you can find it.

Subject: Re: Microbe GUI Finalisation Thu Nov 13, 2014 3:56 pm

And now we finally have a functioning new main menu:

Spoiler:

And to prove that all the scalings (including those in the background) work correctly, here's another view:

Spoiler:

You'll notice the cursor is still tiny and the text is slightly off inside the buttons - both these problems seem to be difficult to fix, but should have a solution. A new hover command also needs to be written to use the hover variations of each button as opposed to shading them slightly, too.

Subject: Re: Microbe GUI Finalisation Fri Nov 21, 2014 3:25 pm

To add to the completed main menu, here is the finished environment GUI!

Spoiler:

Unfortunately it doesn't yet update properly (the hitpoints, for instance, are fixed at 0) and there aren't any animations besides hovering over a button - along with the editor, that comes next.

Also, just to clear up the situation with the tiny cursor, it actually needs a part of the core code to be changed, which can only be done once all changed files have been added to the repository. So it will be fixed easily eventually, but not yet.

EDIT: I can also finally give a concrete completion date for my part of this blasted GUI - one more week.

Subject: Re: Microbe GUI Finalisation Thu Nov 27, 2014 3:39 pm

As it so happens, I've actually made the deadline this time! Unfortunately I can't show the finished thing here as it's mostly XML documents, but depending on how much Moopli and Crovea can work on getting it functional, it should be done very soon.

Anyway, here's the editor:

Spoiler:

Subject: Re: Microbe GUI Finalisation Thu Nov 27, 2014 5:55 pm

Beautiful, I like it. It's great to see some advances!

Subject: Re: Microbe GUI Finalisation Sun Nov 30, 2014 10:36 pm

Is the icon with the cell and plus sign for test drive mode, or for adding another cell when the connecting membrane is available?

Subject: Re: Microbe GUI Finalisation Mon Dec 01, 2014 5:15 am

Wow that looks really neat! If you like I could make some sprites for the different cell parts in the editor. The organelle might be quite confusing to a player who doesn't fully understand cellular biology and pictures would help to tell them apart/remember which one is which. Maybe there should be a small description box when you hover over each organelle that tells the user what it does.

Subject: Re: Microbe GUI Finalisation Mon Dec 01, 2014 11:45 am

@MitochondriaBox
It's a new cell button, for the moment used to delete the current cell and start a new one if sufficient Mutation Points are available.

» Microbe GUI
» Microbe Stage Progress Report
» Microbe Prototype #2
» HI, I am Alduin2013
» Theme Space