Мантра сегодняшнего бытия: «чем больше ты делишься, тем больше ты получаешь». Отчасти, именно поэтому сайты в интернете появляются ежедневно в невообразимом количестве, с разным дизайном и на разную тематику. И сфера архитектуры не остается в стороне. Вы можете задуматься, что особенного может быть в дизайне архитектурных сайтов? Как ни странно, но многое и хотя бы только потому, что эти сайты привлекают пользователей к деятельности компании/человека.

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

Но вот в чем загвоздка… О чем обычно рассказывается на таких сайтах? О деятельности компании, представляются проекты в фотографиях, существует страница с контактами, новостями, раздел СМИ. В целом-то как такового контента мало, а потому дизайну сайта и стараются уделить особое внимание.

Эзотерическая навигация

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

А вот подборка htmlinspiration готова порадовать самыми разными архитектурными проектами, которые и выглядят необычно, и созданы вполне современными.

Возвращаясь же к навигации отметим, что в среде архитекторов почему-то сложилось мнение, что использовать «мистическую » навигацию - это круто! Это когда на сайте много текста и картинок и только если пользователь подводит к ним курсор мышки, то они изменяются и представляют собой ссылку. Вот только пользователи не всегда подводят и не так ищут эти самые ссылки. Один раз может и сработает, но потом посетители будут уходить, поскольку целевая аудитория архитектурных сайтов иная. Они приходят на такой сайт по работе, для бизнеса, для заказов, для возможности ведения строительства, а не для долгого наслаждения красивыми Hover-эффектами. Как пример, сайт snohetta . Выглядит красиво, но на РС пока не подведешь курсор к фото - не узнаешь, о чем речь.

Flash-сайты

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

Единый URL

Важность специфики

Архитектура очень специфическая область, узкая даже, если можно так выразиться. Поэтому пытаться угнаться за «ноу-хау» не всегда нужно. Это даже плохо. Даже если заказчику хочется размесить огромное число фотографий спроектированных им зданий или строений, задача веб-мастера подобрать и описания, и правильное их количество на странице - дабы все это не превращало сайт в кашу.

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

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

И вот некоторые примеры интересных архитектурных сайтов, имеющие и отдельные блоги, и новостные ленты, фотогалереи, отдельные страницы и обилие спецэффектов. При этом выглядят они современно и не перегружено. Многие из них были созданы пару-тройку лет назад и до сих пор известны в интернете, и не стремятся менять дизайн, ибо он прекрасен. AGi Architects , Bjorken Architects , Case 3D , jamesmerrellarchitects , snohetta , haririandhariri , architecture .

Photoshop и архитектура

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

Чертежи создают с передней, боковой сторон здания или в виде сверху. Более того, чертежи и схемы отображают только точный план дома, а готовые фотографии имеют множественные сторонние детали, отражения, свет солнечных лучей. Разумеется, если у вас в запасе есть красивые 3D векторные объекты, то работать с ними проще. Но если есть только фотографии? Старайтесь, чтобы было меньше деталей и хорошая освещенность фокуса.

Открываем изображение, создаем копию и переходим Изображение -> Коррекция -> Обесцветить.

Применяем Фильтр -> стилизация -> Выделение краев и видим уже совсем иное изображение, которое уже почти и формирует эффект чертежа.

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

Любая фотография включает в себя помимо самого здания множество лишних объектов. Это могут быть деревья, кусты, люди, машины и пр. На чертежах всего этого нет, а потому мы воспользуемся инструментом Перо и выделим контур нашего здания. Ставьте больше точек и более-менее аккуратно обведите домик. Затем кликайте ПКМ по контуру и выбирайте Выделить область.

Слой должен быть активным и при активном выделении объекта кликаете на панели слоев добавить Слой-маску. Ваш объект автоматически изолируется на данном слое. Теперь, если у вас внутри рабочего контура есть лишние детали (как например, у нас в левой части у лестницы), вы выделяете отельные области и с помощью клавиши Del на клавиатуре удаляете их. Фон будет прозрачным, и объект останется цельным на маске.

Пришло время создать голубой фон. Создаем новый слой и заливаем его подходящим синим цветом. Сам слой располагаем под слоем с рабочим изображением. У слоя с изображением (черно-белым) выбираем режим наложения -> Экран. Таким образом, черный фон станет прозрачным, а белые линии останутся на синей подложке.

Добавим обводку для всего объекта. Кликаем два раза по слою с изображением и в окне свойств выбираем Выполнить обводку белым цветом, внутри, а вот ширину смотрите, как вам лучше подойдет. Мы выбрали 1 пиксель, но иногда удобнее и 5px. Зависит от рисунка и качественной вырезки контура.

С этим документом пока все. Сохраним.

Теперь займемся сеткой . Вопрос: «Какого размера создавать сетку ?» - спорный. Все зависит от масштаба вашего изображения, объекта, от желаний. Иногда 80х80рх в самый раз, но мы выбрали 50х50рх, и тоже смотрится вполне красиво. При желании можно создать несколько слоев с сетками и сделать подобие миллиметровки (мелкие квадраты, большие, совсем крупные). Принцип работы будет один, но мы создадим одну сетку. Чтобы было проще представить, нарисуйте поверх своего домика небольшой квадрат и посмотрите по линейке в Photoshop какой его размер.

Создаем новый документ и выставляем его размер 50х50 пикселей. Увеличиваем масштаб для удобства работы и создаем новый прозрачный слой. Используя инструмент Выделение делаем выделение шириной/длиной в 2 пикселя сверху и по левой стороне и заливаем белым цветом.

Переходим в меню Редактирование -> Определить узор и сохраняем получившееся. Все, документ можно закрыть.

Возвращаемся к нашему чертежу и создаем новый чистый прозрачный слой. Выбираем инструмент Заливка и указываем вместо цвета - узор и из списка выбираем нашу сетку. Теперь кликаем в любом месте и.. вуа-ля, сетка появилась!

Чертежи обычно в рамке, поэтому выделяем по сетке (а это удобно стало) вокруг объекта с небольшими отступами, кликаем ПКМ по выделению и выбираем Выполнить обводку белым цветом, ориентировочно в 5рх.

Не снимая выделения, вновь кликаем по нему и из меню выбираем Инверсия выделенной области и нажимаем Del.

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

Добавляем к слою с сеткой слой-маску и, зажимая Alt, кликаем по ней. Таким образом, она становится доступной для редактирования. Находим в интернете любую интересную текстуру пыли и царапин на черном фоне и открываем в Photoshop. Копируем её на слой-маску. Можно изменить масштаб, повернуть при необходимости.

Снимаем выделение и появится все наше готовое изображение. Активным на панели слоев оставляем слой-маску от сетки и нажимаем Ctrl+ L (Уровни) и сдвигаем ползунки так, чтобы добиться максимальной контрастности. В сторону черного цвета. Вы увидите, как сетка обретет не такой строгий и четкий вид. Подберите понравившийся вариант и нажимайте Ок.

Теперь возьмем текстуру бумаги (например, отсюда) и вставим её на новый слой. Обесцветим и инвертируем, как делали это в начале с исходной фотографией. Режим наложения применим Экран .

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

Аналогично делается и на светлом фоне, но режимы наложения выбираются не Экран (что осветляют основу), а Умножение, Затемнение и прочие, которые, напротив, делают светлое темным. Более того, цвет фона подбирайте без большого количества белого. Светло-розовый затруднит вам работу с контрастом и получится уже не подобие чертежа, а рисунка от руки, что совсем не подходит в данном случае. Пусть будет чуть темнее.

Выводы

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

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

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

What You"ll Be Creating

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

Эффект, который создан на изображении выше – я покажу вам, как создать его в этом уроке. Если вы захотите создать более сложные наброски с акварельными эффектами, как на изображении ниже, при этом создать данный эффект быстро и легко, то вы можете воспользоваться моим экшеном Photoshop TechnicalArt 2 .

Что вам понадобится

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

1. Давайте Приступим

