triangles
v1.0.2
Published
Triangle background generator
Downloads
7
Readme
Delaunay Triangulation pattern maker
This project allows you to create beautiful high quality images featuring a nice pattern created from Delaunay triangulation and applying a flat surface shader. These images could be used for:
- Wallpapers
- Blog post headers
- Magazines
- Posters
- And more
The tool provides export to PNG and SVG formats. With SVG format you could create an image of virtually any size, even as big as a billboard. Go crazy with it!
Show me some results!
Here are a few of most obvious uses for the tool:
And I made a video on Youtube of the tool in action, creating 11 wallpapers in under 7 minutes:
You can also see some examples of the patterns made with this tool in this repository in the examples folder (the first one had text overlay added in Photoshop):
Using
- To add a new light press Enter key on your keyboard or increase count manually via the slider.
- To "drop" or "pick up" the currently selected light, press Space bar.
- To change colors of the lights, change the ambient and diffuse color controls.
- To export as SVG select SVG in the "renderer" panel and then export the image via "Export big" button. Then navigate to "File -> Save as" in the browser's menu to save the resulting image to your computer.
Running
Download this repository and run index.html in your browser or open this link.
Building
Install Dependencies:
npm install [email protected]
Build (cd into 'build' folder first):
node build.js
Inspiration
The iOS game called "Monument Valley" by ustwo served as an inspiration for this project. Specifically the simulation of the ocean in the game.
Acknowledgments
The shader work was done by Matthew Wagerfield on his MIT-licensed repository.
Author
Maksim Surguy @msurguy
TODO
There are a few things that can be improved to make this tool even better.
- ~~Add varying depth of the vertices of the triangles~~ (Done as of 4/15/2014)
- ~~Add more color variation and presets~~ (Done as of 4/25/2014 with the randomizer functionality)
- Add text overlay and customizer for text
If you can do any of these things - feel free to make a pull request!
License
Licensed under MIT. Enjoy.