forum

Skinning tutorial (+ skinning support)

posted
Total Posts
4,226
show more
Topic Starter
MLGnom
Thanks. Didn't noticed that minor mistake. ^^'
Dragvon
Oh, another thing:
I remenber something about "AlwaysShowPlayfield: 0/1" for using transparent backgrounds in the spinner.
Not sure about the correct sentence tho~
Topic Starter
MLGnom
Hmm... as I read correctly this option is only for editor, and it doesn't work after all. :<
pjiang621111
I just want to point out a minor mistake here:

MLGnom wrote:

h) HitCircleOverlayAboveNumer – if turned off, makes numbers appear under the “hitcircleoverlay”
According to the templateskin's skin.ini file (and I tested it out to make sure), turning this off (that is, making this 0 instead of 1) causes the numbers to appear over the hitcircleoverlay.

Thanks for this tutorial! I learned a few more useful things from this that didn't come from the templateskin itself! :)
Topic Starter
MLGnom
Corrected. Thank you.
Making tutorial at 3 am isn't a good idea. ^^'
AussieEvil
Is there a directory of all the image names that osu! uses?
ziin
run osume.exe and download the template skin to see most of the files osu uses by default. This guide fills in where the template skin falls short.
Faust
Thanks for your contribution.
Topic Starter
MLGnom
Added information about uploading/creating skin thread.
Please correct me if you found any mistakes (grammar too). :3
Firo Prochainezo
One of the most useful guide in osu! in my humble opinion. Once again, wonderful job MLGnom! Bravo!
Void
Is there any particular reason for StarBreakAdditive to cause star2 to go invisible? Or is it just because I'm setting it to black and white?

EDIT: The term "alpha channel" came across my mind for some reason, but I'm not sure if it could somehow be related or not.

