Loading...

Export Process

The Export Process, although different for each Environment, is similar in its architecture. There are two main process methods which occur depending on if you are exporting a Photoshop document or layer.

Layer Process

This process involves translating each Photoshop layer into its respective code environment. Each layer name will validate to ensure it uses common coding practices, then images related to layers will save and the layer will process depending on its environment.

Layer Names

Export Kit will remove all characters which are not required by the output environment. In most code environments and servers, many character ranges are not accepted, and can cause unwanted display and code errors in the output. Export Kit ensures your output will works by validating your layer names.

Learn more about Layer Naming Rules.

Images

Each layer will process the related image and render as the selected image type if available. The layer element will be captured and rasterized, then saved to the Export Folder.

Learn more about Images.

Layer Eelements

Layers are processed to check for native Photoshop layer types such as shapes, smart objects and folders. Each layer type will render differently depending on the selected output environment.

Learn more about Layer Support.

Layer Effects

Layers are then rendered as the selected environment output element. There are default reflections for rendering Photoshop layers in each environment
- eg. an Image is an Image
But also specific requirements in some environments
- eg. HTML has poor gradient support for Text effects.

All environments process elements and effects differently!
Learn more about Effects and Styles.

Layer Tags

Custom layer object, relevant to the selected environment are processed using our native Layer Tags to provide additional functionality to Photoshop layer elements. Layer Tags require a specific naming convention of layers in your Photoshop document.

Layer Tag Syntax: ${name|type:args}

Sample: ${ form |post :http://host/form.php }
Learn more about Layer Tags.

Document Process

This process translates your complete PSD into your selected environment including the Layer Process (mentioned above) and additional processing to ensure your output is pixel-perfect.

Document Meta Information

All Meta Information is collected from your PSD document to be used in the output; mainly as comments but some environments provide additional usage for Meta Info. Meta info is used by Photoshop to describe the contents of the PSD file, including information such as Title, Author, Keywords, Description and more.

Environment Output

Export Kit customizes the output for each individual environment selected providing you with a pixel-perfect translation of your PSD document. Each environment has variations on how and where it can render, along with what objects the individual environment supports. Export Kit takes the worry out of this process and make it automatic.

EXAMPLE: Some projects such as HTML, can be viewed directly by clicking the output file, and the contents will be displayed in the browser. Others, such as Android UI require you to load the output project into the respective Eclipse based IDE, eg. Android Studio and compile the project.
Learn more about Output Environments.
Learn more about Output Customization.

Process Each Layer

This is a layer-by-layer action, running the Layer Process on each element in your document. Refer to Layer Process above.

Custom Environment Objects

This will create custom Class objects for the selected environment. Different environments have rules to process both display and data for elements. Some environments require different settings for objects to be displayed and are mapped in this process.

EXAMPLE: A Text layer in one environment may allow for a simple assignment, eg. text = "sample text";, while another may require a strict assignment, eg. text = String("sample text");.
Learn more about Export Optimization.

Export Files

Your document will render and save as an environment-ready project into your Export Folder. All required assets and code files are saved to the respective output folder and is ready for use once complete.

LOGIN NOW: You need to login so your progress is tracked with Online Training - click here.

Products For Web Professionals


web_templates_2

Web-Templates 2.0

webmaster_pack

Webmaster

webmaster_pack

Webmaster (6 Months)

Need a custom solution?

Try our Shop!

Using the Plugin

Layer Support

Layer Tags

How To Guides

Optimization Tips

Help Us Improve


We aim to keep our content relevant with useful information, examples, samples and links. Tell us what you think!

I found the content:

Helpful
Confusing
Outdated
Broken Links
Bad Spelling
Too Short
Too Long

This page needs:

Nothing
Better Content
Links
Examples
Videos

Free Download


Dropdown +Rollover Menus

Professional dropdown menus with full CSS rollover support.

Start Your 14 Day Free Trial

New users get instant access to the 14 Day Free Trial with all features enabled, and Free Online Training. We guarantee your first conversion will 100% work - we work with you to ensure this, contact us or check our FAQs for assistance.

Connect With Us

Top
Lightning Storm version v17.0216.05 releasedLearn More