Sauerworld Forum

Sauerbraten Content => Mods => Topic started by: pix on August 27, 2014, 09:07:35 PM

Title: Minimal / Flat UI Theme and HUD
Post by: pix on August 27, 2014, 09:07:35 PM
Here's my minimal UI & HUD mod I made a year ago (and originally published on Quadropolis (http://quadropolis.us/node/3883))!

(http://i.imgur.com/L29tJth.png)

This is a re-styling of Sauerbraten. I modified both menu design and layout, server browser, plus the game HUD. Currently, some icons are still missing, such as red, blue and green icons for all playermodels except for ironsnout, mainly because I don't need them.

I also changed some color values in the source code and added a method to draw the one-line input field you see in the screenshot. The modified files are included, so if you want to, replace the original ones (after backing them up) and recompile as usual (on linux: make && make install in /src).

The current version requires you to recompile, unless:

In case you compile the source code of pisto's sdos-test client, do not just copy-paste my source files into the src folder of those clients! My source changes are made on top of the vanilla source of Sauerbraten Collect Edition! You can fix the flag blips for pisto's sdos-test client (or other clients based on sdos-test) like this:
Replace the following line in the drawblip() funtion in src/fpsgame/ctf.h:

Code: [Select]
xoffset = flagblip ? -2*(3/32.0f)*size : -size,
with:

Code: [Select]
xoffset = -size,
All other changes are not compatible with the source code of sdos-test, but you can have a look at the Community Edition source code which has those changes merged.

Some more pictures are here: http://imgur.com/a/foTYL#0 (http://imgur.com/a/foTYL#0)

For a version history (up to update 5) and more information check out the Quadropolis node (http://quadropolis.us/node/3883).

Update 6: http://sauerworld.org/forum/index.php?topic=3.msg71#msg71 (http://sauerworld.org/forum/index.php?topic=3.msg71#msg71)

Update 7: http://sauerworld.org/forum/index.php?topic=3.msg1456#msg1456 (http://sauerworld.org/forum/index.php?topic=3.msg1456#msg1456)
Title: Re: Minimal / Flat UI Theme and HUD
Post by: alebrije on August 31, 2014, 08:01:48 PM
nice work pix, that gui looks 'clean'.
Title: Re: Minimal / Flat UI Theme and HUD
Post by: piernov on September 01, 2014, 06:34:21 PM
Like it too, reminds me a bit of "SauerEnhanced".
Title: Re: Minimal / Flat UI Theme and HUD
Post by: Doko on September 01, 2014, 06:42:27 PM
I had to compare with the original and i noticed that the HUD are very different. I remember this menu's style... maybe is the sauerenhanced.
Title: Re: Minimal / Flat UI Theme and HUD
Post by: star on September 01, 2014, 07:12:41 PM
It was once the first commit to the ComEd, but we had to scrap it. I also think it's nice, if you like to see this built into the ComEd, issue a request!
Title: Re: Minimal / Flat UI Theme and HUD
Post by: pix on September 01, 2014, 08:17:19 PM
I had to compare with the original and i noticed that the HUD are very different. I remember this menu's style... maybe is the sauerenhanced.

Possible, but I actually made all the assets myself / based them off shapes and circles on the internet :)

I just updated the .zip file with the following features:

- radar blips (everything you see on the minimap)
- a few code changes
- small changes in color palette
- adjusted digit font for numbered bases to fit the colors
Title: Re: Minimal / Flat UI Theme and HUD
Post by: frosty on September 01, 2014, 08:23:25 PM
It reminded me of this older minimal UI mod, which I currently use and love.

(http://quadropolis.us/files/cube.png)

http://quadropolis.us/node/2261
Title: Re: Minimal / Flat UI Theme and HUD
Post by: Chaos on September 03, 2014, 02:53:54 AM
I really like this; clean and simple. Have you considered 'rounding' the square edges of the GUIs?
Title: Re: Minimal / Flat UI Theme and HUD
Post by: Acuerta on September 03, 2014, 09:58:25 AM
gui background could use more transparency imo
Title: Re: Minimal / Flat UI Theme and HUD
Post by: Cocoa on September 03, 2014, 11:12:08 AM
Acuerta, I think this could even be implemented to be adjustable via a variable. Haven't tried it so far, though.
Title: Re: Minimal / Flat UI Theme and HUD
Post by: pix on September 03, 2014, 12:10:43 PM
Have you considered 'rounding' the square edges of the GUIs?

Nope, but to be honest I don't think it would look better :P

gui background could use more transparency imo

Mhm, haven't tried it. I'd be careful though with the white background, you need a certain contrast provided by the guiskin.jpg to keep white text readable (same with bright maps/skyboxes). I have a couple to-dos left anyway:


I attached the GIMP .xcf files in case someone wants to play around with this stuff! All the GIMP stuff is by me and CC-BY-4.0 licensed unless otherwise specified in a readme.txt or license.txt.
Title: Re: Minimal / Flat UI Theme and HUD
Post by: pix on April 12, 2015, 06:51:26 PM
Update #7: Added CC-BY-3.0 license note for media files.