AI Design Rules
Assuming you have your Illustrator design ready, Export Kit makes the natural export process quick and painless saving you lots of time and budget with your digital projects.
IMPORTANT: These are the general AI Design Rules to follow, we also recommend you read PSD Design Rules for a general understanding of optimizing your design for Export Kit.
IMPORTANT: You must use RGB Color Mode
with your design - learn more.
Before You Begin
There are general design rules to follow when optimizing your design for an export. Here are a few basic rules:
No Empty Layers
You cannot have empty layers in Export Kit, otherwise the export will stop on that layer.
WYSIWYG
What You See Is What You Get! If you zoom in to 100%, what you see in your AI – is what you will see in the output. You should always build your default export first (what you expect to see), then customize your final output.
Export Design
RECOMMENDED: Your design should fit the size of the user target screen, with additional layouts stacked on-top of another.
Preview Print Design
AVOID: If your design has all layouts side-by-side
in a wide design format - your output will render all layouts using the size and margins from your design.
Rule 1: Know Your AI Layers
Illustrator is a vector based graphic engine which assumes you are creating a single graphic. The Layer structure is slightly different in Illustrator giving access to only Layer Folders and PageItems.
LAYER FOLDERS: Layers/Folders in AI have a dark gray
background.
PAGEITEMS / GROUPS: PageItems/GroupItems have a light gray
background.
Rule 2: Layers *are* Folders
In Illustrator a Layer is treated as a folder is within our Photoshop version. We strongly recommend
you use many Layers with your design to ensure an optimal export.
Use Actual Layers
You must use actual Layer Folders in your design for an optimal output.
Optimize your Layer Folders
DO NOT
create 10+ PageItems (vectors, images, text, etc.) on a single Layer Folder – this will export as-is and produce a container with 10+ elements in the output. This is acceptable for testing, but we strongly recommend you have multiple Layers for organization and production exports.
PageItems before Child Layers
If you have a Layer with multiple PageItems and Child Layers, your PageItems will render first in the output regardless of the Layer nesting. We recommend you organize your PageItems in respective Layers.
Wrap Single Images in a Folder
When you have a single image, its best to wrap it in a folder container with the same name as the image
.
Rule 3: ${skip} all Issues
Illustrator is currently in Alpha so we recommend you use ${skip} tag with problematic layers. This will ensure your Output works first, then you can debug the issue.
NOTE: We do not support all layer types and styles in Illustrator - its still in Alpha
.
Clear all Guides
We have not added all modules for AI Layers, clear your guides using Guide Kit before you export – learn more.
Rule 4: Disable Safe Text
We have an option for Safe Text, DISABLE THIS OPTION
. This is designed for Photoshop due to how text elements are rendered. Illustrator does not require this as it already adds a buffer to text items.