Rectangles and combining shapes
Draw a box with step(), then union and intersect shapes with max() and multiply.
A circle came from a distance; a rectangle comes from testing the coordinate against edges. step(0.3, st.x) is 0 left of 0.3 and 1 to the right; multiply four of those together — left, right, bottom, top — and you get 1 only inside a box, 0 everywhere else. That is a filled rectangle.
Combining shapes
Shapes are just values (1 inside, 0 outside), so you combine them with plain math. max(a, b) keeps a pixel that is in EITHER shape — a union. a * b keeps only pixels in BOTH — an intersection. And a * (1.0 - b) cuts b out of a. Union, intersect, subtract: with those three you can build almost any silhouette from circles and boxes.
Your turn: draw two circles side by side and union them into one image. Make each circle with 1.0 - step(0.15, distance(st, center)), then combine the two with max().
Draw two circles side by side (a union).
Circle A at (0.3, 0.5) and circle B at (0.7, 0.5), each radius 0.15: 1.0 - step(0.15, distance(st, center)). Combine them with max(a, b).
To keep a pixel that is inside EITHER of two shapes (a union), you use: