forum

Skinning tutorial (+ skinning support)

posted
Total Posts
4,226
show more
Timorisu
Adding a cursormiddle.png will solve that I think
Primusvici

Dannyb77 wrote:

Ugh, basically my cursor trail isn't working properly. I want a nice, smooth line like the one with the default cursor but using the cursor from the Niko V5 skin. Any idea how to do this?

Here's two screenshots to show what I mean:

http://osu.ppy.sh/ss/1142313 - This is what my cursor looks like when I move it around (small circles appearing every so often, NOT forming a line)
http://osu.ppy.sh/ss/1142306 - Default skin, there's so many circles that they form a nice, smooth line.
Try adjusting the cursortrail.png size to a minimum without borders, for example:

This is how my cursor is (cursortrail 11x11)

and this is what it looks like:
Rei Hakurei
well, maybe i didn't read again this thread but i want to ask something,
ranking-replay.png on version 2 didn't worked, is there any alternate filename?

edit: p/2430659/ i'll try this first :P (sorry for wasting your time)
Garygoh884
You can use pause-replay.png for new version skinning in the ranking screen. On that screen you can see one of the pause buttons from your pause screen.
Mamat
hank you it really helped me a lot to make a skin
funDuck
Where can i get default skip and back buttons? Sry if it has been asked before, i tried to search.
Nathanael

funDuck wrote:

Where can i get default skip and back buttons? Sry if it has been asked before, i tried to search.
It was just on the announcements. XD
Here: osu! Default Skin Template (2013-04-23)

Or at the first post.
funDuck
Ye, I saw it, but this archive doesn't contain those buttons :s

oh wait, it does. Thanks, I'm blind apparently.
Mukizawa
good guide thank you !!! :roll:
Vertius
How can I add the design in the middle of my spinner? I mean I've got something like :
and i'd like to add a circle in the center of it, to know where to spinn exactly. How can i do this? I'd like to add this to background or to spinner-circle file, unless I can add it in another, different file... like spinner-center.png or something, i dont know if it is possible or it is not. How should I do this?
XPJ38
Something like this? You'll have to edit spinner-circle.png.
Vertius

XPJ38 wrote:

Something like this? You'll have to edit spinner-circle.png.
I thought of something like this:

in the middle of the spinner, I'd like it to fit into the 'crystals' around the center.
XPJ38
You'll still have to edit spinner-circle :P That's the proper way at least.
Vertius
How should I do it? I mean with which program, that's first, I thought about Gimp, because it's the only free program for picture-editing and it has quite a lot options, but how to do it? I already tried to edit it in Gimp, but I didn't know how to add my spinner center from another picture to this one.
XPJ38
Gimp is good but if it's your first time with this software, be aware that it isn't very user-friendly. You can grab Paint.NET, it does the same job and is a bit more user-friendly.

