1. To start with you need to open paint. Go to Start>All Programs>Accessories>Paint. Your screen should look something like this:

2. Set the sizes for your skin. Go to the top menu bar and then Image>Attributes. You will then get a window up in the middle of the page as shown below

3. Select Pixels in the units box. You'll need to input all the sizes for your skin. You can only do this individually, you will have to repeat this step for each module. The dimensions for each module are below. Once you have set the first dimensions (I usually start with the main background) you can begin work on your skin.

4. Decide what you want your skin to look like and go for it. This requires a little basic knowledge of Paint, but it's a pretty basic program.

5. Save your image in a JPG format in order for it to work on the internet. You need to go to File>Save As. There should be two options available. One is for the file name, the other for the file format. In the file format box, you need to select JPG and the click save. Now you can go to File>New and can make your navigation background and so on. Repeat steps 2-5 until all seven graphics are complete.

6. Publish your skin on Bebo. Login to Bebo, go onto your profile and select Change Skin>Roll Your Own>Add A New Skin. Give your skin a name and some tags and click Save. You will then be taken back to the Roll Your Own page. You now need to scroll down until you reach a grey table.

7. Once you can see your skin name (the one I am using to demonstrate is just called tutorial), click on Upload Graphics. Upload all your graphics and click back.

8. Click Edit Stylesheet on the Roll Your Own page. The next step is to enter all the text colours for your skin and the padding (how far up, down, left or right an image is). All of this is done through HTML colours (code for different colours and shadings). If you click on pick, you can choose different colours by colour and the code will be entered for you.

9. Click Save and then Preview. You can repeat 8. and make any changes you'd like at this point.

This tutorial is for making a skin using Adobe Fireworks, another great design program. Buy it here: Adobe Fireworks

New Skin

• Open Fireworks
• Click "Fireworks File" (See image below for details)

"New" box appears and can be filled in

You can change the Width and Height depending on what you want to draw first.
Were starting with the Navigation Bar(760x40)

Check this cool table for pixel values

Editing

Click the Brush icon to start drawing

Once you have selected the brush tool, if you look at the bottom you wil find the properties where you can change the texture of your brush.

Get drawing and be creative!!

Just leave some space so you can see the navigation tabs at the top.

Saving

When your finally done all you have to do is save it!

Bebo has a file size limit on the images so you can compress the file this way

• Click "File"
• Click "Image Preview..."

A new box appears

1: File Type

• JPEG
  Mostly use "JPEG" as this allows for more colours and smoothness
• GIF
  This has fewer colours but allows for Animation.

2: Quality of the image (how smooth it looks)

• This is how you can fit your file size under the maximum limit.
  Move the quality bar up or down so that the KB at the top is under the allowed limit.(E.g. 10KB for Navigation Bar)

Check out another cool table!

Once the file size is ok click "Export..." at the bottom.

A new box appears.
Depending on what you were making you must save it with it's right name.

E.g. So if it was the top Navigation Bar save it as "nav_bg.jpg"

I'd save all your skin files in the save folder. Don't want any to go missing now do we?

So just stick to the requirements of the table your graphic

Uploading

Once you have all your files ready you can Tag them and Upload them

Click Here!

or

• Click "Change skins" on you profile
• Then click "roll your own" in the next tab
• Click "add new skin"
• give it a name and a few tags
• then browse for all your skin files
• Click "Upload"!!! happy days

The Others

For a detailed spec on the different parts of the skin Click Here!

Each part is different so read up on there requirements

Edit Stylesheet

Making a skin with that huge picture above profile pics?

Make your "main_bg" the big picture that you want

Once you've uploaded your skin click "Edit Stylesheet"
and in "Main Section" increase the "Padding Top" to around 375.
Just play around with it.

This makes the picture rise up above your profile picture

Okay, here's the deal. This is a step-by-step guide to making bebo skins on your own! These instructions are using Adobe Photoshop, the best (in my opinion) software for creating a skin for bebo. Once you've submitted your skins to bebo.com, make sure to upload them to the bebo skinz site bebostation.com!

New Skin

• Open Photoshop
• Click "File"
• Click "New"

"New" box appears and can be filled in

You can change the Width and Height depending on what you want to draw first.
Were starting with the Navigation Bar(760x40)

Check this cool table for pixel values

Editing

Click the Brush icon to start drawing

Click the down arrow beside the top brush icon.
You can change the brush and its size.

Get drawing and be creative!!

Just leave some space so you can see the navigation tabs at the top.

Saving

When you're finally done all you have to do is save it!

Bebo has a file size limit on the images so you can compress the file this way

• Click "File"
• Click "Save for Web"

A new box appears

1: File Type

• JPEG
  Mostly use "JPEG" as this allows for more colours and smoothness
• GIF
  This has fewer colours but allows for Animation.

2: Quality of the image(how smooth it looks)

• This is how you can fit your file size under the maximum limit.
  Move the quality bar up or down so that the KB on the bottom
  left hand side is under the allowed limit.(E.g. 10KB for Navigation Bar)

Check out another cool table!

Once the file size is ok click "Save".

A new box appears.
Depending on what you were making you must save it with it's right name.

E.g. So if it was the top Navigation Bar save it as "nav_bg.jpg"

I'd save all your skin files in the save folder. Don't want any to go missing!!

So just stick to the requirements of the table your graphic

Uploading

Once you have all your files ready you can upload them

Click Here!

or

• Click "Change skins" on you profile
• Then click "roll your own" in the next tab
• Click "add new skin"
• give it a name and a few tags
• then browse for all your skin files
• Click "Upload"!!! happy days :)

The Others

For a detailed spec on the different parts of the skin Click Here!

Each part is different so read up on there requirements :)

Edit Stylesheet

Making a skin with that huge picture above profile pics?

Make your "main_bg" the big picture that you want

Once you've uploaded your skin click "Edit Stylesheet"
and in "Main Section" increase the "Padding Top" to around 375.
Just play around with it.

This makes the picture rise up above your profile picture

This tutorial is compliments of Bebo.com!