forum

Skinning tutorial (+ skinning support)

posted
Total Posts
4,226
show more
OsuMe65
and yet, a useless skinnable
only a big plus if used correctly
Nathanael
Some contents were removed.

MLGnom, you haven't included selection-mod-random.png which is only for mania.
OsuMe65

Nathanael wrote:

Oh and by the way. MLGnom, you haven't included selection-mod-random.png which is only for mania.
Dimensions:
selection-mod-random.png = same as true with other mods

^ this one
Topic Starter
MLGnom

Nathanael wrote:

At osu!test, there is a skinnable element named ranking-background-overlay.png
Don't test elements in osu!test. They are working a little differently and as you said it doesn't work in public. You only misleading other. :<
Nathanael
I've just encounted it. Anyway I apologize for that. *clears my post*
Saturnalize
Someone can explain why circle at normal and slider has a kinda different opacity?



Or was it me?
TouchFluffyTail

Loli Cjj wrote:

Someone can explain why circle at normal and slider has a kinda different opacity?



Or was it me?
I don't think they do, it's just slider style 3 combined with that slider color shows more through your circle than the background of the non slider circle.
Jackyyy

Loli Cjj wrote:

Someone can explain why circle at normal and slider has a kinda different opacity?



Or was it me?
Your are probably on the beat of the circle in editor and the slider starts at a later time. Notes will gradually fade out when they get further away from the point you are in the song for editor.
Don't know the name of this 'point in song' cause I can't map ;(
Hopefully you understood my bad explanation.
Ayesha Altugle
some important advice for HD Skinners:

1. Double the Resolution of standard elements
2. Create That Element Using Bigger Images
3. Save that Element to (Filename)@2x.png
4. After you save that element, divide the HD resolution eg. 1332/2=666
5. Save it as (Filename).png
6. You have SD & HD Element Skinned
AhiiroN
Hi guuuys,

i made a skin and now ranking-graph looks terrible.

check it here - how to fix it? i want to get rid ofthis box complete

Jackyyy
If you want to remove it completely, replace the 'ranking-graph.png' with an empty/full transparent image.
or
If they box is part of the 'ranking-panel.png', use some sort of software that supports transparency (Gimp, Photoshop etc.) and just erase it.
AhiiroN

Jackyyy wrote:

If you want to remove it completely, replace the 'ranking-graph.png' with an empty/full transparent image.
or
If they box is part of the 'ranking-panel.png', use some sort of software that supports transparency (Gimp, Photoshop etc.) and just erase it.

Thank you worked well :)
OsuMe65

vahn10 wrote:

some important advice for HD Skinners:

1. Double the Resolution of standard elements
2. Create That Element Using Bigger Images
3. Save that Element to (Filename)@2x.png
4. After you save that element, divide the HD resolution eg. 1332/2=666
5. Save it as (Filename).png
6. You have SD & HD Element Skinned


peppy (or someone else) gave that advice before you did.
Nathanael

OsuMe65 wrote:

vahn10 wrote:

some important advice for HD Skinners:

1. Double the Resolution of standard elements
2. Create That Element Using Bigger Images
3. Save that Element to (Filename)@2x.png
4. After you save that element, divide the HD resolution eg. 1332/2=666
5. Save it as (Filename).png
6. You have SD & HD Element Skinned


peppy (or someone else) gave that advice before you did.
It would be good to include that at the first post so other skinners can save time on making their skins..
Saturnalize

Jackyyy wrote:

Loli Cjj wrote:

Someone can explain why circle at normal and slider has a kinda different opacity?



