The making of the Pyotr Fomenko Workshop Theater website

OverviewProcess I• Process II

Before we start taking photos of the actors, we create the group picture including drawing masks and vector shapes. According to the designer’s idea, each actor should be highlighted by a spot light. This means that when drawing masks we need to take into account the fact that some of that light will touch nearby people and the reflected light will create some backlight on those sitting in front.

At the end we should have two types of masks, a raster and a vector one. The first one is responsible for the light and shade, the second one will be saved in an SVG file to describe active zones. When creating active zones, we should avoid mechanically tracing the silhouette of a person and take into account density of people in that area and their interactions. For example, hovering the mouse over the girl’s wrist will highlight her, but moving further up her arm will select her neighbor.

In situations when there is a lot of empty space around an actor, it makes sense to expand the active zone. However, we won’t bring it all the way down to the shoulder of the man sitting below to avoid the unpleasant flickering when moving the mouse between the rows.

All these things make interacting with the page more comfortable.

Taking pictures of actors, we want to move away from the classic approach to actor shots, both in idea and in implementation. Taking a note of what kinds of photos we don’t want.

Deciding to employ a less used effect, cinemagraphics, combination of static and animated images. A good cinemagram must be perfectly looped and create an impression of endless movement. According to the initial idea, movement in each picture should be barely noticeable.

However, as we work with the actors, they actively engage in generating the ideas which leads to some of the portraits now having full-fledged storylines.

Coordinating schedules of the actors and the studio’s experts is not an easy task. Almost a year passes between taking the first photos and launching the website.

Some of the scenes are prepared with extra care and even if they might look simple visually, most of the action happens outside of the frame.

For others, the portraits take only a couple of minutes.


Test driving almost every scene prior to shooting it. This allows us to consider all possible problems with composition and lighting and avoid extra takes with the actors.

Retouching the acquired material as we go.

Seamless looping of the images sometimes requires several photos taken from the same angle. Working on such portraits implies long and extra careful manipulation of masks and layers.

Deciding to show the work buzz in one of the portraits. Filming sheets of paper endlessly coming out of the printer in one shot and then placing them behind the hand.

However, now the difference in background is clearly visible. Instead of animating the mask of the layer with the moving pen, adding a “filler” mug between the layers.

To better mask the edge of the layers, adding the theater’s logo to the mug, it perfectly repeats the background of the upper level.

The hand should be moving endlessly while the person in the photo looks in the camera every once in a while. Moving the fragment with the glance into a separate layer.

Finalizing the shadows and the lighting.

Adding flickering phone screens and a broadcast of the theater’s webcam to the iMac. Adjusting the overall rhythm of the scene and it’s done.

Some portraits contain a lot of information. To make sure the final file has sane size, carefully choosing a compression method that would not impact the quality of that particular scene while ensuring the minimum size.

Creating over 70 unique portraits.