Site Network Movies Fan Submission Community Media Games News
There are 0 users online.
Username: Password: Save:
MK Online    Kommunity    Show Message
Join MK Online Free or become a Flawless Member for special benefits.
Top MKX Discussions
- Supreme Mortal Kombat Champion Tournament 2017!
- Injustice 2 Fighter Pack 1 Trailer Reveals Sub-Zero & More
- MKX Mobile - Baraka Challenge
- Speculation: Future of Non-Playable Characters In Doubt?
- Mortal Kombat X Mobile Announces Anniversary Update
- Kountdown: Top 10 Supremely Missed in Mortal Kombat X
- Mortal Kombat XL Announce Trailer
- MKX DLC: Unpacking Kombat Pack 2 Characters
- Mortal Kombat X Kombat Pack 2 Trailer - 4 DLC Fighters
- WSJ Reports Mortal Kombat X Sales Exceed Five Million
- Guide: Komplete Mortal Kombat X Brutality List

Register to join the discussion. Share stories via @MK_Online & Facebook.


MK Online User Poll

What's Next?
Mortal Kombat 11 (80%)
MK Action-Adventure (10%)
MK HD Re-release (2.8%)
WWE Immortals (0%)
MK Krossover (2.8%)
MK Special Forces (2.8%)
Other (1.4%)



Forum Listings


MK Online Site Updates
  • April 18th, 2018
    DC Announces Injustice vs He-Man [Read On]
  • April 16th, 2018
    Classic Superman Brings Golden Age to Injustice 2 Mobile [Read On]
  • March 31st, 2018
    Confirmed Ready Player One MK Cameos [Read On]
  • March 20th, 2018
    Mortal Kombat Coming to Netflix [Read On]
  • February 28th, 2018
    Best Buy Lists Injustice 2 Legendary Edition [Read On]


Site Themes
You must be logged in to
select themes.


MKO on Twitter




Fan Submission

Discussing and Sharing Works by MKOmmunity Members.
Page of 5

ArcticPosted: 08/25/2006 07:43 PMStatus ::


Rank ::
Visits::823
Nationality::Mexico
Userbar tutorial

OK, the only reason I made this thread is because I see some very poorly made userbars, i'm not gonna say any the usernames of people who made poor userbars.

So to fix this: Non other than ME, will show you how to make a awesome userbar!

1. Know what your're gonna make for a userbar, ideas are essential for userbars. If you can't think of anything, there shouldn't be a reason to make a userbar. You can make a userbar whether your're a "fan" "owner" "hater" "addict" "user" "member" or "lover" (nouns).

2. Design is always important! Know what design your're gonna have on your USERBAR! So search for high-quality pictures on a search engine. Or make one. (As I did in my "Proud Sprite Editor" userbar) Looking up logos will most likely get you results.

3. Let's start making a userbar now.

Open Photoshop. If you don't have it. Your're gonna have to ask someone to make one for you or learn how to make one with another program. But some features may not be in other programs.

Push Ctrl+N to make a new picture. Put in the size of the userbar which is: (width 350) x (height 19) Make sure it's tranparent. Something like this.
IMPORTANT: Make sure your're in RGB Color mode!

Like this picture here

Click "OK" now.
Hmm... Let's make a simple Mortal Kombat userbar. Let's use a basic Dark Red to Red Gradient. So pick those colors.

Dark Red to Red

Now that these colors are selected. Go to Layer>New Fill Layer>Gradient
Then click on Gradient.

On the top bar

Ignore the next dialog box and just Click "OK" Then where it says "Preset" choose yours (Yours will always be the first box) Then click "OK"

Click the first box please

Followed by this dialog box here.
This one

Ignore the preferences, but before you click "OK" click "Reverse" this will flip the gradient the opposite way according to the "Angle" It should be pointing up and say: 90 degress, then click "OK"

Like this...

Now let's get our picture. (You can have as many pictures as you want in your userbar, but in this tutorial we're gonna use one)

