Sign In To Proceed 435v5c

Don't have an ? 473g1v

osu! to create your own !
forum

Skinning tutorial (+ skinning ) 646s2v

posted
Total Posts
4,226
show more
is playfield.jpg useless now ?
isn't that playfield.png?
Topic Starter
Well, playfield.png is still used in few old maps that doesn't have background.
i tried renaming the bg of a map, and osu! displayed a black background instead of playfield.png (song selection)
Topic Starter
It only works when map doesn't have any bg from beginning. If you remove bg from map it won't work.

Example : http://osu-ppy-sh.jeuxcrack.net/s/2934
ahhhh.... makes sense. haha
Does anyone know how to change the mod icon on the background?

JeMhUnTeR wrote: 605c39

i tried renaming the bg of a map, and osu! displayed a black background instead of playfield.png (song selection)
You can try removing the BG and putting in playfield.png and rename it to BG.png. Not sure if this works but it's worth a try.
Topic Starter

Ogion wrote: 20f25

Does anyone know how to change the mod icon on the background?
Actually, you can change that, but I'm not sure if this will be available in new template skin.

Try to edit :
mode-fruits.png
mode-taiko.png
mode-osu.png
mode-mania.png

But don't complain if it's going to be disabled. We don't know what we can and what we can't add to our skin. ^^;
MLGnom, it works! Thank you.
How about to new mods like Fade-in, Nightcore, and Perfect?

ArcadeSona wrote: 352l3g

