By Vinnie Garcia · All experiments

Putting a grid over a picture

Load a picture and turn on a few overlays. Lines will cross faces, buildings, empty space. With enough lines, some of them are bound to land somewhere interesting.

The useful comparison is what you noticed before the grid appeared. A diagonal through the picture, a face near the edge, a large empty corner. Does the overlay make that relationship easier to see?

Upload opens a local image. URL and Load work with image addresses that allow cross-origin access; if a host blocks one, download the picture and upload it instead. Camera lets you frame and capture a still. Click an overlay's name to show or hide it, and Export saves the picture with the active overlays.

What the lines represent

Thirds divide the width and height at one-third and two-thirds. The phi grid puts its lines at about 0.382 and 0.618. Rabatment uses squares based on the frame's shorter side. The diagonal armatures connect corners, midpoints and intersections; root-two divisions add another set of proportions to compare.

The golden spirals use shrinking rectangles and quarter-circle arcs, mirrored into different orientations. An uploaded image doesn't necessarily have golden-rectangle proportions. Fitting a spiral to its frame doesn't establish that the subject follows that spiral, or that the artist used it.

About those percentages

The optional COCO-SSD detector finds objects and draws a bounding box around each. This demo takes each box's center and measures its distance from the nearest predefined point on an overlay.

A center right on that point contributes the maximum score. At 20 percent of the image diagonal away, it contributes zero. The contributions are averaged and rounded. Scores of 70 percent or more turn an overlay on automatically, but you can change that selection yourself.

That's the whole score. It doesn't track anyone's eyes, judge beauty or recover the artist's intent. It doesn't even compare every line in the overlay. A box's center can miss the important part of a subject, and the detector can miss subjects entirely, especially in abstract work. Without detections or a working model, you can still use the overlays without scores.

A higher percentage is no reason on its own to move something in your picture. These are geometric comparisons, including the golden-ratio ones, not guarantees that a composition works.