ARTLEBEDEV

Телебашня

ГИМТелебашня

Рассказывает Павел Герасимчук

Однажды для сайта «Узнай Москву» потребовалось создать промо-страницу про Останкинскую телебашню.

Как и в истории с музеем, в основе лежит демонстрация ключевых событий — будто все они произошли на башне в один момент.

Страница башни, в отличие от страницы Государственного исторического музея, компонуется вертикально, предполагается максимально длинной. Готовится и утверждается эскиз страницы.


События

На встрече с пресс-службой уточняются основные события.

Интересующие факты помечаются на эскизе. Важным условием было не вдаваться в технические характеристики башни, интересны именно события. К примеру, высота башни — техническая характеристика, а посетивший башню Фидель Кастро — событие.


Фото

В первую очередь необходимо подготовить башню.

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

Затем фрагменты отбираются и склеиваются в единую композицию. Чем больше таких фрагментов, тем больше запас четкости.

Вытравка башни из фона производится через настройку растровой маски в палитре Properties, функцией Color Range.

На поверхности по всей высоте очерчивается секущая плоскость, вдоль которой изображается нарочито жесткая тень.


Небо

Особое внимание уделяется характеру окружающей атмосферы. Выбор делается в пользу шестого варианта, только закат у основания в разы усиливается.


Шахта

Башня подготовлена, настало время изображения событий.

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

Хорошо начинать с более сложных элементов, работа над простыми потом идет куда легче.

Определяется форма выреза, обозначается основной объем ниши
Устанавливается коробка лифтовой шахты с креплением
Короб детализируется, появляется силовой кабель
Добавляется круглое противопожарное перекрытие
Выстраивается освещение
Прикидывается расположение лифта

Срезы шахты для правильного изображения простраиваются должным образом.

Пришло время «обтягивать» текстурой с канатами внутреннюю поверхность башни. За основу выбирается подходящая фотография из отснятых материалов, ретушируется и укладывается на внутреннюю поверхность.

Детализируются отсеки лифтовой шахты.

Изображается общая ниша
Ниша сегментируется, подвешивается лифт
Включается освещение

Позже обнаруживается план башни, на котором отчетливо видно ее внутреннее устройство.

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

Теперь лифт на своем месте
Прорезается шахта для лестницы

За основу для лестницы берется студийная лестница, ведущая на 7 этаж. Исправляется геометрия.

Крепится лестница
Запускаются спортсмены
Бегуны дорисовываются

В центре ствола башни для посетителей открылась смотровая площадка. Выясняется уровень ее расположения — 85 метров.

Делается набросок
Появляется намек на двери лифта и пожарной шахты
Первые посетители уже делают фотографии
Центральная часть защитной решетки «выпиливается», чтобы не перекрывать экскурсантов
Толпа пополняется
Врезка доводится до ума

Событий стало больше, поэтому вырез в башне закономерно увеличился по вертикали.

Основные шаги рисования четвертного выреза:


Дисплей

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

Заготовка для маски производится в «Иллюстраторе».

Полотно с точками изгибается по форме
Создается выделение
Маска на его основе
Рисуются направляющие
По направляющим диодная сетка корректируется
Дисплей активируется

Возникает идея оживить дисплей — создать иллюзию вращения изображения. Технологу передается маска, которая позволяет транслировать любые картинки.

Помимо самих диодов, маска также включает отражения на конструкциях.

Точная маска для дисплея
Экран в действии

Строительство

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

Фрагмент слайда примеряется к башне

Фотография используется как опорная точка, на ней непросто различить, что к чему. В основании конструкции лежит огромный диск, с него и начинается рисование.

В «Иллюстраторе» при помощи эффекта Extrude & Bevel готовится болванка.

По линии отделочной плитки, по окружности ствола башни изображается направляющая
По направляющей подгоняется ракурс заготовленной болванки
Колесо поворачивается на несколько градусов. Для увеличения детализации в настройках эффекта Extrude & Bevel добавляется фаска
Болванка ставится на основание башни

