ImageGen, A New Way to Create Art through Mathematical Formulas


Imagine a new way of creating content, a new way of generating unique images and works of art. All through just three mathematical formulas that present you with limitless possibilities and endless creations to stun and amaze your friends and family or even the world!


This app has features that make it unique and easy to use, yet make it versatile and streamlined.

  • Easy to use and effective UI with streamlined performance.
  • Over 20 mathematical functions for you to use in your formulas, including:
    • Sine
    • Cosine
    • Tangent
    • Secant
    • Cosecant
    • Cotangent
    • Arc Sine
    • Arc Cosine
    • Arc Tangent
    • Hyperbolic Sine
    • Hyperbolic Cosine
    • Hyperbolic Tangent
    • Log
    • Natural Log
    • Square Root
    • Exponential
    • Absolute Value
    • Step Function
    • Delta Function
    • Random Function
  • Along with important mathematical constants, such as:
    • Pi
    • e
  • You also get access to variables to use within your formula that change per image and per pixel:
    • Current Pixel's X-coordinate.
    • Current Pixel's Y-coordinate.
    • Image Width.
    • Image Height.
    • Even the current time, which changes as the image gets generated.
  • Created formulas can be saved for later use to tweak or integrate or even share with someone else.
  • Formula entry boxes feature syntax highlighting for easy readability and gives the ability to see if a formula or variable name was typed-in correctly.
    • Formula Syntax Highlighting
  • Once you click the generate button, the image gets created right in front of your eyes. Giving you the ability to see if your formulas are generating the desired result, if not, there is always the cancel button.
    • Image Generation Preview
  • Once you create an image, you have the ability to save it to your Pictures Library.
  • You also have the ability to immediately post your generated image straight to Twitter or Facebook right from the app.

Demonstration and Tutorial

Here is a video demo and tutorial of what ImageGen is capable of, as well as a "Get Started" tutorial

Getting Started

The Theory Behind ImageGen

When I first prototyped the idea that has now become ImageGen, I set a few core workflow guidelines/techniques to solidify the image creation process, they are as fallows:

  • Each pixel consists of three base colors: Red, Green and Blue.
  • Each color can hold a value between 0 and 255, 0 being the minimum and 255 the maximum.
  • There are three formulas, one for each base color, and each formula must return a value for its color within the 0-255 range.
  • When an image gets generated, each formula gets executed with updated variables to retrieve the current pixels color. This process repeats for every single pixel in the image.
  • Resulting in an image that has been generated from pure mathematical formulas, whether they are simple or very complex, with limitless outcomes and creations.

Getting started with ImageGen is quiet easy. For example, lets go through the steps of creating a solid color image.

  1. First step is to enter 255 into the Red formula box, fallowed by 0 in Green and Blue formula boxes. This will ensure that every pixel in the image has a pure Red color therefor, resulting in the whole image being Red. Press Generate button and see if you get that too.
  2. Now lets mix two colors together to create a yellow image, to do so lets change the 0 value in the Green formula box to 255 and leave the rest as is. What we should get is a yellow image, press Generate to confirm.
  3. Lets make a formula that creates a horizontal red gradiant going from black to red.
    • Start by clearing all three formuas by clicking the Clear Formula button.
    • Now enter this into the Red formula box:255 * (X / WIDTH)
    • Enter 0 into the other two formula boxes since we are only focusing on one color.
    • Now press Generate and you should see a red gradiant from left to right.
      Red Gradiant
  4. This time lets add a function into our formula.
    • I'm going to use the SIN function to create an image with alternating curves of red on the X-axis. To do so, lets enter this into the Red fomula box: 255 * (SIN(X) + 1) / 2 and 0 into the other formula boxes. As you may know SIN returns a value between -1 and 1 but if we multiply that by 255 we get a color value from -255 to 255 and we need a value between 0 and 255. To adjust for that we shift the SIN value up by 1 to make it 0 to 2, then we devide that value by 2 to make it 0 to 1. So now we end up with a color value between 0 and 255, perfect!

      Red Sin Wave
    • You will notice that the red stripes are very close tegether, we can add a little more math to "zoom" into the red sin waves. All we need to do to "zoom" into them is devide the X variable by a value, in our case lets use 20. Your new Red fomula should look like this: 255 * (SIN(X / 20) + 1) / 2 And viola!

      Red Sin Wave Zoomed In
    • Lets finish off the Getting Started tutorial by creating a checkerboard-like image. To do this all we need is to add a formula to another color channel to create the hotizontal stripes. For this example we will add a formula to the Green formula box. It will be identical to the above SIN wave but instead of using the X-axis we will use the Y-axis, it should look like this: 255 * (SIN(Y / 20) + 1) / 2. Pressing Generate should result in an image like this:

      Checkerboard Image
    • From here you should know the basics of ImageGen and you should try modifying the formulas we put together by zooming out for example or adding the Blue color channel as well. You can also try out the many included formulas that cone with ImageGen.

Video Demo

Advanced Tutorial

Coming Soon...

Available in the Windows Store for only $2.49 starting July 1st, 2013! Click here to try it!

Twitter Feed

RT @ChikaraAAW: Working on finishers. Top rope, grapple, Irish whip, submission, opponent-down, etc. And we want you 2 be able 2 assign as…

Eugene Tchoukhrov Eugene Tchoukhrov

@_TheJamsh Can reduce it to 3, at first glance, by getting Velocity.Size() before getting its Normal and using it to get the Normal manually

Eugene Tchoukhrov Eugene Tchoukhrov