Here's the easy way: download this spinner centre if you don't have the spinner centre alone. If you want to change the colors, open it in Gimp/paint.net and either edit the saturation value or use the Fill tool. (don't know how to use the tool or change the saturation level? Google is your friend)
Then, open your initial spinner-circle and import the spinner centre (via drag-and-drop or the software menu). At this point, you'll have two layers (the spinner and its centre). If it isn't done automatically, move the spinner centre to the centre of the other layer. You can also resize the centre if necessary. There you go! Save the new file, name it spinner-circle.png and move it to your skin folder.
knazze
i have a made a new skin that contains a new cursor and blank images for the 300 beats but there is a small number "30" that appears when i hit the beats (notes) how can i remove that too?

,the spinner isn't transparent and blue like the original skin. it is yellow and orange like the old one.

and how can i change all of the sounds when i hit a beat to a certain voice, i have added a "normal-hitclap" and a "normal-hitnormal" sound files but sometimes i hear the original osu noise at some points of the song. ( the high hat noise )

Thanks in advance !
Nathanael

knazze wrote:

i have a made a new skin that contains a new cursor and blank images for the 300 beats but there is a small number "30" that appears when i hit the beats (notes) how can i remove that too?

,the spinner isn't transparent and blue like the original skin. it is yellow and orange like the old one.

and how can i change all of the sounds when i hit a beat to a certain voice, i have added a "normal-hitclap" and a "normal-hitnormal" sound files but sometimes i hear the original osu noise at some points of the song. ( the high hat noise )

Thanks in advance !
You've also sent this as a forum message at me. I've answered it already.
knazze

Nathanael wrote:

You've also sent this as a forum message at me. I've answered it already.
yeah i did >.< i didn't think you would be so fast to answer!
Thank You SENPAI!!
knazze

Nathanael wrote:

You've also sent this as a forum message at me. I've answered it already.
Ok this is kinda frustrating , i added the drum-hitclap and drum-hitnormal, drum-hitwhistle but i still hear the original drum sound in some of the beatmaps.
where can i find a list of every sound file that i need to include in the skin ?
OsuMe65
Tick on "Use Skin sound samples" or something like that.
(I don't know its actual name but it should work at all costs)

Also, don't forget to also tick on "Ignore beatmap hitsounds" while playing under Vsual Settings.
This will only do if your beatmap has custom sounds in it.
Uruoki
"play-warningarrow.png" is displaying with an incorrect color. This only happens when "Prefer new default skin behaviour" is enable. Is there something that needs to be added to "skin.ini" that is not mention in the first post?
Topic Starter
MLGnom
Sadly we aren't able to change that. New skin behaviour is forcing red overlay. :<
knazze

OsuMe65 wrote:

Tick on "Use Skin sound samples" or something like that.
(I don't know its actual name but it should work at all costs)

Also, don't forget to also tick on "Ignore beatmap hitsounds" while playing under Vsual Settings.
This will only do if your beatmap has custom sounds in it.
still doesn't work, when i play this map (https://osu.ppy.sh/s/104017) i still hear the drum sounds.

EDIT: nvm i got it to work , i ticked the "Ignore beatmap hitsounds" in the options instead of the one found while playing.
Thanks a lot !!
Lerionine Saven
Read the full tutorial just now.Any lists of each element min/max sizes? I need it..coz sometimes it oversized...

and thanks for the tutorial...helps me in skinning..
Rei Hakurei
there are no max limit, but you could size it around the template itself.
Seijiro
Wow, this will be very useful. In fact it already helped me a lot.

Thanks a lot :)
kernymi
Is there an easier way to make the score-numbers and the default-numbers?
I'm a bit lazy on the cropping and saving part.
Rei Hakurei
if you could perform a batch action on certain image editor to change from zero to nine and non-numerics, then make the batch command instead. (because i can't, i'm still performing one character directly)

------------------
btw, is it okay to put unused element that were formerly used on skin distribution later on?
Topic Starter
MLGnom

Rei Hakurei wrote:

edit: after looking the new template, it looks... different from the actual for some elements...
Well, we never got full official version so I needed to replace parts with something (some of them are from early version of new skin, some from old one)...
fishpaste39
Sorry for being such a noob but....do combo bursts have to be a part of your skin? thx a bunch :D
Rei Hakurei
yes it is.
Popo[Mikoto]
i want ask something

Can show only one number default-0 - 9 when over 10 note combo?
Rei Hakurei
i think it's not, it's basically the osu system on handling digits..
OsuMe65

Popo[Mikoto] wrote:

i want ask something

Can show only one number default-0 - 9 when over 10 note combo?

Rei Hakurei wrote:

i think it's not, it's basically the osu system on handling digits..
Actually, it's possible IF AND ONLY IF you're using circles as numbers and HitCircleOverlap: # (at skin.ini) is set 'till the circles are stacked at the center.
If you're using regular numbers, stacking them at the circle with HitCircleOverlap: # (at skin.ini) is TOTALLY ridiculous.
Alpha
HI GUYS!

I Have bit of a problem.
I use the -Kamui- Skin and its great, its a clean cut skin with nice hitsounds, awesome cursor, and sexy women.
However i want to customize it a tad more by doing a couple of things.
How do i add followpoint to the skin? I tried taking the followpoint data from other skins and putting it in the kamui skin file but it still doesnt work.
The Same problem happens when i add the SAO health bar image file to the kamui skin.

PLEASE HELP GUYS! I NEED THIS IN ORDER TO READ HD-HR BETTER XD
Shikeu
Is there a way to have spinner-background and spinner-metre when using new default skin behavior?
Ayesha Altugle
no
Popo[Mikoto]

OsuMe65 wrote:

Popo[Mikoto] wrote:

i want ask something

Can show only one number default-0 - 9 when over 10 note combo?

Rei Hakurei wrote:

i think it's not, it's basically the osu system on handling digits..
Actually, it's possible IF AND ONLY IF you're using circles as numbers and HitCircleOverlap: # (at skin.ini) is set 'till the circles are stacked at the center.
If you're using regular numbers, stacking them at the circle with HitCircleOverlap: # (at skin.ini) is TOTALLY ridiculous.

I got it

thank you OsuMe65
primrose
does anyone here know how to change the glow color in the main menu? the glow lightning that goes around the osu! logo.. it's for supporter only.. i forgot the code

thank you very much
Nathanael
Inside "skin.ini", include this on the colours section
[Colours]
MenuGlow: R,G,B

Replace R,G,B from the values you like.
OsuMe65

Nathanael wrote:

Inside "skin.ini", include this on the [Colours] section
[Colours]
MenuGlow: R,G,B

Replace R,G,B with the values you like.
------------------------ Removed
Nathanael
^ Removed something rude above

By the way, Is there a way to show the hitscores on the result screen but not on the gameplay?
OsuMe65
Hitscores (known as Hitbursts) are present in-game and in the panel. If you want the Hitbursts shown on the result screen ONLY, then edit ranking-panel.png with the hitbursts present; use transparent hitbursts.

Frank's Taiko no Tatsujin Skin = example of a skin that uses this logic
Nathanael
Oh, thanks.
Arctic
Cursor trail is too long?


As you can see it extends more than it should have. It started randomly today.
Nathanael
Its usually long when you have 'cursormiddle.png' at your skin.
Arctic

Nathanael wrote:

Its usually long when you have 'cursormiddle.png' at your skin.
thank you :)
primrose
thank you for that menuglow thingy bless u
EvianBubble
Hi there, I'm having troubles using the old spinner. I've downloaded the files from the old template, put them in a folder, and selected the skin under "Options", but I'm still getting the new spinner to appear. Could I get some help with this please? :S
Nathanael
Disable "Prefer new default skin behaviour" at the Skin tab.
Rei Hakurei
Just asking,
is Version:2 behaviour on selecting a song (which is the background of the map itself is not loaded yet) uses menu-background.jpg instead playfield.png ?
i hope its not a bug tho.
Arctic
Is there a limit to the size an image can be?
Rio-

hatseducer wrote:

Is there a limit to the size an image can be?
It depends... You can set the size of the images as large as possible though, but using the same sized images are recommended...
Topic Starter
MLGnom
Nope, you can do whatever size you want. Only few parts have restricted by size.

Rei Hakurei wrote:

Just asking,
is Version:2 behaviour on selecting a song (which is the background of the map itself is not loaded yet) uses menu-background.jpg instead playfield.png ?
i hope its not a bug tho.
Can't tell, I don't have supporter. But might be true. Test it on map that doesn't have background. https://osu.ppy.sh/s/2934
EvianBubble

Nathanael wrote:

Disable "Prefer new default skin behaviour" at the Skin tab.
It has never been enabled >_< That's part of the reason I'm so confused lol
Nathanael
Try to change the version to 1 (or just remove it) inside skin.ini if there is.
[ Zan ]
How do I make it so that spinner-circle doesn't shake/wobble?
Rio-

Nathanael wrote:

Disable "Prefer new default skin behaviour" at the Skin tab.
Ayesha Altugle

[ Zan ] wrote:

How do I make it so that spinner-circle doesn't shake/wobble?
read this thread
dws123
why does my scorebar-colour not fit into the scorebar itself?

http://prntscr.com/2cj370
Inori

dws123 wrote:

why does my scorebar-colour not fit into the scorebar itself?

http://prntscr.com/2cj370
Have you tried messing with the placement or canvas size of the scorebar-bg and scorebad-colour images yet?
dws123

Inori wrote:

Have you tried messing with the placement or canvas size of the scorebar-bg and scorebad-colour images yet?
I did, and in PS it fit perfectly, I wonder what's wrong
scorebar-bg is 757x72, scorebar-colour is also 757x72

here's the links to them if you want to check
http://puu.sh/5SIgw
http://puu.sh/5SIft
Vlerias
so where to download PSHOP
Inori

dws123 wrote:

Inori wrote:

Have you tried messing with the placement or canvas size of the scorebar-bg and scorebad-colour images yet?
I did, and in PS it fit perfectly, I wonder what's wrong
scorebar-bg is 757x72, scorebar-colour is also 757x72

here's the links to them if you want to check
http://puu.sh/5SIgw
http://puu.sh/5SIft
The problem is that the scorebar-colour image doesn't fit correctly even if it's aligned with the scorebar-bg image in a photo editor, it's a god awful thing but what you're going to have to do is:
  1. crop the area where the bars are present in the colour image
  2. adjust it on its x and y axis until it fits correctly in game.
dws123

Inori wrote:

The problem is that the scorebar-colour image doesn't fit correctly even if it's aligned with the scorebar-bg image in a photo editor, it's a god awful thing but what you're going to have to do is:
  1. crop the area where the bars are present in the colour image
  2. adjust it on its x and y axis until it fits correctly in game.
OK then, thanks for the help :)
rcmero

