Карамельный техдизайн. Как обрабатывать картинки.

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

Простой алгоритм обработки любого предмета:

1. Смотришь, что нравится. Причем, нужно смотреть не на то, что есть сейчас, а на то, что МОЖЕТ появиться в результате обработки этой картинки (для этого нужно либо подключить воображение, либо иметь богатую практику).
2. Ищешь явные ошибки, которые ты будешь исправлять, и мелкие погрешности, которые тоже не мешало бы подрихтовать.
3. Отрисовываешь заново ВСЕ пиксели (карамельная графика обычно получается только в этом случае).
4. Добавляешь спецэффекты: отражения, рефлексы, блестелки и т.д.
5. Смотришь пункт 1. Если ты не нашел неисправностей, работа готова.


На что нужно смотреть:

• Битые пиксели и пятна. Можно исправить кисточкой и/или заливкой под увеличением.
• Кривые плоскости. Выравниваются заливкой или градиентом. Выделяешь очертания — и вперед. На примере граней коробки (см. пример ниже) это видно лучше всего.
• Шумы. С легкостью лечатся blur tool (надо выбирать кисть с жесткими краями). Нужно немного поэкспериментировать с этой кистью, чтобы добится нормального эффекта.
• Цветные шумы и аномалии. Правятся с помощью вспомогательного слоя в режиме color непосредственно над исходным слоем. Создаешь слой (blending mode = color), ctrl+alt+g, и рисуешь на нем любым цветом.
• Jpg-артефакты аннулируются тем же методом.
• А вот чтобы исправить неправильный свет, придется перерисовать картинку полностью
• Края лесенкой (алиасинг). Отрисовываются мягкой кистью под большим увеливением. Способ номер два — polygonal lasso tool и заливка.
• Все остальное, в общем-то, можно исправить полной отрисовкой каждой поверхности сообразно направлению и силе света.


А теперь то же самое, но на человеческом примере.

Мне дали на растерзание картинку, которая отлично подходит для экспериментов. На ней есть и плоскости, и объемы, и рефлексы, и даже чуть-чуть отражений. Мне понравились композиция (если ее немного исправить, будет хорошо) и сочетание цветов (оно рискованное, но можно попробовать добиться чего-то вкусного). А вот то, что мне не понравилось:

...и что еще неплохо бы исправить:

Я частично принес в жертву качество результата, чтобы процесс стал понятней*. Поехали:

00. Дано: на одном слое наскоро вырезанная коробка, на втором — белый фон. Все лишнее (например, блики и тени) нужно удалять сразу и без колебаний.

01. Я выделил хвостик, создал новый слой и сделал clipping mask (альт-тык*). Теперь его можно спокойно закрасить любым цветом, не боясь вылезти за его пределы. И с краями тоже все будет отлично*. По возможности, так нужно поступать с каждым объектом.

02. Я подобрал два цвета (зелено-желтый для тени и салатовый для освещенных участков) и зарисовал хвостик на слое «layer 1». Маленькая хитрость: если с краями что-то не так (вылезают пиксели или он просто криво отрезан), их можно подкорректировать кистью цвета фона. Это визуально сгладит неровности лучше, чем polygonal lasso tool. Можно зажать шифт и пройтись по всем краям, щелкая кистью. Я часто применяю этот прием, когда знаю, что цвет фона не будет меняться.

03. Вот как выглядит хвостик теперь.

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

05. Как ведет себя свет на стыках, описывают несколько неплохих кубиков с гномона и мой собственный пример*. Объекты, которые находятся дальше от нас, менее контрастны. В нашем случае зеленый на гранях становится светлее. Места, которые потом сложно будет переделать, советую обрабатывать сразу на 100%. Поскольку эта коробка (наверняка) не хранится в палате мер и весов, можно допускать где-то творческие неточности. Вот так оно смотрится теперь.

06. Теперь перец. Я постарался как можно точнее выделить его по контуру и нажал ctrl+j (продублировал выделенную часть на новом слое). Потом я снова нажал ctrl+j, но уже без выделения, и нажал ctrl+alt+g*. Я подправил цвета, затемнил нижнюю часть, высветлил блики и немного размыл их снизу жесткой кистью (blur tool).

07. Осталось залить ближние к нам стороны коробки точно так же, как и дальние.

08. Теперь коробку нужно поставить на пол...

09. ...и добавить вокруг легкую тень. Я воспользовался кистью с 5% opacity.

10. Осталось добавить падающую тень. Вместо того, чтобы строить ее по всем правилам, я просто начертил polygonal lasso tool правдоподобную и немного размыл у края...

11. ...а потом размыл еще сильней, чтобы ее кривизна не бросалась в глаза, а выглядела естественной.

12. По идее, коробка должна быть слегка металлической. Неполированный метал отличают сильные рефлексы. Я воспользовался этим и высветлил нижние части граней, которые «смотрят» на белую поверхность*.

13. Добиваем упущенное #1: на перце не хватало отражения от крышки и стенок.

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

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


16. Я немного поработал с задней стенкой — добавил рефлекс и случайный блик*.

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

18. Добиваем упущенное #2: добавлена случайная тень. Уголок коробки исправлен.

19. Красный цвет получился слишком ярким, пришлось исправлять.

20. Кистью нарисованы блики. С помощью dodge tool (highlights) высветлено их окружение. Почти все готово.

21. Осталось добавить светлый рефлекс на полу и подписаться.

Вот теперь действительно все.

А вот так выглядит вся последовательность целиком:
ссылка

Автор — pajasu
ссылка
Любые вопросы можно задавать здесь.
_____
* Более подробная версия со всеми комментариями — ссылка

Слуш , а я таким же методом пользуюсь :P

А можно вопрос? Почему рефракция от перца (или это вишня?) на внутренней поверхности крышки есть, а на остальных внутренних поверхностях нет?

На коробке есть только одно место, где не хватает рефлекса )

Сдается мне что вы неправы Но не буду спорить. Можно конечно в максе отрендерить и посмотреть...

Алгоритм не об этом.

Да, это я так - повыпендриваться На самом деле очень полезный туториал.
А в максе все таки отрендерил... :P Мы все ошибались При таком ракурсе, и расположении перца рефлекс будет только на дне коробки. :P

Что такое кармельный дизайн, покажите пожалуйста пример!!