Настало время многоугольной конструкции. Форма обозначается и укладывается соответственно перспективе. Параллельно фиксируются направляющие для сетчатой конструкции.

Появляется труба лифтовой шахты
Труба обтягивается текстурой. На круглой болванке выравнивается тон
«Строиться» будет только одна половина, левая часть основания остается в первозданном виде
Появляется намек на освещение. Плоскость разреза смещается на несколько градусов вправо

Следом чертится и устанавливается на каркас сетчатая арматурная конструкция. Большинство зацикленных геометрических элементов логичнее создавать в «Иллюстраторе» — так легче вносить изменения при необходимости.

Частично возвращается прозрачность слою с окном, чтобы прикинуть пропорции и положение будущей сетки
Подготавливается конструкция
Удаляются лишние ячейки
Решетка занимает свое место. Разумеется, в виде смарт-объекта
Ведь в любой момент есть вероятность, что конструкцию, например, придется удлинять
Результат тут же обновляется в основном файле

Конструкция последовательно заполняется дубликатами сеток через один сектор
Нечетные секторы накрываются сплошной сеткой
Монтаж продолжается по всей окружности
Арматуре добавляется объем, основанию в необходимых зонах возвращается непрозрачность

Залог точного изображения — наличие необходимых направляющих линий. Главное — не запутаться в их множестве.

На опоры-лепестки подвешиваются строительные леса.

Шейпами обозначается форма
Добавляются ограждения и падающая тень
Детализируется древесина

Пришло время вернуться к балкам внутренней конструкции. Вокруг трубы с лифтовой шахтой находится многоугольное колесо. Ровно как в недавней истории с огромным диском, к заготовке колеса применяется эффект Extrude & Bevel с фаской. В необходимом положении деталь инсталлируется.

Устанавливается еще несколько балок. Настраивается цвет деталей и прикидывается черновое освещение.

Было бы странным не позаимствовать кран с исторической фотографии. В одной из статей находится схема с подписью модели именно того крана, который был задействован на строительстве. Поиск по названию выдает кучу полезных материалов.

Для безошибочного определения ракурса используется традиционный метод с эллипсами, смарт-объектами, в которых заключены шейпы квадратной формы.

1. Рисуется эллипс с раскрытием, соответствующим уровню над горизонтом
5. Схема устанавливается на фото крана
2. Рисуется круг с вписанным квадратом
3. Форма укладывается в заготовленный эллипс
4. Внутри смарта форма поворачивается на нужный угол

На основе полученной схемы легко изобразить кран. В его конструкции много цикличных элементов, которые ловко воспроизводятся в «Иллюстраторе» при помощи инструмента Blend.

Финальным штрихом сцены строительства являются рабочие и контровое закатное освещение, которое снимает необходимость излишне детализировать кран и балочную конструкцию башни.

Ключевые моменты зарисовки строящегося основания.

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

Новые интересные события, поступившие от пресс-службы или найденные в сети, отрисовываются и тут же передаются технологу.

Олимпийский Мишка
Фидель Кастро, посетивший башню
Архитектор с делегацией
Автомобиль с дополнительной частью антенны в кузове
Спутники
Бейсджамперы, поставившие рекорд по количеству одновременно прыгнувших с башни людей

Основные шаги рисования пожара:


Салют

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

Заготовка для искр рисуется в «Иллюстраторе». Готовятся незамысловатые кисти для их рисования. Чем больше будет кистей и чем более различна будет их форма, тем разнообразнее и интереснее будет общий рисунок.

Искра за искрой формируется «тело» салюта. Сначала левая часть.

Затем готовится правая сторона.

Искры переносятся в основную сцену в «Фотошопе» в виде смарт-объектов.

Один за другим на смарты накладываются фильтры и эффекты, помогающие добиться необходимого уровня реализма.

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

Правится векторная часть
На смарт-объекты возвращается действие фильтров

Финальный штрих — фоновые линейные иллюстрации.

Шрифтовое написание названия башни в двух языковых версиях тут же примеряется к композиции.

Выбор делается в пользу более лаконичного варианта.

Башня готова. Все необходимые элементы передаются технологу.