anything related to UI in general, splash screens, UI widgets, input and output etc.

Colour Scheme for Plugins

Colour Scheme for Plugins

Postby Shando » 06 Jan 2018, 08:51

Hi All,

I've been playing around with Plugins (again!) and have been trying to match (as closely as possible) the demo Plugins look n feel. I have come up with the following colours as a sort of pseudo-official colour scheme and I'm looking for feedback:

Colours.PNG
Colours.PNG (19.41 KiB) Viewed 12159 times


So, any thoughts, comments, suggestions etc. would be most welcome as I will then tidy up my stylesheet and make it available for anyone else that wants to use it.

Thanks in advance

Shando

PS: I'll post a list of where I've used which colour later on (either tonight or tomorrow sometime) and also a quick screenshot of the colours in use.
Ryzen 7 4800H 16GB GTX1650 Win 11 64
Love, Hope, Strength http://www.lovehopestrength.co.uk
User avatar
Shando
Skyline Moderator
Skyline Moderator
 
Posts: 560
Joined: 06 Mar 2013, 22:35
Location: Moffat Beach, Queensland
Skill: Programmer
Skill: Scripter
Skill: Level Designer

Re: Colour Scheme for Plugins

Postby Shando » 07 Jan 2018, 11:29

Here's an update:

1) New Colour Scheme with more Info

Colours.PNG
Colours.PNG (35 KiB) Viewed 12156 times


2) Screenshot of it in action

Stylesheet_Test.png
Stylesheet_Test.png (49.33 KiB) Viewed 12156 times


Shando
Ryzen 7 4800H 16GB GTX1650 Win 11 64
Love, Hope, Strength http://www.lovehopestrength.co.uk
User avatar
Shando
Skyline Moderator
Skyline Moderator
 
Posts: 560
Joined: 06 Mar 2013, 22:35
Location: Moffat Beach, Queensland
Skill: Programmer
Skill: Scripter
Skill: Level Designer

Re: Colour Scheme for Plugins

Postby SolarPortal » 08 Jan 2018, 13:12

ahh, the joys of creating a stylesheet.

the one thing i would mention that is important in the UI design is visual ease. the text needs to stand out but not be too strong or glaring, and avoid tramlines as much as possible; this is usually caused by border colours or alternating colours like in the tree widget. for example, instead of the strong lighter blue for the alternate lines, try using a colour just above the other one, it doesn't take much to make a noticeable difference in the line.

If you follow the kiss rules(keep it simple stupid), it will turn out fine... as it happens, creating simpler, more minimal designs are harder which is quite funny lol :P
Skyline Game Engine - Lead Dev.
Please provide as much info as possible when asking for help.


Specs: OS: Win 10 64bit, CPU: Intel i7 4770 3.4ghz x 4 core(8 threads), GPU: Nvidia GTX 1060 6GB, Ram: 16gig DDR3, Windows on 250gb Samsung Evo 860

Twitter: @SolarPortal
Instagram: @SolarPortal
User avatar
SolarPortal
Skyline Founder
Skyline Founder
 
Posts: 3631
Joined: 29 Jul 2012, 15:56
Location: UK
Skill: 3D Modeller
Skill: 2D Artist
Skill: Programmer
Skill: Level Designer

Re: Colour Scheme for Plugins

Postby Shando » 11 Jan 2018, 12:19

Hi All,