Вначале, откройте исходную фотографию, с которой вы хотите работать. Чтобы открыть фотографию, идём Файл – Открыть (File > Open), а затем в окне браузера, выберите свою исходную фотографию. Нажмите кнопку Открыть (Open). Теперь, перед тем, как мы приступим, необходимо, чтобы вы уточнили пару моментов:

  1. Ваша исходная фотография должна быть в цветовом режиме RGB, 8 бит/канал (8 Bits/Channel). Чтобы проверить это, идём Изображение – Режим (Image > Mode).
  2. Для получения наилучшего результата, размеры вашей исходной фотографии должны быть в пределах 2000–4000 px по ширине / высоте. Чтобы проверить это, идём Изображение – Размеры изображения (Image > Image Size).
  3. Ваша исходная фотография должна быть слоем заднего фона. Если она не является таковой, тогда идём Слой- Новый – Задний фон из слоя (Layer > New > Background from Layer). Примечание переводчика : слой с исходной фотографией должен быть с замочком и представлять задний фон.

2. Создаём Задний Фон

Шаг 1

В этой части урока мы создадим задний фон. Идём Слой- Новый слой-заливка – Цвет (Layer > New Fill Layer > Solid Color), чтобы создать новый слой с заливкой цвета, назовите этот слой Цвет Заднего фона (Background color), а затем установите следующий цвет заливки #f0f0f0 , как показано на скриншоте ниже:

Шаг 2

Теперь щёлкните правой кнопкой мыши по данному слою и в появившемся окне, выберите опцию Параметры наложения (Blending Options), примените стиль слоя Наложение градиента (Gradient Overlay) и установите следующие настройки, которые указаны ниже:

3. Создаём Основной Набросок

Шаг 1

В этой части урока мы создадим основной набросок. Перейдите на фоновый слой (Background), а затем нажмите клавиши (Ctrl+J ), чтобы продублировать данный слой. Далее, переместите созданный дубликат слоя наверх, расположив поверх всех остальных слоёв.

Шаг 2

Теперь нажмите клавиши (Ctrl+Shift+U ), чтобы обесцветить данный дубликат слоя. Далее, идём Изображение – Коррекция – Уровни (Image > Adjustments > Levels). Установите следующие значения, которые указаны ниже:

Шаг 3

Назовите этот слой Временный (Temp), а затем нажмите клавиши (Ctrl+J ), чтобы продублировать данный слой.

Шаг 4

Теперь нажмите клавиши (Ctrl+I ) для инверсии данного слоя, а затем поменяйте режим наложения для данного слоя на Осветление основы (Color Dodge). Далее, идём Фильтр – Другое – Минимум (Filter > Other > Minimum), установите Радиус (Radius) на 2 px , а параметр Сохранить (Preserve) на Прямоугольность (Squareness), как показано на скриншоте ниже:

Шаг 5

Удерживая клавишу (Ctrl ), щёлкните по слою Временный (Temp), чтобы одновременно выделить оба слоя. Далее, нажмите клавиши (Ctrl+E ), чтобы объединить эти выделенные слои в один слой.

Шаг 6

Поменяйте режим наложения для объединённого слоя Умножение (Multiply), а затем назовите этот слой Основной набросок (Main Sketch).

4. Создаём Набросок в Перспективе

Шаг 1

В этой части урока мы создадим набросок в перспективе. Перейдите на фоновый слой (Background), а затем нажмите клавиши (Ctrl+J ), чтобы продублировать его. Далее, переместите созданный дубликат слоя наверх, расположив поверх всех остальных слоёв.

Шаг 2