How about to new mods like Fade-in, Nightcore, and Perfect?
selection-mod-fadein.png
selection-mod-fadeout.png
selection-mod-nightcore.png
selection-mod-perfect.png
The fadein, fade out is new mode (or not, because i don't play mania) but the rest is old.
what fadeout. there's no such mod as fadeout (afaik, that is)

JeMhUnTeR wrote: 605c39

what fadeout. there's no such mod as fadeout (afaik, that is)
Oops, i forgot. That's the old mod before update 3/28
Now it's hidden again LoL
How do you make translucent hitcircles?

Francis56789 wrote: 5i5d1w

How do you make translucent hitcircles?
Reduce opacity of image in Photoshop or any image editor that png with transparent.
aha! found 1 part of the skin used,

menu-osu.png

Description:
It can be seen by watching your failed replay until the end

Example in my skin


that's all I discovered
Anyone have idea about selection-mod-freemodallowed.png
Found it by accident while "hacking" to some resources xD

Yuki-kun wrote: 642j17

Anyone have idea about selection-mod-freemodallowed.png
Found it by accident while "hacking" to some resources xD
wtf is that?

OsuMe65 wrote: 4d3mn

Yuki-kun wrote: 642j17

Anyone have idea about selection-mod-freemodallowed.png
Found it by accident while "hacking" to some resources xD
wtf is that?
nvm
I found its position~
Will post later xD
Ok this is what i got :3

This extra mod icon also appears in the modifier playing list.


This icon was made originally to full transparency as it wasn't a mod. Also appears in multiplayer screens if other time-based mods are enabled.

Garygoh884 wrote: 1f51y

This extra mod icon also appears in the modifier playing list.


This icon was made originally to full transparency as it wasn't a mod. Also appears in multiplayer screens if other time-based mods are enabled.
Yes, that's why we shouldn't turn it on after all. It's just a funny part when make screenshot for ranking score :P

Yuki-kun wrote: 642j17

Anyone have idea about selection-mod-freemodallowed.png
Found it by accident while "hacking" to some resources xD
Do you know what it's size?

Garygoh884 wrote: 1f51y

This extra mod icon also appears in the modifier playing list.


This icon was made originally to full transparency as it wasn't a mod. Also appears in multiplayer screens if other time-based mods are enabled.

vahn10 wrote: 6c2y5u

Yuki-kun wrote: 642j17

Anyone have idea about selection-mod-freemodallowed.png
Found it by accident while "hacking" to some resources xD
Do you know what it's size?
In my case, i used 552x362 (1366x768 res)
But please note that i used only for fun.
If you want to use, smaller will be better than, same size with mod icon (67x65...i guess)

Yuki-kun wrote: 642j17

In my case, i used 552x362 (1366x768 res)
But please note that i used only for fun.
If you want to use, smaller will be better than, same size with mod icon (67x65...i guess)
It covers mods you used when not reduced opacity like in my image
I should be the same size as the mod icons as it appears as an extra mod but doesn't appear on nomod.


I made mine wider cause didn't like it overlapping with the mods cause I am just putting some random image there.

vahn10 wrote: 6c2y5u

Yuki-kun wrote: 642j17

In my case, i used 552x362 (1366x768 res)
But please note that i used only for fun.
If you want to use, smaller will be better than, same size with mod icon (67x65...i guess)
It covers mods you used when not reduced opacity like in my image
I forgot to tell you that you need to use transparent image xD
Anw, this is mine.
OK
This really not good after all xD


Also, for anyone want to change the hitsound when press F12 (screenshot), try to add this file
shutter.wav

Yuki-kun wrote: 642j17

OK
This really not good after all xD


Also, for anyone want to change the hitsound when press F12 (screenshot), try to add this file
shutter.wav
thanks, first to test it

100% works

did you also try menu-osu.png?

If you have one you can post it

and I forgot the size

It must be 520x520 pixels
you can make it bigger or smaller depending you want
I tried but seem like it appear in that map only.
Can't see it anywhere in normal mode @@

Yuki-kun wrote: 642j17

I tried but seem like it appear in that map only.
Can't see it anywhere in normal mode @@
You can see it in watching your failed replay until the end

vahn10 wrote: 6c2y5u

Yuki-kun wrote: 642j17

I tried but seem like it appear in that map only.
Can't see it anywhere in normal mode @@
You can see it in watching your failed replay until the end
Yes i know, when i tried in taiko mode in that map, it appeared, but when i try in standard mode, it's nothing @_@

Yuki-kun wrote: 642j17

I tried but seem like it appear in that map only.
Can't see it anywhere in normal mode @@
Yes i know, when i tried in taiko mode in that map, it appeared, but when i try in standard mode, it's nothing @_@[/quote]

It has to be
Is there something like fruit-ryuuta when press shift ?
Topic Starter
Dash in CtB uses "fruit-ryuuta.png". If you made animated catcher, you need to add base sprite of your character.

fruit-ryuuta.png - will be used as dash (might need some positioning if you want to make it correctly with animation.
fruit-ryuuta-0.png
fruit-ryuuta-1.png
fruit-ryuuta-2.png
fruit-ryuuta-3.png
etc... are animations of your character. This is the only one exception where animation overrides base sprite.
One more. Is there a possible way to change the font for a skin?
Topic Starter
What do you mean by "change font of the skin"? Font of what? Score numbers, texts, etc. or the font that osu! uses almost everywhere?

MLGnom wrote: 3b6q29

What do you mean by "change font of the skin"? Font of what? Score numbers, texts, etc. or the font that osu! uses almost everywhere?

Every font that osu! uses please.
Topic Starter

ArcadeSona wrote: 352l3g

MLGnom wrote: 3b6q29

What do you mean by "change font of the skin"? Font of what? Score numbers, texts, etc. or the font that osu! uses almost everywhere?
Every font that osu! uses please.
So that way, you can't change it. And I'm pretty sure you won't be able to change it in future.

ArcadeSona wrote: 352l3g

One more. Is there a possible way to change the font for a skin?
osu! uses the font "Verdana" which is one of Windows' System Fonts (if i'm correct)

It is non-skinnable and definitely no one can change it.

OsuMe65 wrote: 4d3mn

ArcadeSona wrote: 352l3g

One more. Is there a possible way to change the font for a skin?
osu! uses the font "Verdana" which is one of Windows' System Fonts (if i'm correct)

It is non-skinnable and definitely no one can change it.
peppy said Tahoma *iirc*
loool

Rei Hakurei wrote: 4f2a6p

peppy said Tahoma *iirc*
ah yes...
i forgot about that already
primrose
Can someone make a list and what it does to new skinnable elements?

Awoken- wrote: e3j1x

