Skip to content

two-hats/Storyboard

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 

Repository files navigation

Storyboard.jsx

It can transform your artboards into a Storyboard!!

I realized how useful the artboard function is when I started to use illustrator for UI designs. I became able to integrate multiple screens into an AI file.

I had to make and manage multiple files for an application when I used Photoshop. It was horroble to modify many things. In illustrator, however, I can see all screens in a AI file and modify such a big change quicker than before.

I came up with this idea that transforms the artboards into a Storyboard. I thought it will be useful for UI designers. You will be able to know and review how your application works immediately.

I hope you will be satisfied with it.

Installation

Please put this script file into the script folder of illustrator.

For example in CC 2014.

Windows: C:\Program Files\Adobe\Adobe lllustratorCC2014\Presets\[language]\Scripts\
Mac OS: /Applications/Adobe lllustrator CC 2014/Presets/[language]/Scripts/

Usage

  1. Add specialized tags to the name of your artboards.
  2. Execute this script.

Your artboards will be arranged, and will be similar to a storyboard. Each screen comes with arrows indicating the next screens.

Before

Qucik-exporter main panel

After

Qucik-exporter option panel

The specialized tags are quite simple!! The tags consist of the sequence numbers combined hyphens together as below.

Qucik-exporter option panel

See more details

If you want to know more and can understand Japanese, please access to the URL below. I wrote an explanation about how to use it more detail in Japanese.

illustratorでUIデザイン:画面遷移図作成スクリプト

Licence

This software is released under the MIT License, see LICENSE.txt.

About

It can transform your artboards into a Storyboard.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published