Craft thy own Japanese 19th century fireworks Pop colors and zwims and zamms
Explode
Yokohama city's public library hall released dematerialized versions of old catalogues of firework (www.city.yokohama.lg.jp/kyoiku/library/digitalarchive/hirayama.html). We could not resist the urge of detouring them to offer everyone the beautiful experience of Japanese fireworkks, with a little help from the team that conceived the generator of medieval Bayeux tapestries.
This brand new Historic Tale Construction Kit allows you to
- Drag, drop, scale, rotate any item from the Bayeux image bank
- Do the same with text with different fonts and colors
- Bring elements to the front/back of the scene (this is life changing)
- Work on several images (pages) at once
- Export those pages as PNG or as GIF
- Save a working copy of your tapestry to your disk, to finish it later
- Use brushes to quickly add crowds, birds, or battlefield
- Use keyboard shortcuts for almost all of the above
- Download a standalone version to use it anywhere without any server
This kit is based on the Bayeux Tapestry, a 70-meters long piece of art telling the story of the Battle of Hastings. However, every Bayeux-related pictures, fonts and settings are stored in a single folder, that can be easily swapped with, say, Japanese Prints, Cave Painting, whatever your heart desires.
Feel free to fork this project and create your own Historic Tale Construction Kit with anything that comes to mind :)
To do so, put your content to the content
folder and index it in the config.js file.
This kit is written mostly using RaphaelJS and AngularJS, but it also uses a bunch of really cool libraries, such as angular-hotkeys, canvg, FileSaver.js, Raphael.FreeTransform, Raphael.json, gifshot, Canvas-to-Blob. They helped us build an app that works everywhere, client-side without the need for any back-end. Huge thanks to them.
If you want to work on the Historic Tale Construction Kit by yourself, you can use the vagrant box by launching vagrant up
. Attention, you will need to have admin rights if you want to run it on windows. Or set up a development environnement.
If you do not want to use vagrant, you will need to install the following globally
sudo apt-get install nodejs
sudo npm install npm -g
sudo npm install -g bower
sudo npm install -g grunt-cli
Then either way go to the htck
folder and install dependencies using
npm install
bower install
You can then run a development server using the command grunt serve
If you experienced a bug, we're sorry! If you can fix it, we gladly accept pull requests. If you can't, you can still open an issue here on GitHub and we will try to address it shortly.
This project is MIT-licensed and any open source contribution is welcome!