1. Design & Illustration
  2. CorelDRAW

How to Create a Vivid Video Game Background in CorelDRAW

Sponsored Content

This sponsored post features a product relevant to our readers while meeting our editorial guidelines for being objective and educational.

Final product image
What You'll Be Creating

Get your 30-day free trial now! You will be downloading a 30-day, fully functional trial version of CorelDRAW Graphics Suite X7. This trial is available in both 32-bit and 64-bit versions. The 64-bit version has been optimized for those with 64-bit versions of Microsoft Windows 8/8.1 or Windows 7.

Visual appearance is one of the main aspects of any game alongside the gameplay itself. In this tutorial we’ll take on the role of a video game designer and create our own repeating background, depicting a colorful orchard. We’ll work with some basic shapes and use Mesh Fill to enliven our objects in CorelDRAW® X7. Let’s get started!

1. Prepare the Base for the Orchard Background

Step 1

First of all, let’s create a New Document of 1280 x 768 px size.

create a New Document

Step 2

Find the Rectangle tool (F6) in the Tools panel and double-click it to create a rectangle centered on the page, the same size as your document. 

Select the Interactive Fill tool (G) and apply a linear gradient to the created shape. If you've only just started learning how to use CorelDRAW tools or forgot something, head to the Hints panel (Window > Dockers > Hints) to find some informative tips with illustrations and descriptions on using any tool.

use the rectangle tool and  Interactive Fill tool

Step 3

Let’s enliven the picture by creating a vivid summer sky. Select the upper square node of our gradient fill and apply a sky blue (R=0, G=204, B=255) color from the default color palette that is located in the right part of our workspace. You can see the color variations if you click and hold the palette square. 

Another way to apply the desired color to the nodes is to click on a square of the interactive fill and select the color directly in the pop-up Node color panel. Apply pure white color to the bottom node. You can click your right mouse button on a crossed square at the top of the Color Palette panel to switch the Outline color to none, and do the same for Fill color with the left mouse button.

 creating a vivid summer sky with interactive fill

Step 4

Double-click on the Rectangle tool (F6) again, press Shift-Page Up to place the created shape on top and squash it, forming a narrow stripe in the bottom part of the page. Fill the shape with bright green color, creating a grassy lawn. Convert the rectangle to Curves (Control-Q) and place several additional nodes on the upper side of the shape by double-clicking it with the Shape tool (F10). Move the points up and down, thus creating a zigzagged line.

add green square for the grass

Step 5

Copy and Paste (Control-C > Control-V) the shape and Mirror it horizontally by clicking the appropriate button in the upper control panel while the shape is selected. Fill the copy with darker green color by clicking the Fill bucket icon in the bottom of your workspace to reveal the Edit Fill options window.

add a darker grass shape

2. Create the Clouds With the Freehand Tool and Mesh Fill Tool

Step 1

Let’s start filling up the blank space by adding some clouds in the sky. Take the Freehand tool (F5) and draw a curved shape, resembling a woolly tufted cloud. Fill the shape with white color and apply the Mesh Fill tool (M) by clicking the cloud shape. Let’s get rid of the central node that appeared after turning the shape into a mesh. For this purpose, just double-click it, while the Mesh Fill tool (M) is still selected.

draw a cloud with freehand tool

Step 2

Let's form the mesh grid by adding new rows and columns to our cloud. We can do it in several ways. The first way to form a grid is to add some rows and columns in the Grid size panel from the Property Bar in the upper part of your workspace. 

use the Grid size panel to add rows and columns 1

Click the arrows, adding the desired quantity of mesh grid cells. 

use the Grid size panel to add rows and columns 2

This way rows and columns will be added to the object automatically, forming the grid. However, if we wish to edit the position of rows and columns, we'd better use another way of making our grid.

use the Grid size panel to add rows and columns 3

Let's try adding some rows and columns manually. Make sure you have the Mesh Fill tool (M) selected, move the cursor to the bottom left area of our cloud and double-click to create a crossing point, thus forming the first row and column of our grid. 

add some rows and columns manually

Another way to add rows and columns is to single click on a place, where you'd like to create a node and use the Add intersection function in the Property Bar above. 

use the Add intersection function in the Property Bar

Step 3

Now that we have enough rows and columns, let's find the Selection Mode drop-down menu in the upper control panel and switch to the Freehand selection marquee, while we are still armed with the Mesh Fill tool (M). Then select all the nodes inside the cloud, except the nodes that are going along the edge.

use the Freehand selection marquee to select inner nodes

Open the Color Docker (Window > Dockers > Color) and fill the selected nodes with light-blue color by setting the desired color in the palette and clicking the Fill button to apply new fill. 

add color to the cloud with the Color Docker

Then select a group of nodes right in the center of our cloud, making them a bit darker. 

add color to the cloud with the Color Docker 2

Now our cloud looks more three-dimensional as it has a blue overtone from the sky and bright ambient lighting on its edges.

Cloud made with the Mesh fill tool

Step 4

Let’s create a smaller cloud and fill it with bright purple and blue colors, using the same techniques with the Mesh Fill tool (M).

create smaller cloud with mesh fill

Step 5

Place the clouds in the upper part of our image and move to the sky background. Let’s make it more intricately adding some details. Add a mesh fill to the sky and create several additional rows and columns. Make one of the created mesh lines slightly curved by dragging its parts up and down with the Mesh Fill tool (M), forming a wave.

Add a mesh fill to the sky

Step 6

Select the node of the curved line and switch its fill color to white, making a nice feathered blur. Curve the lower mesh lines as well.

create a feather effect with white color

Now we have a bright, tranquil sky with gentle air strokes on it. Let’s move on to the next element of our composition!

make a bright tranquil sky

Duplicate (Control-D) the clouds several times and place the copies as shown in the screenshot below to make the composition more interesting. You can mirror the objects by selecting the Pick tool and then holding and dragging the edge of the cloud to the opposite side. Group the clouds by clicking Control-G keys combinations or by simply using the Group objects function in the Property Bar. 

make more clouds and group them

Using the Object Manager (Window > Dockers > Object Manager) is quite helpful if you want to keep you work clean and your objects nicely ordered. Right-click the object or group of objects in the Object Manager and use the Rename function from the folding menu or click twice on the object to give it a proper name, so that you can find it easily among other objects and groups.

rename the objects in the Object manager

3. Form an Apple Tree With the Mesh Fill Tool and Render an Orchard

Step 1

To start with, take the Ellipse tool (F7) and make an even circle by holding the Control key.  Make some circles of smaller sizes and place them around the initial circle. Fill the shapes with fresh green color and merge the circles into a single shape with the help of the Weld function in the control panel above (or in Object > Shaping > Weld), thus forming a tree crown.

form the tree base

Step 2

Take the Mesh Fill tool (M) and double click on the object to add an intersection of row and column, thus forming the mesh grid the same way as we did with the clouds. Select a group of nodes inside the shape with the Freehand selection marquee and fill it with lighter green color, making the tree crown more spherical and dimensional.

make a mesh grid on the tree crown

Step 3

Let’s add a tree trunk using the Rectangle tool (F6) and fill it with a red-brown wood color.

Lets add a tree trunk using the Rectangle tool

We need to place the trunk beneath the tree canopy. We can simply change the ordering of the objects by clicking and dragging them right in the Object Manager docker or using the Control-Page Down keys combination to move the object back for one position. You can find the Order options in the folding menu if you right-click the object in the Object Manager.

use the object manager to reorder the objects 1

Placing one object behind or in front of the other (Order > Behind and Order > In Front Of in the dropdown menu of Object Manager) is another handy option if you have a bunch of objects. Select the Behind function and you'll notice the cursor change into a thick black arrow. Click the object, which you want to stay on top (in our case it is the tree crown) and—voila!—the objects are reordered.

use the object manager to reorder the objects 2

Convert the trunk to Curves (Control-Q) and make the upper part of it narrower by moving the upper nodes closer to each other. Continue by applying the mesh fill to make the middle part of the tree trunk lighter, so that the shape looks more like a cylinder.

apply the mesh fill to the trunk

Step 4

Let's move on and make our tree more detailed by adding a simple shadow.

Copy and Paste (Control-C > Control-V > Control-V) the crown shape twice, moving the upper copy up and to the right a bit. Select both created copies and Clear mesh by clicking the crossed circle icon in the upper control panel, thus turning the shapes into flat silhouettes. Select the copies and apply the Back minus front Shaping function, thus cutting off the unneeded parts. 

Finally, select the created element, take the Transparency tool and lower the opacity of our object by moving the slider.

make the tree more detailed by adding a shadow

Step 5

Let’s decorate our tree with ripe juicy apples. Form an apple base from the even red circle and apply the mesh fill, making the bottom part of the apple darker and adding a bright yellowish highlight.

make a red apple base

Make our apple glossy and smooth by adding a tiny squashed ellipse on top for the highlight. Fill the highlight shape with white color, using the Color Docker and then just decrease its opacity by moving the Transparency slider while you have the Transparency tool selected.

make the apple glossy

Step 6

Let’s make our tree more vivid, by adding a gentle touch of sunlight to its crown. Create a copy of the crown and Clear mesh, turning it into a flat shape. Place an ellipse above and apply the Intersect Shaping function, while both shapes are selected. Fill the created shape with light-yellow color and use the Transparency tool to make the shape blend gently with the tree crown.

add shiny highlight to the tree

Step 7

Add an elliptical shadow under the tree and put a few fallen apples on the ground. Create a copy of our apple tree and make it much smaller to vary the composition. Feel free to change the position of apples, so that the trees don’t look like identical clones. Add some more copies, forming an orchard.

add more apple trees

4. Add Minor Details to the Composition

Step 1

Let’s deepen our background by adding more details. Double-click the Rectangle tool (F6) and place the shape between the sky and the lawn using the Control-Page Up keys for rearranging the objects. Squash the shape and Convert it to Curves (Control-Q). Fill the shape with greyish-blue color, making it darker than the sky. Create a nice smooth curve with the help of the Shape tool (F10), forming a distant silhouette of the mountain ridge.

add mountains in the background 1

Add more curved shapes, one beneath the other, making the farthest shapes lighter, creating a sense of the distance between the mountains.

add mountains in the background 1

Step 2

Add a group of dark-green elliptical spots with the Ellipse tool (F7) to speckle the ground, making it more detailed.

add spots to the ground

Step 3

Let’s form some simple branches on our trees. Start by making a rectangle, and rotate it to approximately 45 degrees by clicking it twice with the Pick tool until the selection edges switch to rotation arrows. Convert the shape to Curve (Control-Q) and use the Shape tool (F10) to bend the shape, making it slightly arched. Add branches to each tree in the same way, varying their length and position and making our image more dynamic.

add tree branches

Step 4

Make the trees more detailed and true-to-life by forming a fresh green foliage. Start by making an ellipse and then select its side nodes with the Shape tool (F10) and turn them into sharp angles with the help of the Cusp node function. Place the leaves onto the tree crown, next to the apples.

add leaves to the trees

Here how our background looks at this step. Almost completed!

video game background

Step 5

Since we are making a background for a video game, we should keep in mind that it will be moving along with the character or action running through it. Let’s make sure that the edges of the background match each other, making seamless repeats. 

For this purpose, select the upper left and right nodes of the first mountain shape. Find the Align nodes feature in the control panel above and apply Align Horizontal to the selected nodes, positioning them at the same height. Repeat the same action for all other nodes that are located at the edges of our image (the mountains and both green lawns).

align the nodes at the edges

Step 6

Finally, deselect everything and head to the upper control panel. Find the Duplicate distance window and change the values to 1280 px for the X axis and 0 px for Y. Now select our background and Duplicate (Control-D) it several times to see how the repeats look.

duplicate the background

Awesome! Our Vivid Video Game Background Is Finished!

Congratulations! You did a great job and created a detailed nature background, getting used to some handy CorelDRAW tools and features. Hope you’ve enjoyed working with mesh and creating fancy elements. Good luck with your art! 

Video Game Background
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.