Website design part 3

In third part of our tutorial of making a Website we will create a main logo. We will create logo by using freeware application Gimp2.

  Website design part 2

Open Gimp application.

We are going to create new document, where we are going to draw a website logo.

Click File and select New.

In Create a New Image window at Template field select 640x480 and click OK.

Press D to set black/white picture.

Now click Foreground & background colours.

Window for changing Foreground color shows up.

At HTML notation field enter 5f8cbb and click OK. This is the same color we have used for background color in previous lesson.

In document click Edit an select Fill with FG Colour, to fill the document with the colour we have defined earlier. 

Now we are going to write a text.

Select Text Tool.

Press D and then X, to set white color for the Foreground color.

Double-click on Text Tool to open dialog box for the text.

Select any font and any size font. I have chosen Arial Heavy and font size 25.

Click in the center of the document and write any text for the logo.

Now I will show you how to move the sign in the document.

Select Move Tool.

Now hold the sign with left mouse button and drag it into the center of the document.

Now we will duplicate the sign.

Click Layer above and select Duplicate Layer.

Click Layer again and now select Transform, Flip Vertically.

Select Move Tool and drag Vertically sign below the original one.

Select vertically sign.

Click Layer, Mask, Add Layer Mask...

In new window select White (full opacity) and click Add.

Double click on Blend Tool and select any Gradient (depends on what kind of blend you want). I chose FG to BG (RGB).

Now move with the cursor from one edge of the sign to the other. You will see the sign will become shaded. Try it until you are satisfied (you can hold Ctrl to get straight shade).

In Blade Tool Options window set Opacity to 50.

Click Image above and select Flatten Image.

Now select Rectangle Select Tool.

Select the sign with a little space below it (see picture).

Click Image above and select Crop to Selection.

Now click File and select Save as... Select folder you have created to save pictures and write the name for the sign. I wrote logo.jpg.

Click Save.

If you are prompted that the given filename cannot be used for saving click Take me to the Export dialog.

Under Select File Type select JPEG image and click Export.

In Export Image as JPEG set Quality to 85 and select Export.

The file is saved.

See also:

  Website design part 4