This Cyber Monday Envato Tuts+ courses will be reduced to just $3. Don't miss out.
The period between the end of the 19th century and World War II is considered the golden age of the ocean liner. We’ll be starting with a basic sketch of an ocean liner I drew up. Of course I encourage everybody to create their own sketch. I’m not really that great at drawing, so if you really want to have a stunningly looking ocean liner, please create it yourself! If you do decide to use your own drawing, you might want to alter or skip a few of the steps. In this tutorial we’re going to create a vintage ocean liner poster. The main tools you'll get to know in this tutorial are the Pathfinder and the Transform Effect.
Open up a new Illustrator document. In this tutorial I’ll be using millimeters for measurements, so I would recommend you to select millimeters as units. Import the sketch in to Illustrator (File > Place).
Double click Layer 1 in the layer menu and place a tag on Dim images to 50% and also on lock. Click Ok.
Create a new layer on top (Command + L). We’ll be using this layer to trace the sketch.
In the color menu select the transparent fill and a red stroke. Draw a rectangle on top of the pencil drawing as shown in the picture. Make sure that the rectangle is slightly bigger than L-shape in the ship.
Using the Direct Selection Tool (A) select the top right anchor point of the rectangle and delete it, leaving an L-shape.
Now comes the tricky part. Using the Pen Tool trace the lines of the ship. You can forget about the chimneys for now. Draw the lines a bit longer than they are one the pencil drawing. Extend them a little. Don’t worry if it looks a bit strange at this point. Try holding Shift while drawing the horizontal and vertical lines.
Hide Layer 1 for the moment. Create a rectangle on top of the lines, make sure to cover the whole ship. Choose a nice colour for the rectangle and give it a black stroke. Now send the rectangle to the back (Object > Arrange > Send to Back) (You can also use Shift+Command+[ )
Now we’re going to use one of the greatest Illustrator tools, The Pathfinder. (Can’t find it? Window > Pathfinder). Select all objects (Command+A). In the Pathfinder menu click the Divide button. This will cut the rectangle into pieces, using the previously made lines as cuts.
Now for some reason Illustrator has grouped all the cut objects together. Obviously we don’t want this, so we need to have them ungrouped (Object > Ungroup). Using the Selection Tool (V) select the unnecessary outer piece and delete it. Now it’s starting to look like a ship again.
Now we have to get rid of those ugly lines. This is where the Pathfinder comes in again. We’ll start of with the rim of the ship. Select the entire rim at port-side of the ship. Pathfinder has probably cut it into pieces, so make sure you select all the pieces that belong together. Choose a nice color and click the Merge button. By doing this Pathfinder effectively glues together the selected parts.
Again using Pathfinder merge together the parts of the ship that belong together. Have a look at the image to see which individual parts you want to end up with. I decided to merge the entire front of the bridge together, because that’s what I’m like.
Now we’re ready to create the chimneys. Switch Layer 1 back on. Create a new layer between Layer 1 and Layer 2. If you like you can give the new layer a name. Since we’re going to create the chimneys, ‘chimneys’ might actually be a good name for the layer. While at it, we might as well name the other two layers now. Here’s how I named the three layers: Ship, Chimneys, Sketch.
Hide the Ship layer. Now finally, we really are ready to create the chimneys. We’ll be using the same technique as I described before. Using the Pen Tool trace the lines of the first chimney. Again, don’t forget to extend the lines a little. Create a rectangle underneath the lines you’ve just created. Select all objects and click the Divide button in the Pathfinder menu. Now ungroup the objects and delete the unnecessary part. Have a look at the image to see what you want to end up with.
Now we’re going to use some magic to duplicate the chimney. Select the bottom part and the top part of the chimney and group them together (Object > Group). We’re going to use the Transform Effect (Effect > Distort & Transform > Transform). Put in the numbers as shown in the image and click OK. If all goes well, you’ll be looking at three chimneys right now!
We don’t need the Sketch layer anymore, so you can delete that one. Create a new top layer called Windows. Now zoom in on the 2nd deck of the ship. Create a rectangle with these dimensions: 1.2 x 3.2 mm. Don’t forget to give it a nice color.
We’re going to shear the rectangle at 35 degrees. (Object > Transform > Shear). Put in 35 and select Vertical. Now that’s a nice window!
One window isn’t quite enough, we’re going to need a bunch more. We’ll be using the Transform Effect again. (Effect > Distort & Transform > Transform). Put in the numbers as shown in the image. If you wonder how I came up with these numbers, I’m not that great a mathematician, I got these numbers by trail and error.
For the 3rd deck we’re going to create a new rectangle with these dimensions: 0.75 x 3.75 mm. Give it a 40 degrees vertical shear. Again we’ll be using the Transform Effect. Put in the numbers as shown in the image.
Now for the other windows it’s going to be a little trickier. Hide all layers and create a new top layer. Give it a nice name.
We’re going to use this layer to create round windows on the bow of the ship. Create an ellipse with these dimension: 1.5 x 1.5 mm. You don’t have worry about the position.
On the ellipse we’ll be using the Transform Effect again. Put in the numbers as shown in the image. Now that creates a nice dotted line!
Because it’s actually still one dot with a duplicating effect, we need to find a way to turn them into real dots. You can do this by using the function Expand Appearance (Object > Expand Appearance)
At the moment you might be wondering ‘what are these dots for?’. Don’t worry, in a few steps it will all be clear! What we’re going to do now is turn this line of dots into an Art Brush. Find the Brushes menu (Window > Brushes). And click the New Brush button. Select New Art Brush.
Think up a nice name for the brush. Make sure the direction is -> and click Ok.
Now you can delete the dots and give your new brush a try.
Now it’s time to get back to our ocean liner. Delete the new layer you made and make the other layers visible again. We’ll be working on the Windows Layer again. Using your new brush create three lines on your ocean liner following the shape and curve of the ship. Now that makes some great perspective!
Don’t give up now, you are nearly there! We’re going to create the life boats now. Have a look at the image. At this stage I hope you’ll be able to figure out how it's made. If you don’t get it yet, here’s a hint: I used two slightly tilted ellipses and the Pathfinder. Make sure to put the lifeboat on the Ship Layer. It should also be in the back (Object > Arrange > Send to Back).
Now we’re going to use the Transform Effect again, you’ll know where to find it.
That’s it! You’ve made yourself a great ocean liner! Now all it needs is a suiting background. Create a new Layer called Background. Make sure that it’s the bottom layer. Create two rectangles, one to create the water and the other one to create the sky. Choose some nice colors. There we go!
If you like, you can add some clouds and steam using the Pencil Tool. Now it’s time to look at the overall picture and perhaps change some of the colors. If you’d like to change the color of the window strokes don’t forget to use Expand Appearance. Also a lot of these ocean liners used to have masts, so feel free to create one!
There you go, you’re done! But wait… something’s missing. We still need that vintage look! But don’t worry, this is probably the easiest part. We need a scan of an old piece of paper, or if you’re feeling lazy do a search on the web. Create a new top layer and name it Texture. Import the picture of the old paper (File > Place).
Select the old paper. Set it’s opacity to 60% and select the Multiply mode. That’s it. A vintage ocean liner in only 29 steps.
The final image is shown below. Experiment with the colors, put in some gradients, change the background. Make something cool out of it!