Can someone make a list and what it does to new skinnable elements?
the template? and check what people keep talking on this thread?

Rei Hakurei wrote: 4f2a6p

Awoken- wrote: e3j1x

Can someone make a list and what it does to new skinnable elements?
the template? and check what people keep talking on this thread?

there isnt a template yet for new skin.
someone on #osu changed the ui font before. (well I have no idea if that's still possible on the new build but meh)
i forgot who he was, though.

I really hope peppy is already working on improving the taiko and mania interfaces though... oh well *back to enjoying my time drawing vividred operation*
Hey!!

Update the template plz

thx

Immaterial wrote: 143c5z

Hey!!

Update the template plz

thx
You should pm peppy instead of posting here :P
seriously? I thought it was difficult to . I'll do it anyway. thx
You should wait and keep on eye on the foruns, he said he will release it, so he will. No need to pm him for that :P
-_- I have not all the time in the world, I will have to check the total program
take long to publish the new skin? say how long it will take to publish about

I have a question, the new skin accepts funds in 1920x1080 resolution and resized according to the 's screen?

sorry for my bad English I'm Spanish and I'm using google translator to write
Topic Starter

jarrisonfor wrote: 1631y

take long to publish the new skin? say how long it will take to publish about

I have a question, the new skin accepts funds in 1920x1080 resolution and resized according to the 's screen?

sorry for my bad English I'm Spanish and I'm using google translator to write
Well, that's depends on person who is making skin. (his/her photoediting skills, ideas, free time, what is actually skinned etc.). If person really want to release skin it can take few days - up to week.

Yes it is, as long as it's created for HD resolution (resolution with height larger than 1000px or forced in osu! config file). Every skin file that is supposed to be HD should have "@2x" in the end. For example :
[email protected]

MLGnom wrote: 3b6q29

jarrisonfor wrote: 1631y

take long to publish the new skin? say how long it will take to publish about

I have a question, the new skin accepts funds in 1920x1080 resolution and resized according to the 's screen?

sorry for my bad English I'm Spanish and I'm using google translator to write
Well, that's depends on person who is making skin. (his/her photoediting skills, ideas, free time, what is actually skinned etc.). If person really want to release skin it can take few days - up to week.

Yes it is, as long as it's created for HD resolution (resolution with height larger than 1000px or forced in osu! config file). Every skin file that is supposed to be HD should have "@2x" in the end. For example :
[email protected]

thanks for the reply, but sorry I have a problem with that you said about @ x2

is that it does not work I put an image and adapt to 1920x1080 resolution I put the name to be next to @ x2 and does not work, put a transparent black screen

supposedly this although I have a lower resolution screen (mine is 1366x768) image would have to adapt to my resolution even though the picture is 1920x1080 right?

What I want is to make a skin that can be used on any screen and images are made full screen
Topic Starter
If you are using 1366x768 you (or anyone else) will need to force this option to work. (resolution height is lower than 1000px)

Find in main osu! folder, file named "osu!.<name>.cfg" and open it with notepad.
Then you need to find this line :
HighResolution = 0

And change 0 to 1.

If you want to make skin for every resolution just make 2 backgrounds : Normal and HD (this is even recommended for everyone if someone is making HD skin)

Also, that @x2 MUST be 2x size of normal sprite since it will be way to small.

Example :
"pause-overlay.png" - is normal pause screen. Size : 1366x768px
"[email protected]" - will be replaced if person is using resolution with height above 1000px or forced it (this thing above). Size : 2732x1536px
I really need the metrics for the ranking screen elements!
Topic Starter
About which elements do you need to know?
Preferred size of "Perfect," how to align the score graph and position of accuracy/combo numbers
is it possible to screenshot in the game and crop out the default skin ? lol

AussieEvil wrote: 56ta

Preferred size of "Perfect," how to align the score graph and position of accuracy/combo numbers
For reference...
but it doesn't work in the new skin style




btw, We need to skinning for new skin style?
Topic Starter

AussieEvil wrote: 56ta

Preferred size of "Perfect," how to align the score graph and position of accuracy/combo numbers
I will tell you a little more about this tomorrow. :3

