Background Formula

Before getting into the meat of this post I need to tell you some background information first, no pun intended, honestly!

When I draw my impossible figures I add a background grid to emphasize that it actually is drawn in three point perspective as well as giving some texture to the void behind the actual artwork. In the beginning when I was still working on a standard for how to draw my figures I decided that I would create a background grid by beaming out 360 lines from each perspective point, one for every degree. You can see it in my old video right here, the link skips to the right time in the video :)

Eventually I discovered that the results of this method were a bit unpredictable. The reason is that the spacing between the lines in the visible area is directly related to how far away the perspective point is from the center of the artwork. The further away the point is, the fewer lines will be visible inside the square.

At first I thought that it added variety to the figures, but in a few cases a distant perspective point caused very few lines to be visible inside the square. In other cases a perspective point was actually visible inside the framed area which made the background very busy indeed.

The last figure, which I mistakenly posted prematurely, was the triggering factor to why I had to change my method. In this case one of the perspective points was so far away from the actual art that not a single line emanating from it was visible in the final crop! In this moment I decided I had to revise how I generated my backgrounds and my brain quickly came up with an idea, though to make it a reality I needed to do some deeper thinking.

I started by sketching out how I imagined I could solve my problem.

The square is the area which I use to trim the lines inside, this so the artwork can be imported in the next application without having the lines continue infinitely. I will call it the box from now on, to make things easier. The points x and t in the above illustration are perspective points.

In the first situation x is a perspective point outside the box. I was going to calculate the angles for the lines intersecting y and z and which specific number of lines to put in between them to get a segment size as close to the standard a as possible. The curve to measure the segment size at would intersect the corner furthest away from x, which here is marked v.

In the second situation with t being inside the box the lines would have to go out in all directions. The number of lines to use would be calculated for a full circle and the curve for the standard segment size would be intersecting u. I had a very hard time trying to figure out how to combine these two situations into one formula.

I ended the first session of thinking by writing down that the standard segment size would depend on only two factors. The size of the box and the distance to the perspective point. This would be the basis for my next sketch.

My new method would use the distance from the perspective point to the center of the box, d, and then add the radius of a circle on the inside of the box, r. Incidentally as the circle is touching all four sides of the box the radius is equal to half of one side of the box side making a whole side 2r.

Accepting this as a good method I went on to do some math. Try to follow my train of thought in the next section!


d = The distance between the perspective point and the center of the box.

r = The radius of the circle inside the box = Half the side of the box.

v1 = As the segment size should be directly related to how big the box is we base our calculations on the box size, the side being 2r. Then we take the total distance d+r and split it in box sides 2r.  This makes our base reference value where d=0, meaning the perspective point is at the center of the box. This ends up generating a fixed value, a constant if you will.

v1 = (d+r)/2r (d=0)
v10/2r+r/2r
v1 = ½

v2 = While v1 was the base value which will generate the standard segment size at d=0 this value is going to be used when d is greater than zero.With it we can calculate the angle that should be between each line emanating from the perspective point to create the standard segment size at d=0.

v2 = (d+r)/2r
v2d/2r+r/2r
v2d/2r

n = Is the number of segments the circle should be split in at d=0 and the segment length generated with this value is the standard segment length.

m = The angle between each line when splitting a full circle (2PI) in n pieces, measuring in radians.

m = 2PI/n (rad)

s = The standard circle segment size to base calculations on when the distance d is zero. The formula for a circle segment is radius * angle (rad). As the relative base radius we will use v1 to keep things relative to the box size, and the angle is the value we created just above, m. This will be a constant.

sv1*m (d=0)

a = The angle between each line that will emanate from the perspective point to keep the segments at the same size as at d=0. This is the segment formula in reverse with s as the segment but with the angle swapped from v1 to v2. This way we take the standard segment angle and calculate which angle there should be for the same size segments on a larger radius circle.

as/v2 (rad)
a(v1*m)/v2
a = (½*(2PI/n))/(d/2r+½)
a(PI/n)/(d/2r+½)

f = This will be the final formula. Now we simply divide a circle (2PI) with the angle for each segment. This will generate a value for how many lines we need to draw from the perspective point. We round the value because we will draw the lines between the segments and not the segments themselves which makes decimals break the drawing method.

f = round(2PI/a)
f = round(2PI/((PI/n)/(d/2r+½)))

Out of my values d, r, v1, v2, n, m, s and a the final formula only uses d, r and n; which makes total sense as those are the only input values!


To see what kind of value I wanted for n I created an interactive application in Flash. This way I could see what kind of results my formula would give me in different situations. I actually had an early version of the application done while I was figuring out all the steps required to solve this, but I kept updating it accordingly so it eventually used the final formula. You can open the application by clicking the image below.

Keep in mind that the software has not been optimized for performance and will eat up a CPU core if you let it, it’s quite heavy if you increase the number at the top which is n. Other things you can do is move each perspective point, move the box and change the size of it with your scroll wheel (at least under Windows).

Of course I also have to show you that my formula actually works :) To use it in my workflow I created a Google spreadsheet in which I can insert values from AutoCAD and quickly get how many lines I should spawn from each perspective point. Below is an animated .gif (768K) in which you can see the results, old method vs new method!

If you actually made your way through this post and understood what I tried to explain, congratulations! I have to confess that it took me quite a while to type this up in English… my vocabulary mostly consists of computer and graphical terms, not so much mathematical ones, and I also had to retrace my steps through the problem solving, trying to remember how I figured it out!

About Andreas Aronsson

Professional app- & web-developer. Spare time multimedia experimenter, VR-enthusiast, motorcyclist. In Sweden.
This entry was posted in Creative and tagged , , . Bookmark the permalink.

2 Responses to Background Formula

  1. ZackDark says:

    That really helpful, BOLL.

    You rock. But then again, you probably already know that.

    ;p

  2. Why thank you mister Zack :D I am interested in how you found it helpful! To understand how I work or for your own projects? It feels like a very specific solution so I figured it would be too obscure for anyone to appreciate it :3 Thanks again, and I’ll make sure to add that to my CV ;) “I’m a rock.” uh.

Leave a Reply