The logic of good gradients
Natural Environments
These gradients transition between very similar colors. It functions more as shading than color transition.
The mountains, which all transition away from the focal point, may be an opacity transition and no color change.
Other environmental gradients transition in the direction of the light source, which is also in the direction of the focal point.
The foreground is darkest.
The most dramatic color transition is on the ground below the focal point, a subtle way to draw attention there and to create a sense of distance along the shore.
The multi-directional logic creates a more textured and complex look.
Also in this second example, the foreground stays darkest, transitioning to lighter colors with distance. This seems like a standard rule for environments.
There’s higher contrast in colors in the foreground than in the background. Sharp contrast is perhaps correlated to focus. It’s most apparent in the foreground leaves, the river, and the mountains on the left side of the river that do not fade at all.
Though I didn’t annotate it, the trees in the foreground transition from top to bottom between very subtly different colors, which makes them individually recognizable.
Color transitions on the landscape also correlate to the light source. However, this image transitions between colors rather than working with opacity like the first. Opacity transitions are perhaps less related to light source, since the transition on the mountains in the first image opposes the logic of light source. These transitions may be good for adding a layered look without implying a relationship, they also create a glowy look.
Structure floating in space
Monument Valley typifies this style. It’s so damn lovely.
The background gradient implies a light source that is in the same direction as Ida’s destination. The tone transition also correlates the perspective with a logical sense of depth in this field of space (instead of foregrounding).
The gradients on the architectural structure show the play of light, like the environmental images. Each visible face of the structure has it’s own gradient, and it looks like the start and end points would span the height and width of the structure.
The thing that I find most appealing about this is that the moving elements of the structure, the ones that mess with your sense of perspective, have no gradient (or an incredibly subtle one like the beam on which Ida is standing).
Flat 2D Shape
Circles are difficult because they can so easily look like 90s buttons. These look nice with a linear instead of radial gradient. It doesn’t imply that the shape is a sphere and keeps the flat look. However, I think these would benefit from more subtlety in color variation. The top one looks the best out of the three, and would be improved if the color variation were more chilled out.
I’m going to keep updating this post with good gradients.
I’d love feedback since I’m trying to figure this out. Please let me know if you see more here than I do or if you have examples that support/challenge these observations.