Vlerias wrote:

so where to download PSHOP
Buy it. Or get GIMP, which ever's best for you.
Vlerias
oh really?
Thank :D
FunnyFunkyCow_old
~noob question~

I'm trying to make the mod icons in my skin at the moment...
I want to use certain images within the icon, so I created the icons, made it look pretty, etc. etc.
I shrinked it down to 65x65 and now it looks horrid.

How should I create the icons so it won't be as horrid?
Rio-

FunnyFunkyCow wrote:

I shrinked it down to 65x65 and now it looks horrid.

How should I create the icons so it won't be as horrid?
Try Using 90x90, It's HD Resolution...
OsuMe65

FunnyFunkyCow wrote:

~noob question~

I'm trying to make the mod icons in my skin at the moment...
I want to use certain images within the icon, so I created the icons, made it look pretty, etc. etc.
I shrinked it down to 65x65 and now it looks horrid.

How should I create the icons so it won't be as horrid?
130x130 for HD
65x65 for SD

Start making mod icons at 130x130
Then resize to 65x65

I hope that helps
Ayesha Altugle
In short HD first before SD
FunnyFunkyCow_old

satriobp wrote:

Try Using 90x90, It's HD Resolution...

OsuMe65 wrote:

130x130 for HD
65x65 for SD
Start making mod icons at 130x130
Then resize to 65x65

