Skin Synthesia Flat

kiwi · Post by **kiwi** » 01-29-16 5:52 pm

Hi piano lovers!

Here's Synthesia totally flatized in the metro style

Spoiler:

Playscreen have the top bar flat but keyboard is by default (cuz i love the real keyboard drawed by Nicholas)

How to:
mac only
Replace you're "ressource" folder by mine.
Replace colors.xml by mine in ressources folder

Updated 05/02/16
Updated14/02/16 (used a vectorial software and removed the little black pixels on the sort by in the library and made them slightly rounded)

Enjoy!

Edit:Works with the latest 10.5 Version

kiwi · Post by **kiwi** » 02-02-16 6:29 am

Hum on mac it's easy to change the png.

Mac: Navigate to /Application /Synthesia =>right click =>show the package.

But on windows is it on "appdata"? we need ressource hacker? I don't remember.

kiwi · Post by **kiwi** » 02-02-16 7:53 am

Skin updated 02/02/16

sparkle changed to blue (prior was orange) scrubber on grey (not blue) so it can match any color theme)
Window segment redrawed and on grey for to match all the themes colours

Now the skin can be used with all the themes colours variants so redownload it.

kiwi · Post by **kiwi** » 02-03-16 11:43 am

So the colors.xml is almost finished here's a preview:

Spoiler:

@Nicholas

Where is the selection on the xml ? (look at the blue arrow) i mean the black square

kiwi · Post by **kiwi** » 02-04-16 2:35 pm

Bump it drive me crazy i have tried for 2 hours and i really can't found this black aréa also

Also a little help for these buttons and text under them?

Spoiler:

Only these 2 points are missing in my skins

Post by **Nicholas** » 02-04-16 3:19 pm

kiwi wrote:But on windows is it on "appdata"? we need ressource hacker? I don't remember.

Yep, unfortunately this still isn't very easy on Windows. I'd have Synthesia check the disk for textures before resorting to the built-in images, but I worry that a bunch of disk checks might slow things down.

kiwi wrote:Where is the selection on the xml ? (look at the blue arrow) i mean the black square

That is "sidebarButtonActive" which has a color of "buttonFaceHover".

kiwi wrote:Also a little help for these buttons and text under them?

These are the "songSettings*ButtonFrame" entries in ui.xml near line 429. Their color is usually "songSettingsGrayText" for the foreground and "songSettingsGrayBox" or "songSettingsGrayBoxHover" for the background.

kiwi · Post by **kiwi** » 02-04-16 4:19 pm

Thank you very much Nicholas i 'll check

By the way i have finished the works on tga files (removed the shadows on the play next magnyfying glass etc...)
Adjusted some things for the skin matching better any color xml

Also i think i have found an unused ressource who can be it removed.
ui_window_segment_o2.tga

Have paint it in yellow and it seems it doesn't appear anywhere on Synthésia

ui_window_segment_o1 is used yes but not ui_window_segment_o2 it seems.

PS: sorry for the spoiler had forgotten.

Edit: ok was thinking the same things for button face hover but it wasn't working and it's because i was thinking it was a RGB but it's hsv and the last one was on 10 so wherever i set 200 the result wasn't visible.

kiwi · Post by **kiwi** » 02-04-16 5:43 pm

All is ok now XML released and skin updated version final

Enjoy! (at least mac users or geeks on windows with ressource hacker...)

Preview:

Spoiler:

The blacky is very dark but it's good for night sessions the grey one is ok and i have included a greeny one

not on the screenshots try yourself...

Post by **Nicholas** » 02-06-16 9:54 pm

kiwi wrote:Also i think i have found an unused ressource who can be it removed.
ui_window_segment_o2.tga

It's very subtle, but it's the highlight at the top of the song library's sorting buttons: Points, Title, Last Played, etc.

I changed mine to bright red and this is how it looked.

: o2.png (4.02 KiB) Viewed 133566 times

I agree though, both the o1 and o2 textures could be removed. I'm not sure there is a reason that control needs to have the 3D effect anymore when almost everything else is flat now.

kiwi · Post by **kiwi** » 02-06-16 10:31 pm

Ah ok i see now

Well yes on the flat one it's not needed and i have changed some others tga totally transparent (check the zip...).

But i have also noticed some ressources are "vectoriel" (like tutorial one per eg) who is good for 4k resolutions but others ressources 'll be weird on a 4k ? You plan to update them?
Cause it seems 4k is becoming very popular i don't have one personaly so i don't know how it looks like.

Another question:
On the xml it's possible to change the white colour of the minus,plus and forward buttons on the top player bar?

Post by **Nicholas** » 02-09-16 8:39 am

kiwi wrote:... who is good for 4k resolutions but others ressources 'll be weird on a 4k ?

What do you mean? Which textures would be weird on 4k?

Really, the high resolution textures are more for the retina/HiDPI screens you find on tablets more than the large monitors. (Although they look nice in both places.)

kiwi wrote:On the xml it's possible to change the white colour of the minus,plus and forward buttons on the top player bar?

Yeah, you can add an imageColor attribute to them.

So, changing lines 881 and 886 to the following will change the + and - to yellow (because "deviceDisconnectBackground" happens to be yellow):

Code: Select all

        <ui inherit="playToolboxButton" id="speedDown" imageColor="deviceDisconnectBackground" image="interface_minus" />
        <ui inherit="playToolboxButton" id="speedUp" imageColor="deviceDisconnectBackground" image="interface_plus" />

kiwi · Post by **kiwi** » 02-09-16 10:39 am

Ah ok dunno about 4k and tablet i was speaking about some picture like segment button per eg they look weird when zoomed in the osx browser and look fine on Synthésia on a 24" but i was thinking 4k make a sort of zoom on the pictures.

So it seems i am wrong my bad

For the minus,plus buttons so i can't specify an rgb value?

If i want black color not yellow?

Post by **Nicholas** » 02-09-16 10:47 am

All you have to do is use one of the colors from colors.xml. I used "deviceDisconnectBackground" because it's an easy-to-see example. But you can use any color you like. Or add your own new one. "black" is defined right at the top of colors.xml, so you should be able to use that directly.

kiwi · Post by **kiwi** » 02-09-16 11:04 am

Thank you Nicholas!

I understand better now i 'll update with this

Edit: It works we can do many things with the ui.xml!
But i 'll wait for the official support for it cause am not familiar with the merge tool...
And it looks good just with the colors.xml also have done it for the freeplay screen but i need to do also for the play screen etc... (so much line to add :p )

kiwi · Post by **kiwi** » 02-10-16 1:06 am

Working on a new one:
Light grey:

Spoiler:

kiwi · Post by **kiwi** » 02-14-16 2:30 pm

Bump skin updated replace the old one by the new one.

@Nicholas can i make a skinned exe with ressource hacker and release it here for windows users?

Post by **Nicholas** » 02-15-16 10:51 am

This sounds like exactly what Skinbox was created for. That little tool prevents the need to redistribute Synthesia's assets or have unsigned .exes floating around out there.

kiwi · Post by **kiwi** » 02-16-16 9:19 am

I have completely forgotten this little tool :p
Well if someone have tried to use it with my tga files let me know how it works

kiwi · Post by **kiwi** » 03-19-16 3:10 am

Skin & colors tested on Synthesia 11 it works

I 'll finish the light grey skin soon...

kiwi · Post by **kiwi** » 07-08-16 8:30 pm

Hi,
Light grey released and some updates to all the colors themes

Grab the new colors.xml in the first post.