What it is
The portraits on our About page are not plain photos. Each one is drawn as thousands of dots, sampled from the picture and lit by your pointer, and it resolves into the picture when you hover.
The portrait here is a monogram: the first letter of the founder’s name, with its own depth map. Move the sliders to change the dots, the depth and the light.
How it's made
- A picture and its depth map · Each portrait is a picture with a small depth file, a greyscale image where white is nearest. The portrait here is the founder's initial, with a depth map made for it.
- 8,192 dots · The page picks 8,192 points from the picture. Light areas and edges get more dots than flat ones, so the outline stays crisp.
- The pointer is the light · Your pointer is a light in front of the portrait. Dots that face it brighten, and dots turned away stay dim. Light falloff sets how far the light reaches.
- Hover to resolve · Hovering or focusing the portrait turns the dots into the picture. On About, touch, reduced motion and Static show the picture itself. Here each control change draws one still.
What we learned
Weighting the dots toward light areas and edges kept the shape readable with only 8,192 points.
If motion bothers you
With reduced motion turned on, the portrait draws as one still that each control changes. Every control works with a keyboard, and Pause motion stops the light at any time.
