Common mistakes when creating design templates

Check out these common mistakes (and avoid them) when creating your designs.

Do not change the artboard size

Artboards define the area that is used for creating designs. To prevent misalignment of the design, make sure not to change the original artboard size.

Make sure to use "Save as" when exporting from Illustrator. Do not use "Export as" since it may change the artboard size.

The scale of the pattern should be the actual sizes of the real product

The scale tool sizes an object and maintains or changes horizontal and vertical proportions. When using this tool, make sure that the pattern sizes are correct. 

Do not use clipping masks to combine elements

A clipping mask is an object that masks other artworks so that only areas that lie within the shape are visible. Our dashboard does not support clipping mask. Make sure to use the path finder function instead.

Make sure there isn’t a transparency element in the layers

Transparency, especially in Adobe Illustrator, can be added to artwork without you wholly realizing it, for example, when you lower the opacity of objects so that underlying artwork becomes visible. Try and remove any transparency before uploading it to the Brikl platform as it could affect the design.

When creating a gradient, a base color must always be present

A gradient is a graduated blend of two or more colors or tints of the same color. When creating a gradient, remember:

  • The base color must be white so that it won't affect the gradient.
  • Name the base color “VIEWZONE” if the gradient is the only element that is customizable.

When it comes to your layer name...

Do not change the name of <Path> or <Compound path>. 

Do not group elements

If you select objects in different layers and then group them, you'll see that objects are grouped in the layer of the topmost selected object. While designing, you can group elements, but be sure you ungroup all elements before exporting your design as an SVG for use in the Brikl platform.

Check your spelling

Make sure not to misspell "COLORZONE-1". For example, "COLOURZONE-1" will not be recognized by the platform and therefore will not work.

Does your colorzone sublayer have another colorzone underneath?

Sublayers are the objects created in a layer. When you create a new file, there is always a default layer - just make sure the sublayer does not have another colorzone underneath. 

Are all your elements in the VIEWZONE?

If all elements are in VIEWZONE, you can combine them in one layer. 


Embed images that you include in the VIEWZONE

Embedding an image into your document means that the image file itself is saved directly within the Illustrator file so that it doesn't need to exist anywhere else on your hard drive.

Ready to export?

When you export, make sure to fix the artboard and select "Preserve". 

The 'Object Preview' must have a COLORZONE...

... and have all the colors filled too.

When there's only one VIEWZONE available...

...make sure to include at least one COLORZONE (it can be empty) and deactivate it later on in the dashboard.

I am opening a base template in RGB mode, changing the color mode to CMYK and saving as another file. When re-opening, why does it still show RGB.

Here are the steps to fix this issue.

  • First, change the color mode to CMYK mode.
  • When you save using "save as", mark the image location as "preserve".
  • Check if all the changes are saved correctly by closing the Illustrator file and opening it again. It will now open in CMYK mode.

Separate the COLORZONE from the VIEWZONE

Make sure the COLORZONE and the VIEWZONE are in their own layers. The screenshots below show the before and after, so you know what to look for. 

Each color must be separated in into its own COLORZONE layer

When grouping elements, use "compound path" instead of "group"

And don't use groups within groups. 

When placing images, please remember to always embed them. The code name will then change to Image, as shown above (1)