I hope that helps

vahn10 wrote:

In short HD first before SD


Ahh, okay, thanks for the help :)
Didn't really have any HD elements, didn't bother with process of enlarging all of them.. thought it'd be weird if I just had HD icons...

but I saw Wallpaper icons and did something similar to it..
Made all my icons 113x80, which was about the max size without having them overlap when selected.
Then just pasted in a ~5:3 wallpaper and it worked like a charm.


Oh, another question, I noticed that the snow is mode-osu-small...
but isn't that also the icon for the mode selection? I'm not sure if I'm a huge fan of having this:
Yukyy
It's menu-snow.png now. I think it was the same, but peppy changed it soon after.
https://osu.ppy.sh/p/changelog?v=b20131216.26
Garygoh884
The usage of menu-snow.png looks great on the main menu if you use it right:

rcmero

Yukyy wrote:

It's menu-snow.png now. I think it was the same, but peppy changed it soon after.
https://osu.ppy.sh/p/changelog?v=b20131216.26
If the skin doesn't have a menu-snow.png file, it uses the mode-X-small.png files, otherwise it uses that.
OsuMe65

rcmero wrote:

If the skin doesn't have a menu-snow.png file, it uses the mode-X-small.png files of the current game mode you're playing, otherwise it uses that.
fixed
Mamat
How to upload my skin to forum?
Rio-