senofdark wrote: 1p1s21

is it possible to screenshot in the game and crop out the default skin ? lol
If you really want, sure it's possible. You can get most of the elements that way.

senofdark wrote: 1p1s21

btw, We need to skinning for new skin style?
No, actually you can decide with which style you want to make a skin (but stil,l older skins might need some fixing).



I'm slowly testing things and maybe I will be able to make another update soon.
I have two questions:
1. what are all the animate-able elements again...??
2. how do I name @2X animated elements? should it be <name>[email protected] or <name>@2x-0.png??
Topic Starter

JeMhUnTeR wrote: 605c39

I have two questions:
1. what are all the animate-able elements again...??
2. how do I name @2X animated elements? should it be <name>[email protected] or <name>@2x-0.png??
You can also create animation of several skin parts, with are :
- followpoint
- fruit-ryuuta
- menu-back
- play-skip
- scorebar-colour
- sliderfollowcircle
- taiko mascot
- taikocircleoverlay
- taikobigcircleoverlay
- hitbursts (300,100,50,miss etc.)
- hitcircleoverlay
- sliderball
And there is few in osu!mania like LightingL, hitbursts etc. but I don't them all (and maybe I missed something ^^; ).

2. After counting of animation, before .png extension.

"[email protected]"
"[email protected]"
"[email protected]"
"[email protected]"...
animating the osu!mania hitbursts isn't good. only 3 or 4 frames will be appear since the next notes will most probably replace it. hmm.... thanks.

edit: use 12 frames
using kona x taros' template of ranking-perfect.png and ranking-graph.png , I've done It well and It turned nice thou I attempt many times

primrose
Thanks MLGnom for the HighResolution trick, I'm going to try it.
Also is there any new elements? :o
Topic Starter
There is few "new" elements, some has been changed, some have changed position a little. Everyone is still waiting for new template.

MLGnom wrote: 3b6q29

There is few "new" elements, some has been changed, some have changed position a little. Everyone is still waiting for new template.
some might be/ are removed

MLGnom wrote: 3b6q29

If you are using 1366x768 you (or anyone else) will need to force this option to work. (resolution height is lower than 1000px)

Find in main osu! folder, file named "osu!.<name>.cfg" and open it with notepad.
Then you need to find this line :
HighResolution = 0

And change 0 to 1.

If you want to make skin for every resolution just make 2 backgrounds : Normal and HD (this is even recommended for everyone if someone is making HD skin)

Also, that @x2 MUST be 2x size of normal sprite since it will be way to small.

Example :
"pause-overlay.png" - is normal pause screen. Size : 1366x768px
"[email protected]" - will be replaced if person is using resolution with height above 1000px or forced it (this thing above). Size : 2732x1536px


It does not work, I was doing the skin in HD (1920 x 1080) and does not work, so I put the @ x2 does not work, or setting the "HighResolution: 1"

Edit: Forget it, I worked-_-
Edit 2 e.e: I found two states of an image, that of mode.

selection-mode.png
selection-mode-over.png

Is the new button where you select the game modes of rest, even not find them.

Immaterial wrote: 143c5z

Quote:

MLGnom wrote: 3b6q29

If you are using 1366x768 you (or anyone else) will need to force this option to work. (resolution height is lower than 1000px)

Find in main osu! folder, file named "osu!.<name>.cfg" and open it with notepad.
Then you need to find this line :
HighResolution = 0

And change 0 to 1.

If you want to make skin for every resolution just make 2 backgrounds : Normal and HD (this is even recommended for everyone if someone is making HD skin)

Also, that @x2 MUST be 2x size of normal sprite since it will be way to small.

Example :
"pause-overlay.png" - is normal pause screen. Size : 1366x768px
"[email protected]" - will be replaced if person is using resolution with height above 1000px or forced it (this thing above). Size : 2732x1536px



It does not work, I was doing the skin in HD (1920 x 1080) and does not work, so I put the @ x2 does not work, or setting the "HighResolution: 1"

Edit: Forget it, I worked-_-