Doctored by Arctic

You may be thinking "That picture is WAY too big for my userbar" But luckily we have a tool. We can shrink it. Go to Image>Image size then click on "Image size"

On the top bar

Then this should appear.
Yeah, this dialog box

See where it says "Pixels" click on it you should see this...
Woo Whee!

Click on "Percent" And do the same thing to ONLY the bar below. It should show a 100% percent now. Put in 25% in one bar. It will automatically do the same thing to the other bar. Click "OK"

Much smaller now right? Good. This is it after the image shrink process.
Awesome

Now we're gonna make the "Userbar Pattern" I call it. Open a new picure with the size of 3 x 3. Make sure it's transparent and in RGB mode. Click "OK" now. Go to the brush tool and right click it, this should appear.

The pencil size should be like size 1

Use the Magnifying glass tool to zoom in all the way. Pick black. Not GREY! I see people using grey for their userbars, that's wrong. They should be using black. Afterwards, make this.

Just use your mouse to make the pattern

Then go to Edit>Define Brush

So...I love you

Then click on "Define Brush" then this should come up.

Yes.THIS!

Put in "Userbar Pattern" or whatever you want to put in. Then click "OK"

THERE! You won't ever have to do this again to make the userbar pattern. Unless your computer gets erased.

OK. Now that we have that, go back to your userbar document. Then go to Layer>New Fill Layer>Pattern

Pattern, BOI!

Another dialog box will appear. Ignore this one and press "OK"
A different dialog box will come out. Leave all the settings alone, they should be like this.

Make sure your settings are the same as mine

Okay. Settings are all good, so click "OK"
Is the pattern too plain and dark? Good. We can fix that. Press Shift+F5 and this window should come out.

Cool

Fix the settings so that they are the same. 70% is usually what you should use. It's just the perfect amount, but in other userbars you probably will use different colors and need to experiment with it a little. But in this tutorial use 70%

Now that our userbar is properly patterned. Let's put our picture in. Copy it. Then paste it in our userbar. Move it around to your liking. Now decide where you want it. Now press Ctrl+A then afterwards press Ctrl+Shift+E

Wow! Now your userbar is 1 Layer. Now we're going to put in that shine that make the userbar look 3D!

Here's what you do. Right click on the Marquee tool and pick the Elliptical Marquee tool.

THIS IS LOCO!

Now make a circle like this:
A circle that does NOT go outside the picture

Now go to Layer>New Fill Layer>Solid Color
Ignore the dialog box after.
On the top bar

Then click on "Solid Color" Then this window should come up.

Pick White!

Pick White. And click "OK"

Now Move the White circle up until it reaches to here.

Up to there...

Now press Shift+F5 and do this.

...Can't think of anything to say right now

