Первый экран для сервиса AI-агентов

Ниже экрана ничего нет, потому что ниже вообще ничего нет: экран один. Слева стоят заголовок, строка про работу и одна кнопка; справа человек, который смотрит прямо из экрана.

Проявление — не круглое пятно фонарика. За курсором идёт след со своей физикой: он размазывается по тому, как двигалась рука, и сам гаснет примерно за треть секунды, поэтому капюшон есть ровно тогда, когда читатель что-то делает. Остановились — человек снова без капюшона.

Под всем этим лежат две фотографии: один и тот же человек без капюшона и в капюшоне. Они совпадают попиксельно, поэтому лицо при проявлении не съезжает ни на пиксель.

Пчёлы здесь — не картинка и не спрайт. Это 3D-сцена: четырнадцать пчёл с телами, полосами, жилками на крыльях, усиками и лапками, соты с восковыми ячейками и мёдом и три цветка, на которые пчёлы садятся.

Труднее всего далось то, как они летают. Любой плавный синусоидальный дрейф читается как плавание, а не как полёт, поэтому полёт собран из бросков и зависаний: пчела висит, подрагивает, потом бросается и тормозит. Шесть бросков из десяти продолжают прежний курс, поэтому рой тянется через кадр, а не сбивается в комок.

Сцена рисуется отдельно, на прозрачном фоне, и подмешивается той же маской, что приводит капюшон: снаружи следа нет ни одной пчелы, внутри — капюшон, рой, соты и цветы.

Поверх человека всё время просвечивает проволочный капюшон пчеловода: купол, тулья, поля, вуаль, воротник. Это настоящий меш, собранный в коде из колец, а не контуры, обведённые по фотографии: контуры с фотографии дают грязь и зерно кожи и чертежом не читаются никогда.

Чертёж подсвечивает бегущая по нему вверх волна. Волна разведена так, чтобы на капюшоне одновременно была только одна кромка: старая уходит раньше, чем приходит новая. Это замерено, а не на глаз, — на нашем шаге оба конца волны стоят на шести процентах от пика, а в тихой фазе капюшон не чёрный нигде.

Меш рисуется в пространстве самой фотографии, длиннофокусной камерой, поэтому он держится на человеке при любом размере окна. На плите он ложится с точностью до семи пикселей.

Через две секунды после того, как мышь перестают двигать, страница начинает двигать её сама: собственный курсор ведёт проходы по портрету на разной высоте, и читатель, который ничего не трогал, всё равно видит, что экран умеет. Как только двинулась живая рука, страница возвращает управление.

Тому, кто попросил систему меньше анимации, рой и поле останавливаются, а след заменяется неподвижной фигурой: картинка остаётся, движение уходит.

Русский, английский и португальский — это три отдельных документа, а не одна страница, подменяющая строки: у каждого свой адрес, свой заголовок с описанием и ссылки на соседние версии — то, что нужно поиску, чтобы держать нужную. Lighthouse ставит странице 100 за поисковую разметку.