Author Topic: High Resolution UI system  (Read 667 times)

0 Members and 1 Guest are viewing this topic.

Offline m!m

  • 211
High Resolution UI system
Thanks to the amazing work of mjn.mixael, we were able to build a fully functional, high resolution replacement for the initial pilot selection screen:



This screen is powered by libRocket framework which allows to create user interfaces in an HTML and CSS dialect. The logic of this screen is controlled by a Lua script so it is very easy to change the way the user interface behaves without having to change the FreeSpace Open source code.

The newly added barracks screen


The project has reached a state where the initial pilot selection and the barracks screens can be replaced completely with a libRocket powered UI.

Here is the mod required for that: http://www.mediafire.com/file/1t01ly7a29d2tlw/libRocketUI.zip/file
This is configured for Knossos but a mod.ini is also included. A Knossos release may follow once the necessary code is available in the nightly builds.

You will need special builds to use this which can be found here: http://swc.fs2downloads.com/builds/test/libRocket/

The development version of this mod can be found in this open source repository: https://github.com/asarium/libRocketMod
Development of this project frequently happens via the #scp channel on Discord so if you want to follow the development of the other screens check out that channel.

Please test this and let us know what you think!

Again, huge thanks to mjn.mixael for making this project happen.
« Last Edit: September 18, 2018, 03:45:59 pm by m!m »

 

Offline mjn.mixael

  • Cutscene Master
  • 212
  • Anims: 420, Cutscenes: 10, Mainhalls: 7, Logos: 52
    • Steam
    • Twitter
    • Mix-Hai Productions
Re: High Resolution UI system
 :yes:

Because this system builds the UI like a webpage, the elements may move or scale differently depending on your resolution. I checked several random resolutions as I built it, but I'd be interested to see screenshots of any and all resolutions running this mod to see how things change.
Cutscene Upgrade Project - Mainhall Remakes - MixaelANITools - Between the Ashes - MjnMixael's Render Boutique - Mix-Hai Productions
Youtube Channel - P3D Model Box - Photobucket Albums - Model Releases - Downloads
Between the Ashes is looking for committed testers, PM me for details.
Report MediaVP issues, now on the MediaVP Mantis! Read all about it Here!

 

Offline wookieejedi

  • 28
  • Intensify Forward Firepower
Re: High Resolution UI system
Ohhh that's sexy. Fantastic work!
Team Member for FotG

 

Offline TwentyPercentCooler

  • Operates at 375 kelvin
  • 28
Re: High Resolution UI system
You guys are sorcerers.  :yes:

 

Offline mjn.mixael

  • Cutscene Master
  • 212
  • Anims: 420, Cutscenes: 10, Mainhalls: 7, Logos: 52
    • Steam
    • Twitter
    • Mix-Hai Productions
Re: High Resolution UI system
Bank Gothic's triumphant return.



The next screen is well under way. Note: barracks update is not in the OP attached mod files.

Cutscene Upgrade Project - Mainhall Remakes - MixaelANITools - Between the Ashes - MjnMixael's Render Boutique - Mix-Hai Productions
Youtube Channel - P3D Model Box - Photobucket Albums - Model Releases - Downloads
Between the Ashes is looking for committed testers, PM me for details.
Report MediaVP issues, now on the MediaVP Mantis! Read all about it Here!

 

Offline Cyborg17

  • 29
  • A-1 Supar
Re: High Resolution UI system
 :yes: :yes: :yes:

 
 

Offline Bryan See

  • Has anyone really been far as decided to use even go want to do look more like?
  • 29
  • Trying to redeem.
    • Skype
    • Steam
    • Twitter
Re: High Resolution UI system
:yes:

Because this system builds the UI like a webpage, the elements may move or scale differently depending on your resolution. I checked several random resolutions as I built it, but I'd be interested to see screenshots of any and all resolutions running this mod to see how things change.
Are you forgetting 9 slice scaling? You'd try to use that technique to remedy this problem you stated above.
Bryan See - My FreeSpace Wiki User Page (Talk, Contributions)

Campaigns:
FreeSpace: Reunited - Shattered Stars

Ships:
GTS Hygeia, GTT Argo, SC Raguel

 

Offline m!m

  • 211
Re: High Resolution UI system
I have no idea how you could find a term that is vaguely related to the topic at hand and then immediately think it could be the solution to a random issue which may not even be a problem :nono:.

 