Also, why is the fail background mentioned to 800x600 only, and not 1024x768?
Topic Starter
MLGnom
About StarBreakAdditive. I tested it a little, and yeah it seems to manipulate transparency if you are changing values by same amount (Like StarBreakAdditive: 25,25,25 - nearly visible star2) While making it white (255,255,255) it's stays unchanged. If Black (0,0,0) it's disappear (transparency = 0) (Still I'm thinking how to explain this correctly)

About fail-background : For long time it's wasn't scaled properly by osu! (while you made resolution higher than 800x600, it was oversized ingame). Well it seems that has been changed.

I will correct both information later. Thank you for noticing these. ^^'
AnimeMusicgirl24
I don't understand the skin.ini thing. I mean, I understand it, but where can I get it?
ziin
create a file called "skin.ini". Edit the file so that it has all of the items listed in the tutorial in a text editing program.

Or download any other skin and use its skin.ini as a guide.

MLGnom wrote:

About StarBreakAdditive. I tested it a little, and yeah it seems to manipulate transparency if you are changing values by same amount (Like StarBreakAdditive: 25,25,25 - nearly visible star2) While making it white (255,255,255) it's stays unchanged. If Black (0,0,0) it's disappear (transparency = 0) (Still I'm thinking how to explain this correctly)
About Additive color blending:

colorizing in osu means subtracting out a number from a channel. For example, you can't take an orange image and make it blue. It's impossible, since the blue value is already 0.

When using the storyboard colorize, it will set the image's RGB value to a percentage of the original. If you use 0, it's black. If you use 255, it's the original. When you use additive blending, instead of reducing the value of the channel, it reduces the alpha channel (transparency).

Thus if your star2.png is blue (0,0,255) and you use starbreakadditive 128,128,128, the first two 128s don't do anything (they could be 255), and the second one will reduce the transparency of the blue star2.png to 50%.

This is how the background is dimmed when playing, and how the stars eventually fade into nothing as well.
Topic Starter
MLGnom
So, you can use StarBreakAdditive to reduce transparency of star2.png or colorize it if it's gray-scale yes?
After all I understand now how it's work.
And please, can you write an explanation in form that would be easier to understand? (for people who would have problem with understanding this). Then I would be able to add this to the main post.
ziin
I barely understand it myself. I don't know how to actually calculate it either, so it's best to just use guess-check.
ShadowzI_old
Just wanted to add to the tutorial specifically about the health bar. The distance of the scorebar-color should be exactly 16 pixels down and 5 pixels to the right. In otherwords that's where the anchor point is. So all you need to remember is to make sure in your scorebar-background 16x5 form the top left corner you start making the top left corner of you scorebar-color.
Just thought I include this info cause it's usually quite easy for me to make the health bars.
Update: Damn I think the vodka is getting to me I can't remember if it is 5 pixel or 4. I'll check again in the morning
My1_old
can somebody explain the thin with the falling stars (these falling from the cursor) from the game???
there are only values explained and I dont get anything
ziin

My1 wrote:

can somebody explain the thin with the falling stars from the game???
How colorization works in osu!

Take star2.png
Take any pixel in the image. It will have a color associated with it, usually white, or [255,255,255].
For the purposes of this experiment, let's use a different color though, say [255,222,200]
StarBreakAdditive will then modify that pixel on a channel by channel basis. Thus if the additive is [34,255,92] then we will do the following:

255 * 34 / 255 = 34
222 * 255 / 255 = 222
200 * 92 / 255 = 72

The star's color during breaks will be [34,222,72], some nasty shade of green.

Now, instead of drawing just a nasty shade of green star, it instead adds [34,222,72] to the pixel directly behind it. On a black pixel [0,0,0], it will look exactly like [34,222,72]. On a white pixel, it will look white [255,255,255] because you can't go any higher than [255,255,255]. On a gray image, say [192,192,192] it will bet a bit different:

192 + 34 = 226
192 + 222 > 255
192 + 72 > 255

So it will be the color [226,255,255], a very light cyan. As time goes on, the star itself fades out.

Note that these are only the stars that fall from your cursor during the breaks. I just use white all the time in my skin, but the default skin uses a pinkish color, I presume to be [255,192,192].
Topic Starter
MLGnom
Great. Added link to your post. Let's hope that will help with understanding how it's working.
My1_old
yes and I change the general color with th imge or is there an ini option too???
ziin

My1 wrote:

yes and I change the general color with th imge or is there an ini option too???
StarbreakAdditive: is in the ini.

You can also change the color in the image.
YuZuKi Kenny
I have a question.
How to make an *.ini file of my skin?
My English is poor. ;(
Luna
Just take the *.ini from any skin (for example from the template skin) and edit it
My1_old

ziin wrote:

My1 wrote:

yes and I change the general color with th imge or is there an ini option too???
StarbreakAdditive: is in the ini.

You can also change the color in the image.
but it says that this option only applies in breaks or in "kaiai time" (dont aks me what that is I am the one who wants to know thies...)
but I said general and general means always
-> edit
OK I had enough of setting the col in the ini so I mad it with the image...
however is there an option to let the stars shine always
YuZuKi Kenny

Luna wrote:

Just take the *.ini from any skin (for example from the template skin) and edit it
ok,Thx :)
ziin

My1 wrote:

but it says that this option only applies in breaks or in "kaiai time" (dont aks me what that is I am the one who wants to know thies...)
but I said general and general means always
-> edit
OK I had enough of setting the col in the ini so I mad it with the image...
however is there an option to let the stars shine always
The stars only fall from the cursor during breaks and kiai time.
Breaks look like this in the editor: http://puu.sh/5bmq
Breaks are gray on the timeline, Kiai time is orange: http://puu.sh/5bmx
If you want to see the stars all the time, edit the beatmap so that kiai is always on.

During kiai time, the star changes color according to the combo color instead of starbreakadditive.
My1_old
and what is kiai time exactly???
ziin
It's a timing section which makes lighting.png show up behind all hitcircles, colorized to the hitcircle color, star2.png will be emitted from the cursor in the color of the hitcircle, and there will be a fountain of non-colorized stars at the very beginning of the timing section.
My1_old
so ok but is there something eöse special like bonuspoints or whatever
ziin
in taiko you get 10% more points.
My1_old
only in taiko???
man...
Neclory
someone knows what "LayeredHitSounds" means? I found it in a .ini file.
My1_old
can you say me where ya found it???
I can try it and say what I found...
and a question can sb. give me the original autopilot icon, I need it for skinning
but MAY I even use the standard skin (recolored)???
Topic Starter
MLGnom

Rin wrote:

someone knows what "LayeredHitSounds" means? I found it in a .ini file.
Errr where did you find that?
I think it's something related to the mapping (editor), not to the skin.ini . D:
My1_old

My1 wrote:

can sb. give me the original autopilot icon, I need it for skinning
but MAY I even use the standard skin (recolored)???
My1_old
little questiion what are hit100k hit300g and hit 300k for???
ziin
they are displayed at the end of a combo. 300g if you SSed it. 300k if you got a 100 somewhere. 100k if you got the last note as 100 but no 50s anywhere in the combo.

if you want the autopilot icon, just printscreen it.
My1_old
no screenshot makes It somehow darker...
dont ask me how and why It is just so...
Wassaaaa
parts that can be animated just go from 0 to 9 -.-" , there is a way to extend this? I'm wanting to create a great skin and i'm limited a lot these few numbers like the combobursts .-.
show more
Please sign in to reply.

New reply