Tileable Texture Editor
Gianluca Rubino
Project goal
An editor that lets you upload a texture and generate a seamless version of it. The user can change come parameters to author the best look he wants.
Legend:
Crossed-out small text describe previews goals that now are changed.
GitHub repository
Milestone 1 (05.10)
- Learn C++ (3.5h)
- Choose the right library and IDEs to develop on (2.5h)
- "Hello world" program with chosen platform (1h)
- Learn C++ (4h)
- Choose the right library and IDEs to develop on (2h)
- "Hello world" program with chosen platform (1h)
Development notes
After having learnt the following concepts, I intend to develop a command line application using Visual Studio Community to concentrate on the implementation of tiling algorithms.
- C++ concepts: header files; building, linking and compiling; pointers; struct.
- OpenGL concepts: the definition and specification; the use of GLFW and GLEW on a project; vertex buffers and basic rendering paradigm.
- Image processing on C++ concepts: input and output of images on ppm format; basic filtering; image loading and writing using stb library.
- Working files uploaded on a new GitHub repository.
Milestone 2 (19.10)
- The program has UI to upload an image texture and preview it
- Make sure stb is enough as image processing library, otherwise find something else (2h)
- Implement a basic tiling algorithm on a texture (5h)
Milestone 3 (02.11)
- Research on methods from other people to create a tileable texture automatically
- Do we need to create specific parameters for each type of texture or is there one “global approach”?
- Create the first automatic tile generator from an image texture without user parameters
- Make sure stb is enough as image processing library, otherwise find something else (2h)
- Implement a basic tiling algorithm on a texture (5h)
Milestone 4 (16.11)
- Create UI to change generation parameters
- Experiment with more texture types
- The program has UI to upload an image texture and preview it (4h)
- Research how to make a tileable texture editor (3h)
- Bonus: Start implementing tiling algorithm (1h)
Development notes
The program is now developed with HTML, CSS and JavaScript. A simple front-end application inside the Electron JS environment that gives the ability to build a cross-platform desktop app.
The application can currently: upload an image, preview it, filter it in black and white, revert the changes, download the result or delete the preview.
Dowload the build v0.0.1 alpha.
The research on the topic of automatic texture tiling is narrow, but well documented. Some papers on the topic:
- On Histogram-preserving Blending for Randomized Texture Tiling
- Texture Tiling on Arbitrary Topological Surfaces using Wang Tiles
- Novel Path Search Algorithm for Image Stitching and Advanced Texture Tiling
Paper number 1. is chosen to be implemented.
Benedikt Bitterli already has an implementation on his website.
Started learning the theory of the algorithm and playing with B. Bitterli's code. For now the study is done on a separate web page. The idea is to port it to the Electron application once my personal implementation is finalised and I understand the algorithm completely.
A screenshot of the current progress:
The code is always available on GitHub.
Milestone 5 (30.11)
- Improve UI and parameters names
- More texture experiments
- Finalise study on Histogram-preserving Blending (3h)
- Implement Histogram-preserving Blending (4h)
Development notes
After finalising the study on Histogram-preserving blending and its implementation, the result is described in the following flowchart:
The editor now looks like this (examples with two different textures):
Now it is possible to upload any texture and get its seamless version and visualise the original input pattern.
Dowload the build v0.0.2 alpha.
There is a caveat on the uploaded image: the pattern is pre-processed and cut before the histogram-preserving blending and the user does not know which part of the image is considered by the algorithm. Therefore, a UI prompt should be added to give the user more control on the final seamless pattern.
Milestone 6 (14.12)
- Enhance the generator algorithm if necessary
- Create a shareable build (web assembly?)
- Create image and video presentation
- UI enhancements: repeating pattern preview, button press effect (2h)
- Deploy the application as a website (1h)
- Show a preview of the cut texture to help understand which part of a texture is processed. (2h)
- Expose number of repetitions parameter (2h)
The application is now accessible on freccialata.github.io