Offline Spoon

  • 212
  • ♪ ♬ ヾ(´︶`♡)ノ ♬ 淫画
Re: High Resolution UI system
I have no idea how you could find a term that is vaguely related to the topic at hand and then immediately think it could be the solution to a random issue which may not even be a problem :nono:.
Have you considered adding geomod and soft particles to the UI? I'm fairly sure this will remedy any and all tessellations the font may have at 1827x811
Urutorahappī!!

[02:42] <@Axem> spoon somethings wrong
[02:42] <@Axem> critically wrong
[02:42] <@Axem> im happy with these missions now
[02:44] <@Axem> well
[02:44] <@Axem> with 2 of them

 

Offline mjn.mixael

  • Cutscene Master
  • 212
  • Anims: 420, Cutscenes: 10, Mainhalls: 7, Logos: 52
    • Steam
    • Twitter
    • Mix-Hai Productions
Re: High Resolution UI system
I have no idea how you could find a term that is vaguely related to the topic at hand and then immediately think it could be the solution to a random issue which may not even be a problem :nono:.
Have you considered adding geomod and soft particles to the UI? I'm fairly sure this will remedy any and all tessellations the font may have at 1827x811

Oh My God. You're right! How did we overlook this?
Cutscene Upgrade Project - Mainhall Remakes - MixaelANITools - Between the Ashes - MjnMixael's Render Boutique - Mix-Hai Productions
Youtube Channel - P3D Model Box - Photobucket Albums - Model Releases - Downloads
Between the Ashes is looking for committed testers, PM me for details.
Report MediaVP issues, now on the MediaVP Mantis! Read all about it Here!

 
Re: High Resolution UI system

Oh My God. You're right! How did we overlook this?

It's much worse. We should've replaced the entire interface with 3D stuff instead of these old fashioned 2D things. But first we need to replace the POF format.

 

Offline Bryan See

  • Has anyone really been far as decided to use even go want to do look more like?
  • 29
  • Trying to redeem.
    • Skype
    • Steam
    • Twitter
Re: High Resolution UI system
I have no idea how you could find a term that is vaguely related to the topic at hand and then immediately think it could be the solution to a random issue which may not even be a problem :nono:.
9-slice scaling is a 2D image resizing technique to proportionally scale an image by splitting it in a grid of nine parts. The key idea is to prevent image scaling distortion by protecting the pixels defined in 4 parts of the image and scaling or repeating the pixels in the other 5 parts.
Bryan See - My FreeSpace Wiki User Page (Talk, Contributions)

Campaigns:
FreeSpace: Reunited - Shattered Stars

Ships:
GTS Hygeia, GTT Argo, SC Raguel

 

Offline mjn.mixael

  • Cutscene Master
  • 212
  • Anims: 420, Cutscenes: 10, Mainhalls: 7, Logos: 52
    • Steam
    • Twitter
    • Mix-Hai Productions
Re: High Resolution UI system
I have no idea how you could find a term that is vaguely related to the topic at hand and then immediately think it could be the solution to a random issue which may not even be a problem :nono:.
9-slice scaling is a 2D image resizing technique to proportionally scale an image by splitting it in a grid of nine parts. The key idea is to prevent image scaling distortion by protecting the pixels defined in 4 parts of the image and scaling or repeating the pixels in the other 5 parts.

Congratulations, you can copy/paste from a Google search.

9-slice scaling has nothing to do with HTML/CSS layouts and "scaling" them for resolutions. Literally nothing.
Cutscene Upgrade Project - Mainhall Remakes - MixaelANITools - Between the Ashes - MjnMixael's Render Boutique - Mix-Hai Productions
Youtube Channel - P3D Model Box - Photobucket Albums - Model Releases - Downloads
Between the Ashes is looking for committed testers, PM me for details.
Report MediaVP issues, now on the MediaVP Mantis! Read all about it Here!

 
Re: High Resolution UI system
The SCP guys know what they're doing, others... don't.

 

Offline Spoon

  • 212
  • ♪ ♬ ヾ(´︶`♡)ノ ♬ 淫画
Re: High Resolution UI system
Also, since I was thinking it but not posting it.

Nice and good job with this stuff  :yes:
Urutorahappī!!

[02:42] <@Axem> spoon somethings wrong
[02:42] <@Axem> critically wrong
[02:42] <@Axem> im happy with these missions now
[02:44] <@Axem> well
[02:44] <@Axem> with 2 of them

 

Offline m!m

  • 211
Re: High Resolution UI system
The barracks screen is now mostly done:

(Screenshot by mjn.mixael)

 
Re: High Resolution UI system
 :yes:

 

Offline Bryan See

  • Has anyone really been far as decided to use even go want to do look more like?
  • 29
  • Trying to redeem.
    • Skype
    • Steam
    • Twitter
Re: High Resolution UI system
What about the Fiction Viewer, Briefing, Ship Selection, Loadout, and Debriefing screens?

What about Axem's Journal/System Viewer UI? I am sure Axem will port it to this. :)
Bryan See - My FreeSpace Wiki User Page (Talk, Contributions)

Campaigns:
FreeSpace: Reunited - Shattered Stars

Ships:
GTS Hygeia, GTT Argo, SC Raguel

 
Re: High Resolution UI system
why don't you do it yourself

Apart from that, they'll do when they have time.
« Last Edit: September 20, 2018, 08:27:58 pm by Nightmare »