Creates all possible variations for a given set of layers. You can provide a single image, specify some dimensions and run this script to automatically export a list of graphic files.
Requirements: You need Ruby and ImageMagick running on your machine. pngQuant is already include in the project.
To download and test the script, execute these lines of code in your shell:
git clone git@github.com:ubilabs/icons_generator.git
cd icons_generator
ruby generate.rb
To add more variations, simply add a new row to the source.png image document and update the SOURCE titles:
LAYERS = [
%w(normal active),
%w(default site offer coupon my),
%w(cluster shopping eat explore)
]
To modify the icon size, change the image grid dimensions and update the following settings:
WIDTH = 31
HEIGHT = 35
Source input image:
Generated icons:
List of exported files:
- normal_default_cluster
- active_default_cluster
- normal_site_cluster
- active_site_cluster
- normal_offer_cluster
- active_offer_cluster
- normal_coupon_cluster
- active_coupon_cluster
- normal_my_cluster
- active_my_cluster
- normal_default_shopping
- active_default_shopping
- normal_site_shopping
- active_site_shopping
- normal_offer_shopping
- active_offer_shopping
- normal_coupon_shopping
- active_coupon_shopping
- normal_my_shopping
- active_my_shopping
- normal_default_eat
- active_default_eat
- normal_site_eat
- active_site_eat
- normal_offer_eat
- active_offer_eat
- normal_coupon_eat
- active_coupon_eat
- normal_my_eat
- active_my_eat
- normal_default_explore
- active_default_explore
- normal_site_explore
- active_site_explore
- normal_offer_explore
- active_offer_explore
- normal_coupon_explore
- active_coupon_explore
- normal_my_explore
- active_my_explore
While running the script, you see the following output:
Croping 11 images: 31x35
...........
Composing 40 images:
........................................
Quantifying PNG-8 images:
........................................
Creating index file:
- output/_index.png
DONE! 40 images generated.