Уроки Photoshop CS2 :: Уроки фотошопа :: Уроки adobe photoshop :: Регулярные пополнения базы уроков » Как создать блестящую супер-иконку в стиле Веб 2.0

Важно! Создание прибыльных веб сайтов и поисковое продвижение сайтов в Москве: веб-компания StudioForYou!

Как создать блестящую супер-иконку в стиле Веб 2.0

24.09.2007Категория урока: Кнопки и Иконки

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

Как создать блестящую супер-иконку в стиле Веб 2.0

Приблизительное время выполнения: 5 минут

Создайте новый документ 600х300 с белым фоном. Инструментом Ellipse нарисуйте круг на новом слое и назовите его “иконка фон”. Примените к слою следующие стили:

web2_icon_2.gif

web2_icon_3.gif

web2_icon_4.gif

web2_icon_5.gif

web2_icon_6.gif

Вот, что у Вас примерно должно получиться:

web2_icon_7.gif

Создайте новый слой и выделите на нем похожую область:

web2_icon_8.gif

Заполните ее белым цветом и примените Filter > Blur > Gaussian Blur:

web2_icon_9.gif

Установите непрозрачность этого слоя до 50%

web2_icon_10.gif

Создайте слой, выберите слой “иконка_фон” и выделите на нем область как на рисунке ниже. Залейте ее белым цветом:

web2_icon_11.gif

Создайте еще один слой и выделите на нем область по форме, как видно на рисунке ниже. Заполните ее белым цветом и уменьшите непрозрачность слоя до 25%

web2_icon_12.gif

Теперь добавьте любую иконку и текст на свой вкус

web2_icon_13.gif

Сейчас давайте создадим простое отражение. Скопируйте все слои, кроме фонового. Выделите все эти копии в панели слоев и нажмите CTRL+E, чтобы слить их в один. Отразите слой вертикально Edit > Transform > Flip Vertical. Расположите получившуюся картинку под имевшейся иконкой. Создайте на этом слое маску и залейте ее градиентом, чтобы убрать часть отражения

Как создать блестящую супер-иконку в стиле Веб 2.0

Готово! ;)

Вот еще пара примеров:

web2_icon_14.gif

web2_icon_15.gif

Источник: Design a Web 2.0 Style Icon

+news2.ru +ВааУ.ru +newsland.ru +СМИ2.ru +del.icio.us +bobrdobr.ru +memori.ru +RUmarkz +Mister Wong +Мое Место

Похожие уроки photoshop: