Login Register

The Online Printer Help Centre

Creating Artwork Online

Using our online artwork editor

Contents
  1. Overview of the editor interface
  2. Moving objects around the page
  3. Using the Quick Rotate Corner Toggle
  4. Scaling and resizing objects
  5. Deleting an object
  6. Editing an object's properties
  7. Properties of a rectangle
  8. Properties of a text object
  9. Properties of an image object
  10. Using the Background feature of templates
  11. Checking and previewing your artwork
  12. Creating a Rectangle object
  13. Creating an Image object
  14. Creating a Text object

An overview of the editor interface

The editor toolbar contains nine key features:

1
Text Tool
Add text to your page. Once added you can edit the text and change the font, colour, style, alignment and much more.
2
Image Tool
Add an image to your page. Upload from your computer or choose from your Facebook, Flickr, Picasa or Dropbox account.
3
Template Instructions
Every template comes with unique instructions. View these before starting your design as they may give helpful tips on how the template was intended to be used.
4
Rectangle Tool
Add a rectangle object to your page. Change the colour and resize it, and arrange it in front of or behind other page elements.
5
Undo / Redo
Use these controls to undo or redo your previous change.
6
Zoom Controls
Zoom out, zoom in, or fit the page to the space available for optimum editing.
7
Preview Button
Generate a precise preview of your page before clicking "I'm Finished". Double check everything — once we go to print there's no undo.
8
Full Screen Mode
Toggle the editor into full screen mode. Helpful when detailed editing is required.
9
Finished Button
Click "I'm Finished" when done. Your artwork will be saved against the artwork variation and you'll be taken back to the Prepare Your Artwork page.

Moving objects around the page

When you hover over an object, you will see the word "edit" appear in the centre, along with three corner controls:

  • Top left — Delete button
  • Top right — Rotate control
  • Bottom right — Resize control

When your mouse cursor is over the object but not over one of the three corner controls, you can click and drag the object to move it. We suggest zooming in to ensure accurate alignment.

Using the Quick Rotate Corner Toggle

Click and hold the rotate button on the top-right of the object (it appears when you hover). Drag your mouse while still holding the click and the object will rotate in the direction you drag.

You can also rotate accurately by entering a rotation angle in the edit panel for the object.

Scaling and resizing objects

Hover over the object you wish to scale or resize. A scale/resize button will appear in the bottom-right corner. Click and hold this button and drag your mouse cursor. The object will scale with your mouse. Release when you are happy with the size.

Deleting an object

Hover over the object you wish to delete. A delete button will appear in the top-left corner of the object. Click it to delete the object.

Editing an object's properties

When you hover your mouse cursor over an object, an "edit" button will appear in the centre. Click this to bring up the properties panel for that object.

Properties of a rectangle

Scaling
When checked, the object will maintain its aspect ratio when using the scale corner tool.
Align
These alignment shortcuts will align your object in relation to your document artboard.
Rotation Angle
Use the slider to adjust the rotation of this object. For more accuracy, type in the angle you desire.
Stroke Weight
This slider controls the thickness of the stroke on this rectangle. For more accuracy, type in the pt weight you desire.
Opacity
This slider controls the opacity of the object. Use the slider to make adjustments or type in a desired percentage.
Arrange
Use these buttons to bring your object forward or send it backward relative to other page elements.
Fill / Stroke
Use these colour palettes to select the fill and stroke colour. You may enter an RGB value (e.g. R=212 G=122 B=255), a CMYK value (e.g. C=96 M=55 Y=57 K=19), or an HTML colour (e.g. #FF0000).

Properties of a text object

A text object can contain multiple fonts and formatting. Highlight the desired text you wish to change before applying formatting.

Font
Choose a font for your text. The font style options for the selected font family are in the lower drop-down.
Size
Increase or decrease your font size using the slider. For more accuracy, type a font size in pt in the input field.
Line Spacing
Increase or decrease your font's line spacing using the slider. For more accuracy, type a value in pt.
Formatting
Set alignment (left, center, right) and apply underline, superscript or subscript. Click "Open advanced options" for Letter Spacing, Vertical Scale, Horizontal Scale and Rotation Angle.
Align
Use the alignment toggles to align your text object relative to the document artboard.
Arrange
Bring your text object forward or send it backward relative to other page elements.
Text Colour
Use the colour palettes to select the colour for your text. Accepts RGB, CMYK, or HTML hex values.

Properties of an image object

Scaling
When checked, the object will maintain its aspect ratio when using the scale corner tool.
Frame Rotation
Use the slider to adjust the rotation of the frame for this image object.
Content Rotation
Rotate the image within its frame independently of the frame itself.
Advanced Options
Click "Open advanced options" to reveal: Fill/Stroke colours, Stroke Weight, Flip (vertical or horizontal axis), and Opacity.
Align
Align the image object relative to the document artboard.
Arrange
Bring the image forward or send it backward relative to other page elements.
Fit
Choose to fit the frame to match the image content, or fit the image to fill the size of the frame.

Using the Background feature of templates

Some templates use a background feature to control the background of the design. In this case, an additional Background button will appear in the menu. Click it to either edit the image or change the colour of the background, depending on how the template was set up.

Checking and previewing your artwork

It is very important to check over your artwork when you are finished designing it. Once we go to print there is no "undo".

Use the Preview button to generate a trustworthy PDF-style preview of your page. On this preview, the magenta trim line will still show so you can see where your artwork will be trimmed. This will not print.

Preview one page at a time. When you are satisfied, click "I'm Finished", save your artwork, and you will be taken back to the artwork preparation page ready to add artwork to other printing variations or continue through the checkout.

Creating a Rectangle object

Click the "Add Rectangle" button on the top menu of the editor. A new rectangle object will instantly appear in the top-left corner and the edit panel will open. You can now adjust the properties and re-position it on your artboard.

Creating an Image object

Click the "Add Image" button on the top menu. A popup will appear with a "Choose File" button. Alternatively, sign into your Facebook, Flickr, Picasa or Dropbox account using the tabs and choose images from there. Once you have chosen an image you will be able to resize and re-crop the image object.

Creating a Text object

Click the "Add Text" button on the top menu. A new text box will appear in the top-left corner and the text properties panel will automatically open. From here you can change the properties of your text and its container, and re-write the text as you wish.

Was this article helpful?