Skip to content

Freccialata/tileable-texture-editor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

30 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Tileable texture editor

The Computer Graphics and Virtual Reality Lab @ University of Tartu

AY 2021/2022

Repo for Computer Graphics Project course: wiki page.

From the Uni Tartu's wiki page

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.

Picture from IMGonline.

Legend:

Crossed-out small text describe previews goals that now are changed.

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.

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:

  1. On Histogram-preserving Blending for Randomized Texture Tiling
  2. Texture Tiling on Arbitrary Topological Surfaces using Wang Tiles
  3. 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