Been playing around again ( hopefully following SP's advice :? )

Colours.PNG
Colours.PNG (38.65 KiB) Viewed 12138 times


Screenshot.png
Screenshot.png (55.54 KiB) Viewed 12138 times


And I've also attached the latest version of the Stylesheet.

Let me know if you have any thoughts, comments etc.

Shando
Attachments
Skyline_Plugin_Stylesheet.txt
(12.32 KiB) Downloaded 795 times
Ryzen 7 4800H 16GB GTX1650 Win 11 64
Love, Hope, Strength http://www.lovehopestrength.co.uk
User avatar
Shando
Skyline Moderator
Skyline Moderator
 
Posts: 560
Joined: 06 Mar 2013, 22:35
Location: Moffat Beach, Queensland
Skill: Programmer
Skill: Scripter
Skill: Level Designer

Re: Colour Scheme for Plugins

Postby SolarPortal » 11 Jan 2018, 13:19

that looks much tidier now, doesn't take much to make it look better :)

I would possibly lower the colour of the borders to fit closer to the back blue, then increase the grey font in the right side(something like #777, #888) just a fraction to make it more visible. Then your on to a good looking stylesheet then :)
Skyline Game Engine - Lead Dev.
Please provide as much info as possible when asking for help.


Specs: OS: Win 10 64bit, CPU: Intel i7 4770 3.4ghz x 4 core(8 threads), GPU: Nvidia GTX 1060 6GB, Ram: 16gig DDR3, Windows on 250gb Samsung Evo 860

Twitter: @SolarPortal
Instagram: @SolarPortal
User avatar
SolarPortal
Skyline Founder
Skyline Founder
 
Posts: 3631
Joined: 29 Jul 2012, 15:56
Location: UK
Skill: 3D Modeller
Skill: 2D Artist
Skill: Programmer
Skill: Level Designer

Re: Colour Scheme for Plugins

Postby Shando » 12 Jan 2018, 23:06

Hi All,

Having (once again!) taken note of SP's comments, here is the (hopefully!) final version:

Colours.PNG
Colours.PNG (39.04 KiB) Viewed 12126 times


Screenshot.png
Screenshot.png (82.93 KiB) Viewed 12126 times


Shando
Attachments
Skyline_Plugin_Stylesheet.txt
(12.37 KiB) Downloaded 788 times
Ryzen 7 4800H 16GB GTX1650 Win 11 64
Love, Hope, Strength http://www.lovehopestrength.co.uk
User avatar
Shando
Skyline Moderator
Skyline Moderator
 
Posts: 560
Joined: 06 Mar 2013, 22:35
Location: Moffat Beach, Queensland
Skill: Programmer
Skill: Scripter
Skill: Level Designer

Re: Colour Scheme for Plugins

Postby planetX » 13 Jan 2018, 09:50

Hi Shando, great work, but I'd go for something more neutral. Right now is too colorful IMO, you don't want that while working with an interface. Here some thoughts:

- I'd keep the backgrounds grey and use the blue for highlights. Actually I'd keep the Skyline color scheme.
- Also I'd lower even more the contrast between elements, specially the rows.
- I'd reduce at maximum the amount of lines, if I need them, I'd make them very subtle.
- Try to use shades of the background as line color (i.e. a grey line over a blue background doesn't work).
- All lines should have the same width.

Hope it helps and keep the good work. ;)

My specs: Windows 10 - Intel(R) Core(TM) i7-6700HQ CPU @ 2.60GHz - 16 Gb ram DDR4 - NVIDIA GeForce GTX 960M 4 Gb

planetX
Skyline Contributor
Skyline Contributor
 
Posts: 210
Joined: 28 Nov 2016, 18:27
Skill: 3D Modeller
Skill: Level Designer
Skill: Concept artist
Skill: Great creative
Skill: Programmer

Re: Colour Scheme for Plugins

Postby StarFire » 16 Jan 2018, 15:00

Ah the fun of interface design!

Keep at it m8 and you will get there. There is some good valid advice in this topic :D :)
Dream the Journey, Live the Experience!
User avatar
StarFire
Skyline Founder
Skyline Founder
 
Posts: 1678
Joined: 03 Jan 2012, 18:50
Location: UK
Skill: Great creative
Skill: Programmer
Skill: 3D Modeller
Skill: 2D Artist
Skill: Level Designer


Return to UI

Who is online

Users browsing this forum: No registered users and 2 guests

cron