Теперь идём (Filter > Stylize > Ctrl+Shift+U

Шаг 3

Идём (Filter > Blur > Угол (Angle) на 90° , а Смещение (Distance) на 1200 px

Шаг 4

Теперь идём (Filter > Sharpen > Smart Sharpen). Установите следующие настройки, которые указаны ниже:

Шаг 5

Идём (Filter > Filter Gallery > Sketch > Детализации (Detail) на 2 , а значение Затемнённости (Darkness) на 5 .

Шаг 6

Умножение Непрозрачности (Opacity) до 40% . Далее, назовите этот слой Набросок_Перспектива_1 (Perspective_Sketch_1).

Шаг 7

Теперь идём (Layer > Layer Mask >

Шаг 8

Кисть (Brush Tool (B), установите мягкую кисть, а затем прокрасьте кистью те участки наброска, где бы вы хотели показать вертикальные линии перспективы.

Шаг 9

Теперь перейдите на фоновый слой (Background), а затем нажмите клавиши (Ctrl+J ), чтобы продублировать его. Далее, переместите созданный дубликат слоя наверх, расположив ниже слоя Набросок_Перспектива_1 (Perspective_Sketch_1) в палитре слоёв.

Шаг 10

Теперь идём Фильтр - Стилизация - Выделение краев (Filter > Stylize > Find Edges), а затем нажмите клавиши (Ctrl+Shift+U ), чтобы обесцветить данный слой.

Шаг 11

Идём Фильтр – Размытие – Размытие в движении (Filter > Blur > Motion Blur), а затем установите Угол (Angle) на , а Смещение (Distance) на 1200 px , как показано на скриншоте ниже:

Шаг 12

Теперь идём Фильтр – Резкость – Умная резкость (Filter > Sharpen > Smart Sharpen). Установите следующие настройки, которые указаны ниже:

Шаг 13

Идём Фильтр – Галерея фильтров - Эскиз - Ксерокопия (Filter > Filter Gallery > Sketch > Photocopy), а затем установите значение Детализации (Detail) на 2 , а значение Затемнённости (Darkness) на 5 .

Шаг 14

Поменяйте режим наложения для данного слоя на Умножение (Multiply), а также уменьшите значение Непрозрачности (Opacity) до 55% . Далее, назовите этот слой Набросок_Перспектива_2 (Perspective_Sketch_2).

Шаг 15

Теперь идём Слой- Слой-маска – Скрыть всё (Layer > Layer Mask > Hide All), чтобы добавить слой-маску, которая скроет весь слой.

Шаг 16

Установите цвет переднего плана на #ffffff , выберите инструмент Кисть (Brush Tool (B), установите мягкую кисть, а затем прокрасьте кистью те участки наброска, где бы вы хотели показать горизонтальные линии перспективы.

5. Создаём Текст

Шаг 1

В этой части урока мы создадим текст. Выберите инструмент Горизонтальный текст (Horizontal Type Tool (T), установите шрифт Hijrnotes , размер шрифта 80 px , выравнивание по левому краю, цвет шрифта #000000 . Далее, щёлкните в любом месте внутри холста, а затем идём Текст - Вставить Lorem Ipsum (Type > Paste Lorem Ipsum), чтобы вставить любой произвольный текст. Не стесняйтесь использовать свой собственный текст, а также свои настройки шрифта.

Шаг 2

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

Шаг 3

Теперь назовите этот слой Текст_1 (Text_1). Далее, нажмите клавиши (Ctrl+J

Шаг 4

Ctrl+A Текст - Вставить Lorem Ipsum (Type > Перемещение (Move Tool (V), щёлкните в любом месте внутри холста, а затем переместите текст внутри холста, чтобы расположить его, как показано на скриншоте ниже:

Шаг 5

Назовите этот слой Текст_2 (Text_2), а затем переместите его, расположив ниже слоя Текст_1 (Text_1) в панели слоёв. Далее, нажмите клавиши (Ctrl+J ), чтобы продублировать данный слой.

Шаг 6

Дважды щёлкните по миниатюре данного слоя для редактирования текста, а затем нажмите клавиши (Ctrl+A ), чтобы выделить полностью текст, далее, идём Текст - Вставить Lorem Ipsum (Type > Paste Lorem Ipsum), чтобы вставить любой произвольный текст. Далее, удалите часть текста, выберите инструмент Перемещение (Move Tool (V), щёлкните в любом месте внутри холста, а затем переместите текст внутри холста, чтобы расположить его, как показано на скриншоте ниже:

Шаг 7

Нажмите клавиши (Ctrl+T ), чтобы трансформировать данный слой, установите Поворот (Rotate) на 15° .

Шаг 8

Теперь назовите этот слой Текст_3 (Text_3), переместите данный слой, расположив его ниже слоя Текст_2 (Text_2) в панели слоёв.

6. Проводим Заключительную Цветовую Коррекцию

Шаг 1

В этой части урока мы проведём заключительную цветовую коррекцию. Нажмите клавишу ‘D ’, чтобы установите цвета по умолчанию, перейдите на слой Текст-1 (Text_1). Далее, идём Слой- Новый корректирующий слой – Карта градиента (Layer > New Adjustment Layer > Gradient Map), чтобы создать новый корректирующий слой с картой градиента, назовите этот корректирующий слой Общая Контрастность (Overall Contrast).

Шаг 2

Теперь поменяйте режим наложения для данного слоя на Мягкий свет (Soft Light), а также уменьшите Непрозрачность (Opacity) до 35% .

Шаг 3

Идём Слой- Новый корректирующий слой-Уровни (Layer > New Adjustment Layer > Levels), чтобы создать новый корректирующий слой с уровнями, назовите этот слой Общая Яркость (Overall Brightness).

Шаг 4

Дважды щёлкните по миниатюре данного корректирующего слоя и в появившемся окне панели Свойства (Properties), установите настройки, которые указаны на скриншоте ниже:

Шаг 5

Нажмите клавиши (Ctrl+Alt+Shift+E ), чтобы создать объединённый слой. После этого идём Фильтр – Другое – Цветовой контраст (Filter > Other > High Pass). Установите Радиус (Radius) на 2 px , как показано на скриншоте ниже:

Шаг 6

Поменяйте режим наложения для данного слоя на Жёсткий свет (Hard Light), назовите этот слой Общая Резкость (Overall Sharpening).

Мы завершили урок!

Поздравляю, вы справились! Вы можете увидеть итоговый результат на скриншоте ниже.

Если вы захотите создать более сложные наброски с акварельными эффектами, как на изображении ниже, используя один клик мыши и при этом создать данный эффект быстро и легко, то вы можете воспользоваться моим экшеном TechnicalArt 2 Photoshop .

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

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

Вы также можете получить всё это в одном пакете и сэкономить 50% - перейдите по ссылке, чтобы увидеть мой экшен Artistic 4in1 Photoshop Actions Bundle .

Представляю туториал «Aрхитектурная подача и архитектурная композиция», автором статьи является Duche, оригинал статьи на форуме сайта 3DCenter.ru. Несмотря на то, что статья писалась под 3D-моделирование, думаю она будет полезна и при съемке панорам. Перепечатка статьи произведена, разумеется, с разрешения автора.

Самой архитектурной подаче много сотен лет и за это время она выработала некоторые каноны и подходы, которые являются общепринятыми в мире архитектуры. Не секрет, что большинство людей, которые сегодня занимаются архитектурной визуализацией, архитекторами по профессии не являются и с некоторыми правилами и законами этого жанра не знакомы. Систематизированной информации на эту тему, лично мне в интернете найти не удалось. Будучи отморозком, который имея архитектурное образование, тем не менее, большую часть времени на протяжении последних 10 лет посвящал визуализации, я решил написать небольшой тутор на тему «Архитектурная подача и законы композиции». Оговорюсь сразу, что эти законы и правила не являются обязательными к выполнению и более того есть сотни работ, в которых некоторые из этих правил (а может и все) нарушены, и это отнюдь не умаляет их достоинств. Начну я с композиции экстерьерных визуализаций. О предмете самой архитектурной композиции я говорить не стану — путь этим занимаются архитекторы. А говорить я буду о композиции кадра, выборе точки зрения, освещении и антураже. В качестве объекта визуализации возьмем куб. В приложенной картинке несколько вариантов того, как можно, но не нужно его визуализировать. Разберем ошибки каждого из них.
1. Точка зрения выбрана не удачно. Из четырех граней куба (фасады), которые нам интересны (крыша и, особенно вид с низу в визуализации обычно не нуждаются) мы видим только один. Представления о всей форме объекта мы не имеем. Разумеется бывает потребность в такого рода однофасадных визуализациях, но обычно это частный случай конкретно поставленной задачи.
2. Несет в себе наибольшее количество ошибок. Во-первых точка зрения парит где-то в облаках. Один из основных принципов архитектурной подачи в том, что точка зрения (местоположение камеры) должна соответствовать реально существующей точке на уровне глаз среднего человека (обычно принимается 1.5 метра). Исключениями бывают специальные подачи с высоты птичьего полета. Используются для визуализации крупных объектов (микрорайон, район, поселок), которые с человеческой точки зрения видны только малой своей частью. Нарушение этого правила приводит к тому, что по такому изображению невозможно оценить размер объекта. Если же правило «человеческой точки зрения» соблюдено, то даже не имея на изображении никаких других элементов известного размера, можно представить габариты объекта.(смотри схему определения габаритов объекта) Во-вторых практически отсутствуют перспективные искажения… то есть вид близок к аксонометрии. Подача в виде аксонометрии может существовать, но тогда это должна быть честная аксонометрия или диметрия, а не слабенькая, почти не заметная перспектива. И в-третьих, взгляд направлен точно в ребро куба и оба его «фасада» практически одинаково «раскрываются» на зрителя. Эта ошибка очень часто встречается в архитектурных визуализациях. Обязательно нужно «отдавать предпочтение» одному из фасадов и поворачивать его к камере больше, чем другой. И источник света направлять на этот предпочтенный фасад. (о постановке света мы поговорим отдельно).
3. Самая распространенная ошибка. Вертикали не вертикальные и «падают».Это происходит из-за того, что точка зрения и цель зрения не находятся на одной высоте или другими словами направления взгляда не параллельно земле. Вы мне можете возразить, что в реальности так все и есть. И если задрать голову вверх или наоборот посмотреть вниз, то вертикали тоже будут сходиться в перспективе. И на фотографиях в большинстве случаев архитектурные объекты имеют не вертикальные вертикали. Дело в том, что человеческое зрение это не просто оптический прибор, а это еще и сложная система обработки мозгом визуальной информации, получаемой от органов зрения и называемой восприятием. Так вот человеческое восприятие устроено так, что незначительные перспективные отклонения вертикальных линий окружающего нас мира мозг в процессе восприятия «выпрямляет». Поэтому небольшие отклонения от вертикали в визуализации сразу бросаются в глаза (мозг протестует против них) и отдают ненатуральностью. И если вы посмотрите профессиональные фотографии архитектурных объектов, то увидите, что фотографы по мере сил стараются избежать падения вертикалей. Достигают они этого специальной весьма недешевой оптикой (shift объективы) или карданными камерами. Но совсем другое дело если объект действительно очень высокий (небоскреб) и подачей хочется подчеркнуть именно его высоту… тогда падающие вертикали очень эффективное средство.
4. Присутствуют перспективные искажения (абберации). Мы знаем, что если посмотреть на куб сверху, то угол между его соседними гранями составит 90 градусов. И с какой бы стороны мы бы на куб не смотрели этот угол (обозначен на картинке) в реальности меньше 90 градусов быть не может. Таких искажений следует избегать. Но совсем от них отказываться не нужно… «острая» перспектива часто дает изображению впечатляющую экспрессию. Кроме того в интерьерных визуализациях допуск искажений — это зачастую единственный способ охватить взглядом небольшое или наоборот очень большое помещение. Все дело в том в какой степени эти искажения бросаются в глаза.
Возникает вопрос, а нет ли какой-то схемы позволяющей не ошибиться в выборе точки зрения и перспективы? Отвечу … да есть. И об этом мы поговорим в следующей главе.

Прежде чем я представлю обещанную схему, я хочу сделать небольшое отступление на тему перспективы. Трехмерная графика потому и называется трехмерной, что все объекты имеют размеры в трех измерениях (длинна, ширина и высота). Перспективное изображение это симуляция трехмерного вида на двухмерной плоскости (монитор, лист бумаги и.т.п.) От других типов отображения трехмерной информации на плоскости (аксонометрии, диметрии, плана с отметками) перспектива отличается тем, что она наиболее близка к тому, как человек воспринимает окружающий его мир и основана на понятии «перспективное сокращение». Перспективное сокращение это видимое уменьшение размеров объекта с удалением от точки зрения (положения камеры). Чем дальше объект, тем он меньше. Бесконечно далекий объект имеет нулевой размер и находится на линии горизонта. Линия горизонта находится на уровне точки зрения (положения камеры). Все линии параллельные земле сходятся на линии горизонта. Все параллельные линии параллельные земле сходятся на линии горизонта в ОДНОЙ точке (точке схода). Рассматривая архитектурную визуализацию на примере куба (а практически любой архитектурный объект можно представить в виде куба, параллелепипеда иди набора из нескольких подобных тел) мы можем говорить о трехточечной перспективе. Поскольку у нас есть три комплекта перпендикулярных друг другу и параллельных между собой рёбер, то мы имеем три точки (две на горизонте и одна в небесах или под землей), где продолжения наших рёбер пересекутся. (смотри рисунок 1). Поскольку мы решили, что «падающие вертикали» это не характерный и весьма специфичный для визуализации прием, то расположив направление нашего взгляда перпендикулярно вертикалям (и параллельно земле) мы получим двухточечную перспективу (рисунок 2), которая и является основной в арх. визуализации. Еще более частным случаем является одноточечная перспектива (рисунок 3) это, когда взгляд перпендикулярен не только вертикалям, но и грани нашего куба. Такая перспектива используется для фасадной визуализации иди для подачи протяженных объектов (взгляд вдоль улицы, парка и.т.п)
На рисунках точками соответствующего цвета обозначены точки схода.

И вот перед вами обещанная схема. К предыдущей схеме с точками схода и горизонтом добавилась одна деталь — это окружность, диаметр которой определен точками схода. Как известно из курса школьной геометрии треугольник двумя углами опирающийся на диаметр окружности, а третьим углом лежащий на этой окружности — прямоугольный. То есть, указанный мною угол всегда равен 90 градусам. Из этого следует, что какой бы мы не взяли куб или параллепипед и как бы мы на него не посмотрели, то, если он будет находится внутри вышеозначенной окружности, перспективных искажений и аббераций не будет. А как только он выйдет за пределы этого круга, они (абберации)сразу же повылязят.

Теперь давайте протестируем на этой схеме примеры из первой главы.
1. Нет возможности вписать в эту схему, потому что он имеет только одну точку схода.
2. Поскольку перспектива очень слаба, точки схода находятся чрезвычайно далеко и на нашей схеме кубик получается совсем маленьким, кроме того он находится близко к центру окружности, что вызвано безвольным почти симметричным разворотом фасадов на зрителя.
3 Данная схема не учитывает третью точку схода, но помимо «падения» вертикалей видно, что перспектива чересчур экспрессивна. Объект занимает большую часть окружности, точки схода очень близки друг к другу и он тоже тяготеет к центру.
4 Огромные перспективные искажения. Объект не помещается внутрь круга.

Проведя такие анализы можно прийти к следующему выводу. Объект внутри этой схемы не должен быть большим или маленьким. Куб на этом примере более-менее оптимален. Размеры могут варьироваться в разумных пределах. Кроме того не все архитектурные объекты представляют из себя куб. Топология и пропорции объекта сильно влияют на выбор точки зрения и угла обзора на него.
На схеме красным закрашены области, где предпочтительно разметить ближайший к зрителю угол (ребро) объекта при взгляде с человеческой точки зрения. Если вы все-таки решаете смотреть на свой объект сверху, то ориентируйтесь по синим областям. Ну вот это пожалуй все рекомендации относительно выбора точки зрения на объект экстерьерной архитектурной визуализации. В следующей главе поговорим о композиции кадра… если это кому-нибудь интересно.

Итак, выбирать точку зрения на объект мы умеем. Теперь хочется понять, как поместить наш объект в кадре так, чтоб получилась хорошая композиция. Универсальных рецептов тут так же быть не может, но некоторые закономерности конечно есть. Для начала надо определиться с соотношением сторон кадра. В зависимости от размеров вашего объекта и его пропорций это соотношение может быть разным. Например, одноэтажное здание большого размера (какой-нибудь гипермаркет) потребует сильно вытянутый по горизонтали кадр, а небоскреб наоборот по-вертикали. Но в любом случае хорошим тоном будет компоновка в кадр, соотношения сторон которого, соответствуют «золотому сечению».
На протяжении многих веков, для построения гармоничных композиций архитекторы и художники пользуются понятием «Золотого сечения».
Графически «Золотое сечение» можно представить как деление отрезка АС на две части таким образом, что большая его часть АВ относится к меньшей ВС так, как весь отрезок АС относится к АВ (т.е. АВ:ВС=АС:АВ). Это отношение равно примерно 5:8. Вот графический способ построения «золотого сечения»:
Построим сначала квадрат (выделен розовым цветом). Затем разобьем основание квадрата пополам (точка X). Будем считать точку Х центром окружности, одной из точек которой является вершина квадрата Y. Затем построим окружность до пересечения с продолжением нижней стороны квадрата (точка Z), и построим через точку Z прямоугольник. В результате мы получим прямоугольник с соотношением сторон 5:8. Отношение величин отрезка А к отрезку С, такое же как отрезка В к отрезку А. Отношение 5:8 очень близко к отношению сторон стандартного листа бумаги (А3, А4 и.т.д)

Вот кадр с такими сторонами лучше всего и брать за основу. Соотношение сторон монитора обычно 6:8 (потому нам и предлагают стандартные разрешения типа 800х600 или 1024х768) Так что предпочтите этому стандарту (в том случае если вы собираетесь свою работу потом печатать, а не только смотреть на экране монитора) разрешения 800х500, 1024х640, 2048х1280, 4096х2560. Имея такой кадр мы можем воспользоваться некоторыми заготовками, которые позволяют как сделать гармоничной композицию, так и акцентировать внимание зрителя. Все нижесказанное относится не только к архитектурной визуализации, но и вообще к композиции (пейзажа, натюрморта, и.т.п.).
Возьмем наш кадр, проведем линию из верхнего левого угла в правый нижний, а затем линию по направлению к точке Y (находится на расстоянии равной высоте кадра от левого нижнего угла) до пересечения с делящей на две части прямоугольник линией. Теперь Вам только остается запомнить вид прямоугольника состоящего из трех секторов. Этот прямоугольник можно поворачивать как угодно, но если вы скомпонуете свой кадр так, чтобы три разных объекта примерно располагались в этих секторах, то композиция будет выглядеть гармоничной. При архитектурной визуализации добавлять элементы антуража лучше держа в голове эту схему.

Другим примером использования правила «Золотого сечения» — расположение основных компонентов кадра в особых точках — зрительных центрах, Таких точек всего четыре, и расположены они на расстоянии 3/8 и 5/8 от соответствующих краев плоскости. Человек всегда акцентирует свое внимание на этих точках, независимо от формата кадра или картины.

Помимо формализованных подходов к композиции типа «золотого сечения», которые тут многими критикуются, как бездушный математический подход к красоте, есть ряд простых правил-советов, которые позволят избежать композиционных ошибок.
1. Основной объект изображения должен занимать бОльшую площадь в кадре, чем второстепенные. У зрителя не должно возникать вопросов, ради какого объекта сделано изображение.
2. Объект по-возможности должен помещаться в кадре целиком, если это по каким-то причинам невозможно, то часть, не попавшая в кадр, должна быть значительной (не меньше четверти объекта). Нет ничего более неприятного, чем объект, который чуть-чуть не поместился.
3. Обязательно в кадре должна быть земля и небо (исключением может быть только вид с птичьего полета, но и в нем присутствие неба и горизонта желательно)
4. Основной объект не должен упираться своей границей в край кадра. (Исключение можно сделать для высоких узких шпилей и прочих «заточек» их вполне можно упереть в край кадра)
5. Если в кадре присутствует элемент динамики (то есть структура изображаемого здания такова, что части его перетекают в друг друга с явным изменением размеров, масштаба, материалов и.т.п. вдоль какого-то одного направления), то ее желательно подчеркнуть антуражем (например, едущие в том же направлении автомобили) и в направлении движения в кадре оставить больше свободного места, как бы оставляя пространство для этого движения, а не останавливая его краем кадра.
6. Никогда не расставляйте элементы антуража (деревья людей и машины) глядя на план и тыкая куда не попадя. Лучше всего распечатать на бумаге «превью» вашего объекта и карандашом прикинуть пятнами (можно в соответствии с предыдущими моими советами) места расположения этих элементов. И только потом уже расставлять их… возможно даже не обращая внимания на то, могут ли они находится на этих местах в реальности… красивая композиция во многих случаях важнее.
7. Передний план очень важная часть изображения… красивый реалистично проработанный элемент на переднем плане (пусть это будет даже просто бордюрный камень и кусочек газона) придаст ощущение, что вся ваша модель проработана, что называется «до гвоздя».
8. Задний план так же важен. По большей части наблюдать горизонт в виде линии мы можем только на море или в пустыне, а подобные ситуации весьма редки в архитектурной визуализации… не поленитесь прикрыть линию горизонта деревьями или домами.
9. Воздушная перспектива придаст объем вашей композиции. Воздушная перспектива это снижение контраста и цветности предметов с удалением от точки наблюдения. То есть чем дальше, тем менее контрастно и цветно. Можно сделать или легким туманом или постобработкой в фотошопе. (для этого в качестве маски отлично подходит канал глубины)
10. В архитектурной визуализации не принято использовать эффекты глубины резкости (DOF)
11. Разница в проработке основного и второстепенных объектов или не должна бросаться в глаза, или второстепенные объекты должны быть сделаны нарочито условно (в линиях, полупрозрачные и.т.п.)

Теперь несколько слов о постановке света в экстерьерной архитектурной визуализации.
В большинстве случаев используется два источника света: солнце и небосвод. Цвет света от небосвода чуть холодноватый, от солнца гораздо ярче и тепловатый. В выборе направления, откуда светит солнце, есть 2 пути. Самый правильный путь это поставить солнце в положение полдня в день весеннего или осеннего равноденствия (20 -21 марта или 23 сентября), что составит для широты Москвы угол с землей около 34 градусов.
Сделать это точно можно путем установки Systems ->DayLight в3dмахе

Такой способ постановки солнца является «хорошим тоном» архитектурной визуализации, поскольку именно на эти дни делаются все расчеты инсоляции. Конечно, может оказаться, что такое положение солнца для выбранной вами точки зрения на объект совсем не выгодно. Тогда предлагаю действовать по второму пути. Это расположение направления распространения солнечных лучей под углом близким к 90 градусам к направлению взгляда и 45 градусов относительно земли.

В большинстве случаев это позволяет осветить одни грани и оставить в тени другие, что хорошо подчеркивает объемы объекта. (на рисунке1: 1 падающие тени от объекта, 2 собственные тени, падающие тени от элементов объекта на объект). Дурным тоном расположения солнца является его постановка за камерой в направлении взгляда камеры (похоже на съемку со вспышкой и убивает все падающие тени (смотри рисунок 2)) и расположение солнца на севере (в нашем полушарии) и на юге в южном полушарии.

Если вы делаете визуализацию фасадов здания (не перспективная, а параллельная проекция), то постановка солнца подчиняется абсолютно жесткому правилу. Оно должно светить слева сверху под 45 градусов к земле и к фасаду. И это уже не «правило хорошего тона», а закон. Поскольку человек, глядя на такой фасад, по размеру и форме теней сможет однозначно судить о глубине и форме ниш или выступающих элементов. А если распечатать такой фасад в масштабе, то и линейкой померив размер тени, можно узнать глубину выступов (“b” на рисунке) и ниш (“a” на рисунке). Далее пара слов о ночной визуализации.

Ночная визуализация несомненно один из самых эффектных способов архитектурной подачи. Особенно красиво выглядят здания с большим количеством остекления и наружной подсветкой. Поэтому для ночной подачи в большей степени подходят общественные и административные здания, нежели жилые комплексы и уж тем более коттеджи. Целью любой архитектурной подачи является создание у зрителя представления об объеме объекта и ночь для этого не самое подходящее время. Так что выбор ночной подачи должен быть продуманным. Наипервейшая ошибка, которую делают почти все – это решение изобразить кромешную ночь и объект осветить только при помощи искусственной подсветки снаружи. Если вы обратите внимание на действительно красивые ночные фотографии архитектуры, то вы увидите, что все они были сделаны не ночью, а вечером или во время захода солнца, или сразу же после него, когда небо еще светится красноватым или сиреневатым цветом. Удачным решением будет использование в качестве освещения HDRI такого вида (см. рис). При таком подходе, даже если на здании не планируется наружного освещения, донести до зрителя идею его внешнего вида весьма просто.

Вторая ошибка обычно связана с окнами и остеклением. Если днем стекло выглядит почти всегда темнее самого фасада (исключение блик на стекле, или если стекло почти зеркальное, ну или фасад из черного гранита) и проработка «нутрянки» здания по большей части не нужна, то для ночной подачи к тому, что мы увидим сквозь стекло нужно отнестись гораздо внимательней. Ужаснее всего выглядит, когда стеклу просто назначают непрозрачный самосветящийся материал… такой подход просто убивает все плюсы, которыми обладает ночной рендер. Стекло нужно оставлять прозрачным, источники света ставить внутрь здания и заботиться о том, чтоб им было что освещать. Стоя на земле через окна мы чаще всего видим потолки. Им и нужно уделить немного внимания (сделать разбивку на плитки подвесного потолка, развесить светильники и.т.п). Кроме этого не забудьте про шторы и жалюзи… при помощи их даже в самый монотонный фасад можно привнести жизнь. Относительно GI при ночном рендере, могу сказать, что 99% случаев достаточно считать только директ, а источниками света внутри здания подсвечивать только потолок. Если помещения внутри освещены лампами накаливания, то свет должен иметь оранжеватый оттенок, люминесцентные ламы дают зеленоватый свет. Цвет света приборов наружного освещения бывает весьма различным… практически весь спектр от синего до красного. Если присутствуют движущиеся элементы антуража (люди, машины), то хорошей идеей будет имитация фотосъемки с длинной выдержкой и как следствие сильное размазывание этих элементов. Следы от фар проезжающих автомобилей в виде протяженных ярких линий выглядят очень эффектно. Мачты уличного освещения изображением, которых при дневной подаче можно пренебречь, ночью становятся хорошими дополнительными источниками света. Ну и конечно яркие светильники в ночное время имеют ярко выраженный «глоу», который лично я просто дорисовываю в фотошопе. В приложенной картинке пара моих (неплохих, на мой взгляд) работ на эту тему. Далее я планирую немного рассказать о фотомонтаже и цветокоррекции.

Теперь немного поговорим о фотомонтажах. Под фотомонтажом в архитектурной визуализации подразумевается совмещение трехмерной модели архитектурного объекта с фотографией его предполагаемого места постройки. Для того чтобы подобная задача была решена грамотно и красиво, прежде всего, требуется качественная фотография места событий. Сделать красивый монтаж в фотографию сделанную мыльницей на бегу – задача маловыполнимая. Для начала правильно выберете время фотосъемки. Прикиньте, в какое время солнце будет наиболее правильно освещать ваш объект. Советы по выбору этого времени аналогичны постановке света рассмотренной ранее, с одной оговоркой, что солнце вы подвинуть не сможете, а посему правильный выбор времени съемки – ключ к успеху. С точки зрения мягкости света и красоты цветовой гаммы наиболее удачным временем являются утренние и вечерние часы (1 час после восхода солнца и 1 час перед заходом), а так же время сразу после захода солнца. Я не буду останавливаться на том, каким оборудованием производить съемку (у кого что есть, тем и снимаем), но делать это со штатива – обязательно (особенно в вечерних сумерках). На большинстве штативов есть уровни, которые позволят вам направить камеру точно параллельно земле, чтоб избежать завалов вертикалей. Чтоб изображение получалось более четким – пользуйтесь ультрафиолетовым светофильтром и наоборот не используйте его, если хотите передать атмосферные явления типа дымки или тумана. Поляризующий фильтр поможет вам отрегулировать отражения в стеклах соседних зданий от почти зеркального до почти прозрачного. Старайтесь снимать с максимально закрытой диафрагмой, что помимо высокой четкости даст вам возможность использовать более длинные выдержки, которые «размажут» второстепенные движущиеся объекты вроде машин и людей. Обязательно отметьте на генплане точку, с которой велась съемка и фокусное расстояние объектива (для цифровых камер последнего поколения делать это не обязательно, информацию о фокусном расстоянии всегда можно посмотреть в EXIF расширении файла). Впоследствии это поможет вам в совмещении 3d модели и фотографии. Прежде чем приступать непосредственно к фотомонтажу постарайтесь «вытянуть» из полученного фотоматериала максимум качества. Не стесняйтесь пользоваться фотошопом. Выправьте «падающее» вертикали. Иногда это проще сделать уже после монтирования.

Итак – алгоритм действий для изготовления качественного фотомонтажа.

1. Распечатываем генплан участка снимаемого объекта с прилегающей территорией
2. Намечаем точки съемки (если объект большой это позволит сэкономить кучу времени при съемке)
3. Прикидываем время дня, когда солнце будет освещать основной фасад здания.
4. В идеале трижды выезжаем на съемку: во время прикинутое в предыдущем пункте, рано утром сразу после восхода солнца и вечером на закате.
5. В процессе съемки идем по намеченным точкам, а так же по месту ищем удачные ракурсы. Не стесняемся залезать на столбы, трансформаторные будки, дорожные знаки, а так же в подъезды близлежащих высотных домов для съемки из окон лестничных клеток.
6. Все отснятые точки отмечаем на генплане с пометками о фокусном расстоянии объектива и высоте, на которую вам удалось залезть.
7. Снимаем панораму на 360 градусов – пригодится как текстура отражений для стекла.
8. Прикидываем высоту окружающих построек (считаем этажи, у кирпичных домов считаем кирпичи) – это пригодится для проверки правильности установки виртуальной камеры
9. Распечатываем, сканируем, сливаем фотографии.
10. Выбираем удачные кадры, если надо собираем панорамы из нескольких кадров.
11. Чистим мусор – пятна, провода, растительность и.т.п.
12. Делаем начальную цветокоррекцию
13. Выбираем, каким кадрам сделать коррекцию перспективы сразу, а каким после монтажа. (Обычно если нужна совсем маленькая коррекция я ее делаю сразу, если большая оставляю на потом)
14. Строим модель, выдавливаем окружающую застройку, расставляем камеры, используя записи из пункта 6
15. Ставим солнце аналогично ситуации на фото.
16. Рендерим в формат с альфаканалом.
17. Рендерим маску для стекла (стеклу назначаем материал Matte\Shadow c галкой affect alfa, а всему остальному без этой галки и рендерим сканлайном)
18. Открываем в фотошопе фотку
19. Открываем рендер, делаем выделение по альфаканалу и копи-пастом вставляем в фотку.
20. Сажаем объект на место, масштабируем если надо (объект в отдельном слое).
21. Делаем цветокоррекцию фотки и объекта по отдельности а так же коррекцию резкости.
22. Выделяем на фотке элементы переднего плана и создаем из них отдельный слой поверх слоя объекта.
23. Играемся со стеклом при помощи маски из пункта 16
24. Сплющиваем слои и делаем коррекцию перспективы если мы ее не сделали в пункте 12
25. Окончательная цветокоррекция и добавление эффектов (например глоу ярко освещенным местам)
26. С чувством выполненного долга идем за пивом

Долго я к этому шел и, наконец, настало время интерьеров. Почему сложилось так, что подходы к архитектурной подаче интерьеров и экстерьеров различны? (Сразу оговорюсь, что некоторые интерьеры, например атриумы и вестибюли общественных зданий, спортивные сооружения и.т.п. по подходам к подаче гораздо ближе и экстерьерам, нежели к интерьерам). Этому есть несколько причин.
Первая причина, скорее всего, кроется в разной социальной значимости архитектуры наружной и внутренней. То есть наружная архитектура более социально значима, поскольку обращена в окружающее пространство, взаимодействует с архитектурной средой окружающей объект и доступна для восприятия гораздо большим количеством людей, эстетическим понятиям которых, оно должно импонировать, дабы не быть объектом общественного недовольства (как, например памятник Петру Первому в Москве). Интерьер же в, большинстве случаев, предназначен для относительно небольшой группы людей и может быть архитектурно никак не связан с окружающим его миром.

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

Третья причина в принципиально разной топологии наружной и внутренней архитектуры.

Рассмотрим, как эти причины отражаются на приемах архитектурной подачи.
Из первой причины следует, что хорошая подача экстерьера должна включать в себя элементы окружающего мира, а в идеале быть качественным фотомонтажом проектируемого объекта в фото реального окружения. Если по какой-то причине достаточно точное воспроизведение окружения невозможно, то элементы антуража (люди, машины, деревья) должны присутствовать, дабы сделать понятным реальные размеры сооружения. В интерьере же, особенно частном, подобные элементы могут вызвать у заказчика подсознательное отторжение (а чего это делает незнакомый мужик в моей будущей спальне? а почему машина в гараже не моя? и.т.п.) Этот же подход вытекает и из второй причины. Если для элементов антуража экстерьера подходят такие предметы как люди, машины, деревья, то для интерьера нужны элементы более мелкого масштаба (посуда, книги, цветы и.т.п.). Из первой причины так же вытекает необходимость «идеализации» экстерьерной подачи. Здание должно выглядеть идеальным, абсолютно новым, никакого присутствия человеческой деятельности (типа открытых окон и дверей, кондиционеров и спутниковых тарелок на фасадах и.т.п.) присутствовать не должно. Книжку Билла Флеминга о фотореализме положите на полку, когда вы занимаетесь визуализацией архитектуры. В ночной же подаче будьте крайне осторожны с желанием где-то включить, а где-то выключить свет в окнах вашего дома. Из того, что мне доводилось видеть, хорошо это выглядело только на небоскребах.
И наоборот, следы присутствия людей в интерьере дают возможность его оживить.
Смятое покрывало, одежда на вешалке, чашка кофе, газета, пульт от телевизора создают ощущение, что тут живут люди, просто они не надолго вышли… Для подачи частного интерьера это важно. А уж если присутствует антиквариат, то смело доставайте Флеминга.
Ну и последнее. Третья причина приводит к тому, что во многих случаях, что бы представить себе архитектуру экстерьера здания достаточно одной картинки, интерьер же состоит из большого количества помещений, для каждого из которых потребуется отдельная картинка. Кроме того, форма и размер помещений могут быть таковы, что закон борьбы с третьей точкой схода или отказа от использования сферических проекций, придется отменить. Мало того, иногда нам придется использовать точки зрения, не существующие в природе даже теоретически. Обо всем этом на примерах мы и будем говорить далее.

На этом статья (временно?) приостановлена 🙁 Остается надеяться на продолжение.

Валентин Прянишников.

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

Каждый фотограф сталкивается с проблемой широкого динамического диапазона, и архитектурные фото не являются исключением, хотя они и требуют зачастую лишь 3-х кадров. Но фото, приведенное в примере, потребовало 9-ти снимков-исходников с брекетингом экспозиции -2, 0 и +2. Также многие фотографы делают заведомо большее количество кадров, чтобы избавиться от людей на снимках.

Несколько советов:

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

Камера

Для архитектурных снимков хорошо подходят камеры типа Canon 5D Mark II, который в совокупности с, например, тилт-шифт объективом 17mm TS-E дает прекрасный результат. Неплохо иметь с собой и пару запасной оптики. В случае, если последняя линза вашего объектива впуклая и ограничивает возможность применения фильтра, на помощь придет брекетинг экспозиции.

Компьютер и монитор

Компьютер должен быть мощным, обладающим достаточным количеством оперативной памяти (неплохо иметь около 24 гб), ведь RAW снимки порой «весят» до гигабайта. Монитор калибруется перед любой серьезной корректурой для наилучшей цветопередачи и, как следствие, объективно оценки изображения.

Импорт изображений

Для импорта многие любят использовать Lightroom, iPhoto, Picassa и другие приложения, однако профессионалы предпочитают полный контроль над ситуацией, чего и добиваются ручным импортом изображений.

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

Отбор фотографий

Хорошей рабочей лошадкой многих профессионалов является Adobe CS5. Предпросмотр же наиболее удобен в Bridge, где справа отмечены среди всех выбранные вами файлы, а слева при помощи фильтра можно вывести отдельно выбранный материал.

Camera Raw

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

Еще немного советов:

  • Проверьте, что работаете в том же цветовом пространстве, что и в камере. Чаще используется Adobe RGB. Используйте максимально качественные исходники, переконвертировать в нужный вам формат можно и потом;
  • Редактируйте в режиме 16 бит;
  • Выставите баланс белого по наиболее удачно экспонированной фотографии;
  • При горячих пикселях поможет ползунок «Возврат» (Recovery). При нажатии сочетания + при перемещении ползунка вы увидите пиксели на черном фоне;
  • Если вы были вынуждены слишком сильно выдвинуть ползунок возврат, компенсируйте это выдвижением «Экспозиции»
  • Подобный алгоритм используйте и при работе с уровнем черного, чтобы не было вылетов
  • Выделив после вышеописанных манипуляций все снимки синхронизируйте баланс белого на них с помощью меню
  • Последним шагом станет открытие всех изображений в фотошопе.

Работа в Photoshop

Алгоритм ретуши в фотошоп довольно несложен. Итак:

  • Объединяем изображения с брекетингом экспозиций в одно
  • Состыковываем изображения, составляющие панораму
  • Сохраняем в формате psd наш результат
  • Используем маски для обработки отдельных частей фото дополнительно
  • Сохраняем изображение со всеми слоями
  • Объединяем сиев, при необходимости - кадрируем
  • Работаем с резкостью
  • Сохраняем новую версию в psd под другим именем
  • Изменение до нужного размера
  • Преорбазуем пространство в srgb, а глубину меняем на 8 бит
  • Сохраняем в растровом формате, используем свои обозначения для удобства

Ручное смешивание слоев

Для начала вставим в один проект все кадры, экспонированные по-разному. Используя Файл - Скрипты- Загрузить файлы в стэк (File > Scripts > Load Files Into A Stack) можно сделать это автоматически.

Не стоит бояться выделения и работы с масками! На примере показан инструмент быстрого выделения. Оно поначалу неточно, потому стоит откорректировать область выделения следующим образом: жмите на кнопку «Уточнить край» (Refine Edge), в контекстном меню Просмотр» (View) в верхней части диалога «Уточнение края» выберем «Наложение» (Overlay). Так включается использование красной маски, удобной для просмотра как выделения, так и не вошедшей в него области.

При помощи кисти (Refine Radius Tool brush) вручную уточним край выделения, смело пройдясь по нему курсором с кистью. Жмем ОК.

Создаем маску нажатием «Добавить векторную маску» (Add Vector Mask). В окне диалога видим появление черно-белой миниатюры. Черное невидимо, а все остальное пропускает изображение соответствующего слоя. Подобные маски создаем для всех элементов фото, с которыми будем работать. Во избежание чрезмерной жесткости снизим прозрачность различных слоев. Это еще и прибавит гибкости нашему методу работы с динамическим диапазоном изображения.

Сохраняем верно, на ваш взгляд, экспонированную версию вашего снимка с предварительным объединением слоев в меню «Слои -> Объединить слои» (Layer > Flatten Image) и сохраните как документ Photoshop.

Работа с цветом и контрастом

Здесь для примера используется уже другой снимок. На нем можно явно увидеть разницу корректированного и исходного RAW снимка.

Обработка целого кадра вместе с улучшением цвета и контраста в одной его части привела бы к ухудшению ситуации в другом.

Создадим маски-слои:

  • Выделяем нужную часть основного слоя
  • Корректируем край выделения
  • Копируем выделение
  • Вставляем в качестве нового слоя, обозначив понятным названием
  • Таким же способом создаем несколько слоев

Насыщенность

Выбираем рабочий слой. Добавляем корректирующий слой (см. картинку) для работы с цветовым тоном и насыщенностью. Чтобы не выйти за рамки нашего слоя, обязательно нажмите «Использовать предыдущий слой для создания обтравочной маски»(Use Previous Layer to Create Clipping Mask). Дайте простор фантазии, можете использовать фильтры, для придания теплоты и пр.

Для работы с контрастом можем добавить слой кривых. Удобно использовать параметр «Сильный контраст (RGB)» (Layer > New Adjustment Layer > Curves… - select " Strong Contrast (RGB)).

Корректирующие слои, применяемые к одному изображению, удобно свести в группу при использовании «Группировка слоёв» (Layer > Group Layers). Включая и выключая эту группу можно воочию увидеть эффект ваших манипуляций. Совет: Если добиваетесь корректировки экспозиции на стоп - добавьте слой кривых с непрозрачностью (opacity) окооло 38%. Чтобы добавить стоп установите режим наложения «Осветление» (Screen), а для уменьшения - «Умножение» (Multiply).

Используем рассмотренный выше алгоритм для всех интересующих нас слоев.

Урок Фотошопа

Урок Фотошопа

Урок Фотошопа

Фотошоп уроки фото

Фотошоп уроки фото

Выравнивание

Тут существует лишь 2 метода: линейка, или же меню «Правка» - «Изменение» - «Поворот» (Edit > Transform > Rotate).

Кадрирование

Резкость

  • дублировать изображение
  • к копии применить фильтр цветового сдвига с радиусом, к примеру, 1.0. последовательнсть команд «Фильтры» - «Другие» - «Цветовой сдвиг» (Filter > Other > High Pass).
  • установить режим Наложения.

Сохранение

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

Алгоритм ниже:

«Изображение» - «Режим» - «8 бит/канал» (Image > Mode > 8 Bits/Channel)

«Правка» - «Преобразовать в профиль» (Edit > Convert to Profile)

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

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

Фотография выше потребовала 9 фотографий - с брекетингом экспозиции -2, 0 и +2, а также дополнительно серии для нижней половины комнаты и для потолка. Дополнительные снимки также помогают мне избавиться от людей в кадре.

Вы должны не забывать...

  • Снимать в RAW чтобы сохранить максимальную гибкость исходников; мы же не спортивные фотографы, делающие поток снимков, где JPEG гораздо более уместен.
  • Держитесь низкого уровня ISO.
  • Используйте одну настройку баланса белого для всей серии фотографий.
  • Используйте самый тяжелый штатив и пульт дистанционного спуска, проводной или беспроводной.

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

Основная камера

С задачами по архитектурной и пейзажной съемки замечательно справляется моя камера Canon 5D Mark II с тилт-шифт объективом 17mm TS-E. Я применяю брекетинг экспозиции во многом потому, что передняя линза моего объектива выпуклая и не позволяет использовать фильтры. В своей сумке также всегда есть объективы EF24 f/1.4 и EF50mm f/1.2. Мой штатив немного странный - ноги Gitzo с шаровой головой Manfrotto.

Компьютер и монитор

Всю работу с изображениями я провожу на двухъядерном Mac Pro с 24 гигабайтами оперативной памяти. Я часто работаю с изображениями более гигабайта, так что большой бъем оперативной памяти - необходимость. У меня монитор Dell 27″ Ultrasharp, который калибруется с помощью Spyder 3 Elite.

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

Импорт изображений

Я понимаю, что многие из вас используют различные автоматизаторы, такие как Lightroom, iPhoto, Picassa и другие. Называйте меня луддитом, но я ненавижу оставаться без контроля над процессом, поэтому я использую полностью ручную процедуру импорта.

На локации я сливаю фотографии на 2 жестких диска и по возвращении копирую около 100 гигабайт информации за один раз в заранее приготовленное место. Изображенная слева структура папок служит мне верой и правдой вот уже 10 лет.

Вы можете заметить, что мои готовые файлы имеют в префиксе размер в пикселях для разных сайтов; на 500px - шириной 900 пикселей, а для 1x.com - 950 пикселей. Я также добавляю «bw» в имена файлов с черно-белыми изображениями. Это система наименований облегчает поиск на жестком диске нужных изображений.

Отбор

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

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

Camera Raw

Если вы похожи на меня, то все установки вашей камеры выключены или установлены в 0. Здесь, в Camera Raw, я делаю несколько установок для всех фотографий, предназначенных для составления одного изображения.

  • Убедитесь, что вы импортируете ваши фотографии в том же цветовом пространстве, как и в камере. В моём случае это Adobe RGB, которое шире, чем стандартное для интернета sRGB. Работайте с максимально качественным исходником, а затем конвертируйте в целевой формат, например для интернета.
  • Редактируйте фотографии в режиме 16 бит
  • Выберите лучший и самый правильно экспонированный кадр и установите по нему баланс белого
  • Если присутствуют горячие пиксели, для их компенсации используйте ползунок «Возврат» (Recovery). Нажмите одновременно + во время его перемещения и вы увидите положение этих точек на черном фоне!
  • Если ползунок «Возврат» пришлось подвинуть слишком сильно - компенсируйте это ползунком «Экспозиция», вновь нажав одновременно +.
  • Эту же комбинацию можно использовать при коррекции уровня черного - поднимайте уровень черного так, чтобы не было вылетов.
  • Затем выделите все изображения и синхронизируйте баланс белого для всех изображений в серии через меню в левом верхнем углу.
  • Затем откройте все изображения в Photoshop

Работа в Photoshop

У меня довольно строгое рабочее пространство в Photoshop и процесс редактирования довольно прост.

У меня есть ряд действий (actions) под разные задачи, типа изменения размера, цветового пространства и т.п. Отдельные выполняемые мной задачи можно разделить следующим образом:

  • Объединение изображений с брекетингом экспозиции в один слой
  • Состыковка составляющих панораму изображений
  • Сохранение составленного изображения в файл формата Photoshop PSD
  • Использование масок для выделения частей изображения, требующих отдельной коррекции цвета, контраста или экспозиции. Примером может быть обработка неба отдельно от здания на переднем плане
  • Сохранение этого изображения со всеми созданными слоями
  • Объединения слоев и кадрирование при необходимости
  • Усиление резкости
  • Сохранение новой версии готового изображения в формате Photoshop PSD
  • Изменение размера под целевое использование, например до 900 пикселей для 500px.com
  • Преобразование в цветовое пространство sRGB и глубину цвета 8bit
  • Сохранение в формате JPEG. Не забудьте добавить префикс "900px" к имени файла для облегчения поиска в дальнейшем.

Ручное смешивание слоев

Во-первых, поместите ваши по-разному экспонированные кадры в один проект в виде слоев. Вы можете сделать это автоматически через меню Файл - Скрипты- Загрузить файлы в стэк (File > Scripts > Load Files Into A Stack).

Многие пользователи Photoshop побаиваются использования масок, выделения и т.п., но на самом деле это довольно просто. Я покажу!

Выберите инструмент для выделения на свой вкус. Я использовал инструмент «Быстрое выделение» (Quick Selection tool), отмеченный слева на рисунке. Затем для добавления выделения нажимайте , а для удаления - . Как видите, я выделил верно экспонированный купол станции метро Кэнэри-Уорф.

Это выделение очень неровное и будет лучше если мы сделаем его более гладким и элегантным. Для этого нажмем на кнопку «Уточнить край» (Refine Edge), также отмеченную в верхней части картинки сверху.

Красная маска очень удобна для просмотра выделенного и невыделенного, но требуется включить эту опцию. Кликните по выпадающему меню «Просмотр» (View) в верхней части диалога «Уточнение края» и выберите «Наложение» (Overlay).

Мы используем кисть (Refine Radius Tool brush), обозначенную слева. Она позволит нарисовать край выделения и Photoshop уточнит границы того, что должно и не должно быть выделено.

Увеличьте размер кисти в опции «Размер» (Size) и щедро «закрасьте» пространство у границы. Пройдитесь вдоль всех границ!

Край маски выглядит гораздо более градиентным теперь! Нажмите «OK» для сохранения этого выделения.

Теперь нам нужно создать маску слоя. Маска сделает часть слоя видимой, а другие части - невидимыми.

Нажмите кнопку «Добавить векторную маску» (Add Vector Mask), обозначенную на рисунке.

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

Я продолжил работу и повторил операции по созданию маски для эскалатора и окружения купола, как можно увидеть на рисунке ниже. Слои при 100% видимости слишком жёсткие, так что я снизил прозрачность слоя с куполом до 80%, а слоя с эскалатором и окружением купола - до 70%. Это занимает чуть больше времени, но является очень гибким методом представить широкий динамический диапазон кадра.

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

Объедините ваши по-разному экспонированные слои через «Слои -> Объединить слои» (Layer > Flatten Image) и сохраните как документ Photoshop. Теперь у вас есть правильно экспонированная версия вашего кадра. База, к которой можно вернуться. Это полезно, если вы затем захотите преобразовать фото в черно-белое.

Редактирование: цвета и контраст

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

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

Создание слоев изображения с использованием масок.

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

Я покажу мой процесс обработки цвета и контраста на примере песка.

Насыщенность

Выберите слой, который вы будете редактировать. Я выбрал слой «Песок». Добавляем корректирующий слой «Цветовой тон/Насыщенность» как на картинке.

Поставьте галочку напротив (Use Previous Layer to Create Clipping Mask) чтобы ограничить ваши правки только слоем «Песок». Вы получите новый слой с небольшой стрелкой, направленной вниз, чтобы отобразить это.

Я выбрал предустановленную опцию «Больше увеличить насыщенность» (Increased Saturation More)

Песок должен стать тепло оранжевым, так что я добавлю еще один корректирующий слой - Фото фильтр (Layer > New Adjustment Layer > Photo Filter), выбрав сначала слой «Песок» и не забыв галочку «Использовать предыдущий слой для создания обтравочной маски» (Use Previous Layer to Create Clipping Mask).

Я выбрал «Теплый фильтр» (Warming Filter) (85), установив его плотность на 50 для более полного эффекта.

Наконец, я добавил слой кривых для контраста. Выберите слой «Песок» и из уже знакомого меню добавьте слой кривых с параметром «Сильный контраст (RGB)» (Layer > New Adjustment Layer > Curves… - select " Strong Contrast (RGB))

В этом месте следует сделать сохранение файла со всеми слоями в формате Photoshop Document.

Выравнивание

У меня есть 2 способа. Использование линейки, изображенной слева, очень удобно и быстро. Достаточно выделить важную горизонтальную или вертикальную линию в изображении. Либо это можно сделать с помощью режима поворота - «Правка» - «Изменение» - «Поворот» (Edit > Transform > Rotate)

Кадрирование

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

Резкость

По вопросу выбора лучшего метода повышения резкости сломано множество копий и я лично перепробовал наверное все методы, но на мой взгляд самым элегантным методом является метод цветового сдвига «High Pass filter». Результат резок, но без артефактов и неровностей. Усиление резкости после изменения размеров я не делаю.

  • Дублируете слой через «Изображение» - «Дублировать» (Image > Duplicate)…
  • Примените фильтр цветового сдвига. Радиуса 1.0 достаточно для хорошо сфокусированного изображения порядка 10-20 мегапикселей. «Фильтры» - «Другие» - «Цветовой сдвиг» (Filter > Other > High Pass)…
  • Установите режим смешивания в «Наложение» (Overlay).

Сохранение

«Объединить слои» в меню «Слои» (Layer > Flatten Image) и сохранить как новый документ Photoshop с соответствующим именем.

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

Изменение размера

Я уменьшаю файлы JPEG до различных размеров для Блогов, Фликера, сайтов 500px и 1x, а также для конкурсов.

Сохранение

Окончательное сохранение в JPEG требует преобразования в цветовое пространство sRGB и глубину цвета 8 бит. Эти атрибуты стандартны для сети Интернет. Если вы этого не сделаете - ваши изображения просто не будут у других людей выглядеть также как вы подготовили их на своем компьютере.

  • «Изображение» - «Режим» - «8 бит/канал» (Image > Mode > 8 Bits/Channel)
  • «Правка» - «Преобразовать в профиль» (Edit > Convert to Profile)…

Вот и всё, таков в общих чертах мой процесс обработки фотографий.

Я собираюсь подготовить часть 3, посвященную профессиональной конвертации в черно-белый, так что следите за обновлениями!