Or was it me?
Your are probably on the beat of the circle in editor and the slider starts at a later time. Notes will gradually fade out when they get further away from the point you are in the song for editor.
Don't know the name of this 'point in song' cause I can't map ;(
Hopefully you understood my bad explanation.
fyi the slider is on play so I believe it should be on 100%
Also hitcircle.png intended to be a bit transparent, I only curious about that overlay.
cloudofrain
Hey guys, I need help. I downloaded this image to create a comboburst, it had a grey background and I followed the steps in the tutorial to make the background transparent. I saved it as .png. In game it looks like this:
What am I doing wrong ?

Edit: Ok i could fix it by coloring the background white first and then removing it. You have to select the color that will be made transparent and it is white by default in gimp. Since i couldnt figure out how to change it to the exact grey i have i could do it this way.
Rei Hakurei
well sounds like the original image's deleted part didn't fully deleted, like 50% transparency left behind
Topic Starter
MLGnom
So it wasn't white as you can see.
1. Use colour picker tool to select background colour : (with this you will see that background colour wasn't white (#FFFFFF) )



2. Now open that picked colour and copy it's HTML notatnion :



3. Select mask of character and open "Colour to alpha" and change colour by clicking on bar and pasting previously copied HTML colour notation.



Well these combobursts tutorials still need upgrade. ^^;
aliciasimoned
I want to make a skin. i am new at this. The skin i am planning on doing is a Rozen Maiden skin. What do i do, how do i do it, what tools should i use?
deadbeat
try, photoshop, GIMP or Paint.net
Hakito
Did you guys figure this out by now?
I am too tired to go through all the comments just to see if you did.
Topic Starter
MLGnom
So... you are trying to put animated one and normal one together?

Because I can't tell anything else just from screenshot without explanation. :/
OsuMe65

Hakito wrote:

Did you guys figure this out by now?
I am too tired to go through all the comments just to see if you did.
different hitcircle overlay appears in a different combo string

like:
hitcircleoverlay.png = 1st combo string
hitcircleoverlay-0.png = 2nd combo string

will try it at school
quaternary

Loli Cjj wrote:

Someone can explain why circle at normal and slider has a kinda different opacity?



Or was it me?
Is your hitcircleoverlay partially transparent?

osu! has a bug where the hitcircleoverlay is drawn twice on the head of a slider, making it less transparent.

The only thing you can do about it is make your hitcircleoverlay opaque, sorry :(
Topic Starter
MLGnom
Okay, tested it and have some kind of conclusion.

Hitcircleoverlay were supposed to be animated.
Now is kinda funny to use. If you use hitcircleoverlay-0.png together with normal hitcircleoverlay.png then hitcircle will use only animated version. However Slider is using both, but beginning is additionally covered by "animation".
This way you can kinda create hitcircle that have different beginning and ending of slider. ;D

Hakito

MLGnom wrote:

So... you are trying to put animated one and normal one together?

Because I can't tell anything else just from screenshot without explanation. :/
hitcircleoverlay.png applies only to sliders.
hitcircleoverlay-0.png applies only to hitcircles.

This way sliders and hitcircles have different sprites.



Edit:

MLGnom wrote:

Okay, tested it and have some kind of conclusion.

Hitcircleoverlay were supposed to be animated.
Now is kinda funny to use. If you use hitcircleoverlay-0.png together with normal hitcircleoverlay.png then hitcircle will use only animated version. However Slider is using both, but beginning is additionally covered by "animation".
This way you can kinda create hitcircle that have different beginning and ending of slider. ;D

I don't even...

Edit2:
Anyway... I am gonna take that as a "No we didn't know about that", and move on.
aliciasimoned
can somebody help me with this skin because i am having a hard time
cloudofrain
Hi,
I created some combobursts and they have all white spaces. I never used gimp before and from the tutorial here I dont understand how to remove them properly, can somebody help pls^^
OsuMe65
Photoshop?

use either the Magic Wand or Magic Eraser (use it at your own risk)

-----------------------------------------------------------------

place the picture here and let me (or someone who has Photoshop) try (or try the suggestion above)
OsuMe65
(2nd post)

tested the conflict between 2 different overlays

Hakito is right (my assumption was wrong)


Fig. 1 Two Different overlays ingame

As you can see, hitcircleoverlay-0.png is the hitcircle (the black one) while the actual hitcircleoverlay.png is used in the slider (the white one)
FunnyFunkyCow_old
Just curious if there's an element to change the window that displays how many clicks with keyboard/ mouse?

TouchFluffyTail

FunnyFunkyCow wrote:

Just curious if there's an element to change the window that displays how many clicks with keyboard/ mouse?

inputoverlay-background.png 193x55. The image is horizontal and placed vertically in the game for whatever reason.
RinChise
O'hai.
I tried to copy (personal use) the skin from:
http://osu.ppy.sh/b/276290

That's how it should look like:

and that's how it looks on my Skin:

Would be glad about some help.
TouchFluffyTail
In your skin.ini under the [Colours] section you need to set your combo colors, that image uses 255,255,255 so if you want all your combos to be like that set the five combo# lines to white.

[Colours]
Combo1 : 255,255,255
Combo2 : 255,255,255
Combo3 : 255,255,255
Combo4 : 255,255,255
Combo5 : 255,255,255
RinChise

TouchFluffyTail wrote:

In your skin.ini under the [Colours] section you need to set your combo colors, that image uses 255,255,255 so if you want all your combos to be like that set the five combo# lines to white.

[Colours]
Combo1 : 255,255,255
Combo2 : 255,255,255
Combo3 : 255,255,255
Combo4 : 255,255,255
Combo5 : 255,255,255
Tyvm.
Forgot to save the default one, could you write that one pls?
TouchFluffyTail
Default colors should be

[Colours]
Combo1: 255,150,0
Combo2: 5,240,5
Combo3: 5,5,240
Combo4: 240,5,5
Combo5: 240,5,5
dezno
Was asked to post my question her, so just copypasting my post. Apparently it was in the wrong forum and I was told to try to ash here:

Hi, I recently downloaded a skin called Default by Default. Found it in the desc of this video; ( http://www.youtube.com/watch?v=71l07AHFHLQ )
But when I try to use it myself the skin looks like this "in-game" http://prntscr.com/1lfsn0 As you can see it's kinda stretched. The download was a zip file, so I unzipped it into osu!>skins. How can I fix this? thx

Edit: Please watch the video, then the screenshot to compare.

Update: Tried another skin, this time it's not stretched, it's more shrinked. Screenshots: http://prntscr.com/1lfvk1 , http://prntscr.com/1lfvn2 . I didn't get this error with the other skin.
aliciasimoned
well i need some help with a rozen maiden skin and my computer wont let me make it because it is too slow
TouchFluffyTail

dezno wrote:

Hi, I recently downloaded a skin called Default by Default. Found it in the desc of this video; ( http://www.youtube.com/watch?v=71l07AHFHLQ )
But when I try to use it myself the skin looks like this "in-game" http://prntscr.com/1lfsn0 As you can see it's kinda stretched. The download was a zip file, so I unzipped it into osu!>skins. How can I fix this? thx
It doesn't look stretched at all? It looks totally fine.


dezno wrote:

Update: Tried another skin, this time it's not stretched, it's more shrinked. Screenshots: http://prntscr.com/1lfvk1 , http://prntscr.com/1lfvn2 . I didn't get this error with the other skin.
I think that has something to do with your system's language conflicting with the format of the .ini, I had a friend from Norway run into the same issue and I can't remember how he fixed it.
dezno

TouchFluffyTail wrote:

dezno wrote:

Hi, I recently downloaded a skin called Default by Default. Found it in the desc of this video; ( http://www.youtube.com/watch?v=71l07AHFHLQ )
But when I try to use it myself the skin looks like this "in-game" http://prntscr.com/1lfsn0 As you can see it's kinda stretched. The download was a zip file, so I unzipped it into osu!>skins. How can I fix this? thx
It doesn't look stretched at all? It looks totally fine.


dezno wrote:

Update: Tried another skin, this time it's not stretched, it's more shrinked. Screenshots: http://prntscr.com/1lfvk1 , http://prntscr.com/1lfvn2 . I didn't get this error with the other skin.
I think that has something to do with your system's language conflicting with the format of the .ini, I had a friend from Norway run into the same issue and I can't remember how he fixed it.
Trust me, it's really stretched on the one skin and minimized on the other skin or w/e. You should be able to see a clear difference from my screenshots and the guys video. I have a 1920x1080 resolution and the whole thing is stretched like sh#t. Also, when I put it to the default osu skin it was stretched and I had to uninstall my skins to have it normal again.
show more
Please sign in to reply.

New reply