Интерфейсные тени в Фотошопе

Источник: ilyabirman
ilyabirman

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

Кнопка с эффектом дроп-шадоу

Смысл эффекта - плашка по форме объекта кладётся под него, размывается и сдвигается. Вот какие параметры выставлены у этой тени:

Параметры эффекта дроп-шадоу

Чтобы тень была интереснее не обязательно звать техдизайнера: группа параметров Quality позволяет добиваться намного лучших результатов.

Во-первых, контур. Его можно гнуть:

Контур тени в Фотошопе

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

В комплекте с Фотошопом идут какие-то совершенно невменяемые контуры, дискредитирующие саму эту фичу (речь о первых двух строчках):

Контуры тени в Фотошопе

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

Контур тени в Фотошопе

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

Во-вторых, шум. Шум просто стоит добавить на уровне 2-3%:

Шум у теней в Фотошопе

С такими контуром и шумом кнопка получится уже вот такая (остальные параметры те же):

Кнопка с улучшенным эффектом дроп-шадоу

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

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


Страница сайта http://test.interface.ru
Оригинал находится по адресу http://test.interface.ru/home.asp?artId=35517