Learn to create a Mars-themed web image using Illustrator in this step-by-step guide. Follow the instructions to import, align, and modify assets for your project, before beginning the tracing process.
Key Insights
- The tutorial uses Illustrator to create a Mars image complete with a rocket ship as a web image, using a width and height of 1500 by 1500 and an RGB color mode with a resolution of 300 ppi.
- Assets are imported from a client request folder, including a mountain range image for the Mars background, a sketch of a rocket ship, and color samples with a logo. The rocket sketch is then perfectly aligned halfway across the artboard.
- After renaming the layer as 'rocket sketch', a new layer is created for the traced rocket. The tracing process will begin on the right side before being duplicated on the left side, ensuring consistency and reducing the amount of tracing required.
Note: These materials offer prospective students a preview of how our classes are structured. Students enrolled in this course will receive access to the full set of materials, including video lectures, project-based assignments, and instructor feedback.
In this video, we'll be working on our next project. With our downloaded folder from the portal located in our Downloads folder, we'll right-click and select Extract All*.
From here, we can select a destination to extract the files. We'll click Browse and make sure we're in our project folder. We'll then select the folder and click Extract*. From here, we can now see that our Client Request folder, which was downloaded as a ZIP file, is now extracted within our Total Chorus folder.
Next, let's create a new file. We'll go into Illustrator and go to File > New*, and from here we're going to be creating a Mars image complete with a rocket ship. We'll be designing this image for web use. We'll go to our Web templates and give this file the name Mars Rocket*.
From here, let's change the width and height to 1500 × 1500, and we'll make sure that RGB Color is selected. For our screen, let's increase the resolution to 300 PPI (pixels per inch), and click Create*. First, let's start by saving our work. Go to File > Save As*, and save the file as Mars Rocket*.
Click Save*, then OK*. From here, we now want to set up our file so we can create our rocket and Mars scene. The first thing we'll want to do is import our first image.
We'll go to File > Place*, and from here, we'll go into our Client Request folder and view the three different assets provided by the client. First, we have a mountain range, which can be used for our Mars background. We also have a sketch of a rocket ship, and we have color samples, which include our logo.
Let's begin by placing our rocket sketch JPEG. We'll click Place*, and if we click on the artboard, we'll see that our rocket is added to our file. Next, let's align the rocket ship so that it is perfectly centered on the artboard.
To do this, we'll first click outside of the image and right-click, selecting Show Rulers*. From here, we'll create a guide. Click and drag over to approximately 750 pixels (half of 1500), and to fine-tune the guide’s position, select it. If you can’t move it, unlock guides. Then, enter 750 as the X value and hit ENTER. Now, align the rocket sketch to this center line.
Let's zoom in, and with the rocket sketch selected, we'll use the arrow keys to nudge it toward the center. While it doesn’t have to be perfect, we want to get as close as possible. Also, go to View and make sure that Snap to Pixel is turned off.
Click it if needed, and continue inching the rocket sketch using the arrow keys until it's centered. In this case, I’ll zoom out now that it's aligned. Next, let's rename this layer.
We'll double-click the layer name and retitle it Rocket Sketch*, then hit ENTER. Next, let's create a new layer to prepare for tracing. To do this, create a new layer, double-click it, type Traced Rocket*, and hit ENTER.
From here, we're going to trace only the right side of the rocket to start, and then duplicate it to the left side to complete the image. This approach ensures symmetry and reduces the amount of tracing required. To assist with this, we’ll use a center line.
So, within the Rocket Sketch layer, let’s use the Rectangle Tool and press D on the keyboard to reset to the default fill and stroke. Then, drag a narrow vertical rectangle from the top to the bottom of the rocket, centered on the guide. You can keep the stroke at 1 pixel, but I’ll increase it to 3 pixels for visibility and change the color from black to red. Additionally, select the stroke and make sure the alignment is set to Align Stroke to Center so that the stroke is positioned directly on the center guide.
Before locking the Rocket Sketch layer, let’s reduce its opacity so it’s easier to trace over. Hit V on the keyboard to select the artwork, then double-click Opacity*, type 50, and hit ENTER. Now, lock the Rocket Sketch layer, select the Traced Rocket layer, and hit CTRL+S to save your work.
In the next video, we’ll begin tracing our rocket.
See you there!