willia02 wrote:

How to upload my skin to forum?
You can't upload It directly to the forum... You need A Cloud Service, like puu.sh or Mediafire... And then put the download link when You post Your skin
rcmero
Is skinning done differently on osu!droid? I copied the files for my skin to my phone yet the slider was untouched.
Rei Hakurei
yes, skin.ini is not applied there.
OsuMe65
in osu!droid: only SD elements are tolerated; no skin.ini
pielak213
­
rcmero

OsuMe65 wrote:

in osu!droid: only SD elements are tolerated; no skin.ini
Yes, I know, but the slider ball is still the same.

pielak213 wrote:

http://osu.ppy.sh/ss/1199671
i cri evrytim
wat is this i dont even
jaxter0987
How do I stop these from appearing?

Also, how can I set the spinner to be the current osu default spinner?
I see image files pertaining to this spinner but I don't know what to do to get this to show instead of the orange spinner.
rcmero

jaxter0987 wrote:

How do I stop these from appearing?
Make that a transparent 1x1 PNG.
OsuMe65

jaxter0987 wrote:

How do I stop these from appearing?

Also, how can I set the spinner to be the current osu default spinner?
I see image files pertaining to this spinner but I don't know what to do to get this to show instead of the orange spinner.
First of all... tick on Prefer new default, found in the Skin tab.

And, you can't stop that 30/10 if you're using the new default. It's only possible if you're using a custom skin with a blank sliderpoint10.png and sliderpoint30.png
jaxter0987

rcmero wrote:

jaxter0987 wrote:

How do I stop these from appearing?
Make that a transparent 1x1 PNG.
Are you referring to sliderscorepoint and sliderscorepoint@2x?

OsuMe65 wrote:

jaxter0987 wrote:

How do I stop these from appearing?
And, you can't stop that 30/10 if you're using the new default. It's only possible if you're using a custom skin with a blank sliderpoint10.png and sliderpoint30.png
Same question, since I don't see sliderpoint30.png and sliderpoint10.png in the new default template. It probably sounds like a stupid question, but I want to be sure before I fiddle around with things.
Nevermind, seems like I needed to add in the files myself. Thanks for the help guys.
Ayesha Altugle
disable new behaviour, then add 1x1 transparent sliderscorepoint10 & 30.png

don't tell me it doesn't work because it is really
OsuMe65
jaxter0987 wrote

OsuMe65 wrote:

jaxter0987 wrote:

How do I stop these from appearing?
And, you can't stop that 30/10 if you're using the new default. It's only possible if you're using a custom skin with a blank sliderpoint10.png and sliderpoint30.png
2. Same question, since I don't see sliderpoint30.png and sliderpoint10.png in the new default template. It probably sounds like a stupid question, but I want to be sure before I fiddle around with things.

OsuMe65 wrote:

jaxter0987 wrote:

Also, how can I set the spinner to be the current osu default spinner?
I see image files pertaining to this spinner but I don't know what to do to get this to show instead of the orange spinner.
First of all... tick on Prefer new default, found in the Skin tab.
3. Now I guess my gripe is that there's a spinner approach circle that shows up that doesn't show up in the new default even with the option ticked.