Edit 2 e.e: I found two states of an image, that of mode.

selection-mode.png
selection-mode-over.png

Is the new button where you select the game modes of rest, even not find them.
since i'm working with my test skin with those new elements (probably, some element guesses from Clementine's archive), yes. it is the button where you can change the game mode



in that screenshot: selection-mode.png [hover image is selection-mode-over.png] (the one in violet)
Jajaja es que uso el google traductor y ha traducido mal... lo que quería decir es que no he encontrado mas formas de personalizar ese botón, como los 4 apartados :Taiko, osu,ctb y mania, he buscado pero :/ se me ha dificultado un poco ese Net Framework esta super largo, que gran trabajo fue lo que me impresiono, Peppy se ha esforzado.
for reminder,
selection-XXX-over is OVERLAY whenever being hovered by mouse, so it doesn't replace the selection-XXX itself, (read: it'll load both of them when hovering)

Immaterial wrote: 143c5z

Jajaja es que uso el google traductor y ha traducido mal... lo que quería decir es que no he encontrado mas formas de personalizar ese botón, como los 4 apartados :Taiko, osu,ctb y mania, he buscado pero :/ se me ha dificultado un poco ese Net Framework esta super largo, que gran trabajo fue lo que me impresiono, Peppy se ha esforzado.(i won't give any translations cause the translator has many epic grammars)
you mean, the game mode icons itself (in the Mode button)?

these elements might work:
For Standard
mode-osu-med.png
mode-osu-small.png
For Taiko
mode-taiko-med.png
mode-taiko-small.png
For CTB
mode-fruits-med.png
mode-fruits-small.png
For Mania
mode-mania-med.png
mode-mania-small.png
But, and the background black?

Immaterial wrote: 143c5z

But, and the background black?
Add a plain black .png image and name it "playfield"
Is there any specific string for skin.ini that enables animated followpoints? (I mean new arrow ones)
They appear differently for default new osu! skin and empty custom skin. Even if I force new skin elements in the menu for empty one D:
Not yet i think. We just gotta wait for peppy to finish the skin
I noticed my skins have the count1, count2, and count3 sounds but I can't seem to find the file that says "Go!" after the countdown. Not sure if I'm very careless but could someone provide the right name for the file?

PikaPika677 wrote: 25463e

I noticed my skins have the count1, count2, and count3 sounds but I can't seem to find the file that says "Go!" after the countdown. Not sure if I'm very careless but could someone provide the right name for the file?
gos.wav

Don't ask me why it has "s" xD

Yuki-kun wrote: 642j17

PikaPika677 wrote: 25463e

I noticed my skins have the count1, count2, and count3 sounds but I can't seem to find the file that says "Go!" after the countdown. Not sure if I'm very careless but could someone provide the right name for the file?
gos.wav

Don't ask me why it has "s" xD
Because the .png file is named "go.png"
Yukki_old_1
can someone explain a little bit about
some new skin element like this one
SPOILER

+ cursormiddle.png and new cursortrail.png
i still not really understand how they work

[ Y P ] wrote: 5w6a46

can someone explain a little bit about
some new skin element like this one
SPOILER

+ cursormiddle.png and new cursortrail.png
i still not really understand how they work
Cursors work this way: (i used Photoshop's Layers and sequence the elements from the top to bottom)


While the new spinner goes like this (in default):
Yukki_old_1

OsuMe65 wrote: 4d3mn

Cursors work this way: (i used Photoshop's Layers and sequence the elements from the top to bottom)


While the new spinner goes like this (in default):
ic...
but did the cursortrail's size limited only up to 10*10 ?
cz as far as what I can see, most of new skin have cursotrail's size around 1*1 or 8*8
Actually it doesn't have any limit for the size of any image in this game. That limit is only used to make sure it shouldn't break the game interface.
In my case, i still use a cursortrail 60x60.

Edit: LoL, your 499th post and my 466th post xD
Topic Starter
No, it isn't limited. If you want 80x80px do it, if you want more...do it. ^^;

But "cursor trail" have different behaviour if you add "cursor middle". If you are making large cursor trail together with cursor middle it requires more powerful PC to looks good (because it can heavily reduce fps).
A small question: More image = more load = more reduce FPS?
Does this mean we shouldn't use more animated part in game?

Yuki-kun wrote: 642j17

A small question: More image = more load = more reduce FPS?
Does this mean we shouldn't use more animated part in game?
imo (in my opinion), you can use animated parts depending on your preference
and it does not necessarily mean that a great FPS drop might occur

this happens (the FPS drop/Lag) for some players who are running low end PCs
filesize does matter too (in some occasions)

Yuki-kun wrote: 642j17

gos.wav

Don't ask me why it has "s" xD
Ah, thanks a lot. It wasn't in the template skin so I got confused.

[ Y P ] wrote: 5w6a46

can someone explain a little bit about
some new skin element like this one
SPOILER

+ cursormiddle.png and new cursortrail.png
i still not really understand how they work
Cursor.png goes under cursormiddle and is rotatable. Cursormiddle will cause cursortrail to have an unlimited drawing rate, and is the topmost part of the entire cursor. This item does not rotate. Cursortrail is the bottom-most item and its drawing rate becomes unlimited if cursormiddle is present

Spinnertop and spinner bottom are the parts that "spin around" when you're doing a spinner. Spinnermiddle is the main part of the spinner where the spinnertop/bottom fits inside. Spinnerglow is the glow around the whole spinner. Spinnerapproachcircle is the element that changes in color as the spinner comes to an end. I actually play with the traditional "classic" style spinner so pardon me if the information I give is inaccurate, but I did a little testing prior to this post just to make sure :)
Topic Starter

Yuki-kun wrote: 642j17

A small question: More image = more load = more reduce FPS?
Does this mean we shouldn't use more animated part in game?
The only noticeable fps drop is when you are using really large pictures or if you are doing any long and fast animations (50+ frames on hitbursts for example), but too be honest you must have really old PC (or something messed up on newer) to have fps drops caused by skins .

I'm actually using netbook Acer - Aspire One with AMD C-50 Dual core 1GHz U, 4 GB ram and Radeon HD 6250. I'm running osu! at 220 fps easily and when using HD skin (with forced HD in config file) and long cursor trail behaviour (29x29px size) still have fps at ~120-140.

Kert wrote: 6o3b5i

Is there any specific string for skin.ini that enables animated followpoints? (I mean new arrow ones)
They appear differently for default new osu! skin and empty custom skin. Even if I force new skin elements in the menu for empty one D:
use this atm. it's my 60-frame followpoint. it's some kind of an imitation of the default, plus a smoother motion and cleaner exit. use at 60 FPS setting on your skin.ini.

also, I hate the cursortrail right now. It draws the trail depending on the size of your cursortrail sprite (if you have a cursormiddle). I can't use my 150x150px smooth cursortrail anymore >.<
anyone know how to change this back to how it works before?
found something new in skin again :idea:

it's name is selection-mod-random.png

dimensions: same size as other mod Icons

only appears in osu! mania

OMG new osu!mania mod <3

JeMhUnTeR wrote: 605c39

OMG new osu!mania mod <3

poot you!!!


did you try it?
yeah, and I'm updating my skin right now.
halp halp halp
I can't force osu! to use high resolution elements!! osu! keeps modifying the osu!.cfg everytime it starts up. any ideas?

JeMhUnTeR wrote: 605c39

halp halp halp
I can't force osu! to use high resolution elements!! osu! keeps modifying the osu!.cfg everytime it starts up. any ideas?
Any error screenshot? @@
how to change the color to the play-warningarrow? in the skin's folder the arrow is red, but then appears blue.... why? I suppose it is possible to change the color in the skin.ini


here is an example:

how is the arrow


how appears



sorry for the bad pictures, but I think the point is clear :P
@Lance5 the play-warningarrow was recolored since the last last last update. We won't know how to change it back until peppy releases the template skin.

yuki-kun, what? there are no error messages. it's just that osu! rewrites osu!.cfg and overwrites the HighResolution setting everytime I start osu!.
show more
Please sign in to reply.

New reply 1b384i