Change the settings to match the picture above. Good, now we have slick shine. Click on the Text button. Looks like a "T" (Sorry. I don't want to a show a picture of that.) Put the font Visitor TT2 (BRK) Look up the font this website.

1001 free fonts

Now type in what you want your userbar to say. Proof read it before you save it. Put in size 12, then change the font to white, (usually, the color but you can change it if you want) leave the "Anti-Alias" to "None" (the "Anti-Alias is the double A's) Your settings should look like this:

Yes. I like Peanut Butter, oh and Chocolate!

Now insert your text. In this tutorial we'll put "Mortal Kombat Fan"

Sweet

The font looks boring doesn't it? OK then let's put a stroke around it. Go to Layer>Layer Style>Stroke

Image Hosted by some chessy website

Now click on "Stroke" on change those settings to these below!

Ooh La La

Got em'? Great! Now let's continue to our final step. (Optional, but will make your userbar bar look amazing ) Take a last good look at your userbar. Decide if that's where you want to keep the font in the same location and you know the drill. Done? Okay. Press Ctrl+A then press Ctrl+Shift+E and BAM! One layer.

Now we're gonna put a stroke on our userbar. Press Ctrl+A then go to Layer>Layer Style>Stroke

We've seen this picture before haven't we? Yes...we did...

Now put in the same settings we did for our last stroke but with an EXCEPTION!

Make sure where it says "Outside" to "Inside"
It will show the great stroke of the ENTIRE userbar. Something like this.

INSIDE!INSIDE!INSIDE!INSIDE!

There. We're done now. I hope you learned how to make a userbar. It gets very simple after a couple of times. When you do so many, you will be able to make them in 2 minutes. I mean, I do. So should you.

Your userbar should look like this:

MK1... the start of MORTAL KOMBAT!

Now save it or whatever. Questions, comments?

This tutorial was "Made by Arctic" inspired by crappy userbars.

Dragon Points:
RandyPosted: 08/25/2006 07:46 PMStatus ::


Rank ::
Visits::3353
Nationality::England
RE: Userbar tutorial

That is really great and im sure it will come in handy for a lot of people, you definately deserve DPs!

"A man with no sense of history is like a man with no eyes or ears"
Photo Sharing and Video Hosting at Photobucket
SickFreakPosted: 08/25/2006 07:49 PMStatus ::


Rank ::
Visits::488
Nationality::United States
RE: Userbar tutorial

Good tutorial. Are mine*gulp*crappy?

Why don't you have a seat?
ArcticPosted: 08/25/2006 07:53 PMStatus ::


Rank ::
Visits::823
Nationality::Mexico
RE: Userbar tutorial

SickFreak Wrote:
Good tutorial. Are mine*gulp*crappy?


Not at all Sick Freak. Yours are better than most people. But your're missing the userbar pattern.

Someone should sticky this.

JediTommy8Posted: 08/25/2006 07:58 PMStatus ::


Rank ::
Visits::8041
Nationality::United States
RE: Userbar tutorial

There's a Userbar Generator site on the web....just incase you wanted to know.

Good tutorial nontheless.

Photobucket
ArcticPosted: 08/25/2006 08:02 PMStatus ::


Rank ::
Visits::823
Nationality::Mexico
RE: Userbar tutorial

JediTommy8 Wrote:
There's a Userbar Generator site on the web....just incase you wanted to know.



Good tutorial nontheless.


I didn't know that. Thanx anyway. Still, most pictures in this tutorial should be bigger. I don't know why it looks terribly small!

Hikari715Posted: 08/25/2006 08:48 PMStatus ::


Rank ::
Visits::1301
Nationality::Canada
RE: Userbar tutorial

Great tutorial Arctic! You definitely deserve DPs.

ArcticPosted: 08/26/2006 05:46 PMStatus ::


Rank ::
Visits::823
Nationality::Mexico
RE: Userbar tutorial

Thanx.

SickFreakPosted: 08/26/2006 06:00 PMStatus ::


Rank ::
Visits::488
Nationality::United States
RE: Userbar tutorial

Sticky this and give the man 5 dps.

Why don't you have a seat?
ArcticPosted: 08/26/2006 06:07 PMStatus ::


Rank ::
Visits::823
Nationality::Mexico
RE: Userbar tutorial

SickFreak Wrote:
Sticky this and give the man 5 dps.


Wow. I'm glad you found this useful.

Has anyone made any userbars? Feel free to show them here or request any.

BezouPosted: 08/29/2006 03:58 PMStatus ::


Rank ::
Visits::15969
Nationality::Canada
RE: Userbar tutorial

I used your tutorial and look what I made!


VampyrePosted: 08/29/2006 04:48 PMStatus ::


Rank ::
Visits::7887
Nationality::Heard Island and McDonald Islands
RE: Userbar tutorial

Nice tut.

ArcticPosted: 08/29/2006 04:57 PMStatus ::


Rank ::
Visits::823
Nationality::Mexico
RE: Userbar tutorial

Bezou Wrote:
I used your tutorial and look what I made!





Amazing Bezou! These are the kinda userbars I wanna see!

SickFreakPosted: 08/29/2006 05:30 PMStatus ::


Rank ::
Visits::488
Nationality::United States
RE: Userbar tutorial

Check out the bar in my sig.

Why don't you have a seat?
Tetra_VegaPosted: 08/29/2006 05:33 PMStatus ::


Rank ::
Visits::2422
Nationality::Canada
RE: Userbar tutorial

Bezou Wrote:
I used your tutorial and look what I made!





LOL!
Good old Bezou ^_^



Ka-Tra

14 YEARS! ^[2004-10 Komics Sig by Siklooted, tyvm]^ [2012-15 Komics *NEW 11/24/2015*] "Circling Vulture, Laughing Hyena" "All good things, in moderation..." "Mean what you say, and say what you mean. You never know, I could be a Djinn..." True story, it happened to a friend of a friend of mine... EVERYBODY!
ArcticPosted: 08/29/2006 05:34 PMStatus ::


Rank ::
Visits::823
Nationality::Mexico
RE: Userbar tutorial

I hope more people make userbars.

BezouPosted: 08/29/2006 06:50 PMStatus ::


Rank ::
Visits::15969
Nationality::Canada
RE: Userbar tutorial

I've made a bunch now. Too bad I can't use them on MKO.






ArcticPosted: 08/29/2006 06:59 PMStatus ::


Rank ::
Visits::823
Nationality::Mexico
RE: Userbar tutorial

LOL! I love the second one! You may notice I made a userbar showing how much I love cheez-its

''Get your own box''...BITCH!
Also made a Playstation 2 one as well.

PS2 is better than any other system!

I had more spare time on my hands so "What the heck!" I made a Macromedia Flash userbar too.
Flash 8 is the best currently

XonesPosted: 08/29/2006 07:21 PMStatus ::


Rank ::
Visits::346
Nationality::United States
RE: Userbar tutorial



I created that one in a place, well that is free, pretty basic.

KyobuPosted: 08/29/2006 07:27 PMStatus ::


Rank ::
Visits::984
Nationality::United Kingdom
RE: Userbar tutorial

Well done and everything but there are hundeds of user bar tuts already, a link to one would have been easier.

BezouPosted: 08/29/2006 07:34 PMStatus ::


Rank ::
Visits::15969
Nationality::Canada
RE: Userbar tutorial

I blurred the shine on mine. I like the effect better. For reference Gaussian Blur of 3 pixels.

ThePredator151Posted: 08/29/2006 09:39 PMStatus ::


Rank ::
Visits::1547
Nationality::United States
RE: Userbar tutorial

SickFreak Wrote:
Good tutorial. Are mine*gulp*crappy?


No, mine suck. I needed this.

I think Bombs- gave something like this before in one of the request or cut out thread. But I just got the right kind of program to make them the right way. This was excellent timing. Thank you alot.

The Ultimate Mortal Kombat Experience
- Lead Graphic Designer - Mortal Kombat Online -

:G-play :Story :F-Design :Cutout :Get Sig :Raiden :Fans [1] [2] :#LegendaryArts
BekimPosted: 08/31/2006 07:00 PMStatus ::


Rank ::
Visits::167
Nationality::Albania
RE: Userbar tutorial

wow this shits so old
lol u guys just learned to do this?

Photobucket - Video and Image Hosting
ArcticPosted: 08/31/2006 11:33 PMStatus ::


Rank ::
Visits::823
Nationality::Mexico
RE: Userbar tutorial

I knew about a year ago.

atticusPosted: 09/04/2006 07:09 PMStatus ::


Rank ::
Visits::2524
Nationality::England
RE: Userbar tutorial

I used ur tutorial and made this


Photobucket - Video and Image Hosting


Thanks artic.

Page of 5
    
© 1998-2018 Mortal Kombat Online. All rights reserved. Read our Privacy Policy.
Mortal Kombat, the dragon logo and all character names are trademarks and copyright of Warner Bros. Entertainment Inc.