1. Actually, if you're using the new default of peppy (the one that is present in the skin selection but doesn't appear in the skins folder), you can't stop them from appearing in the slider.

2. In the template, that isn't found, yes. You have to make it on your own. If you want to get rid of those, make a 1x1 sliderpoint10.png and sliderpoint30.png.

3. If there's spinner-approachcircle.png inside your skin's folder, that will show on the spinner. Make it a blank 1x1 PNG file, if you don't want.

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

vahn10 wrote:

disable new behaviour, then add 1x1 transparent sliderscorepoint10 & 30.png

don't tell me it doesn't work because it is really
@vahn10: What a butthurt files you gave. Those files doesn't work, a-hole.
Ayesha Altugle
@OsuMe65
Words
That Message made me cry because you are trying to call me a butthead, please learn this:
NEVER insult others. because I am just a newbie too learning how to skin. Don't tell me you are right and I was wrong.because I GIVE ONLY SOME SUGGESTIONS THAT SOMETIMES LEAD TO RIGHT OR SOMETIMES WRONG. next time you do this AGAIN, I will call a moderator to remove that kind of post.

hope you never do this again and let us stop this fight once and for all
jaxter0987

OsuMe65 wrote:

1. Actually, if you're using the new default of peppy (the one that is present in the skin selection but doesn't appear in the skins folder), you can't stop them from appearing in the slider.

2. In the template, that isn't found, yes. You have to make it on your own. If you want to get rid of those, make a 1x1 sliderpoint10.png and sliderpoint30.png.

3. If there's spinner-approachcircle.png inside your skin's folder, that will show on the spinner. Make it a blank 1x1 PNG file, if you don't want.
1. That's weird because I've always been using the new default of peppy and those 10 and 30 point ticks never popped up. It was only when I downloaded and used the new default template in this thread that those 10 and 30 point ticks popped up.

2. We should fix the template then in my opinion. Ideally, I should be able to see an image file for all things that are customizable so everything can be as simple as making an image with the same dimensions and renaming that image accordingly.

I had already solved my problem but thanks for the info regardless.

Edit: I've been reading through previous pages and its interesting to see just how much I can customize my skin. I haven't read everything yet, but I'm wondering if it's possible to customize the background of the chat.

I'm probably not explaining myself very well but I'm talking about this part.
OsuMe65
simply no

Since the chat background is a part of the osu!UI and can't be customized.
And by the way, that artwork behind the chat? Can't be customized either.
[ Zan ]
Is it possible to change the volume of the hitsounds (asking about what program allows me to edit the hitsounds)? Asking this because 1 of my hitsound file is abnormally quieter than the rest of the hitsounds and I wanted to make it a bit louder.
OsuMe65
Audacity will do.
quaternary
Here's a tip when it comes to sound effect production.
Q: How do I-
A: Audacity.
Jerome
So my skin (for recording by reviz) has been doing this at the scoreboard http://puu.sh/605EQ.jpg

Someone says I need to enable "new style skin behaviour" - this does fix the scoreboard but then disables the custom spinner.
deadbeat
it doesn't disable it, so much as it'll use the other spinner animation :<
but yeah, if you want to fix that scoreboard issue, either use the new style skin animation, or fix the ranking panel element itself
OsuMe65

tuddster wrote:

Here's a tip when it comes to sound effect production.
Q: How do I-
A: Audacity.
He asked for an easy software to adjust the volume of the hitsound; not an easy software for producing hitsounds.

Read the context before posting your so-called "tips", tuddster.
Foneza
.wav should work as hitsounds right? Why can't I get my sounds to change? Is it restriction of not becoming a an osu!supporter or is it the format?
Foneza

ACEsushi wrote:

.wav should work as hitsounds right? Why can't I get my sounds to change? Is it restriction of not becoming a an osu!supporter or is it the format?
Solved it. I didn't enable sound change... =.=
show more
Please sign in to reply.

New reply