Главная
Блог разработчиков phpBB
 
+ 17 предустановленных модов
+ SEO-оптимизация форума
+ авторизация через соц. сети
+ защита от спама

Рисуем иконку рейтинга

Alex | 5.03.2014 | нет комментариев

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

 

Выберите polygonal lasso tool. Установите feather на 0 и сделайте выделение как на рисунке:

Создайте новый слой, нажав shift+ctrl+n, и залейте выделение цветом #D6D6D6.

Теперь снимите выделение. Воспользуйтесь dodge tool (Range: Highlights и Exposure: 20). С помощью мягкой кисти размером 40 пикселей нарисуйте полосу вверху и внизу фигуры. Это придаст блеск как на рисунке:

Примените следующие стили слоя:

У вас получиться следующее:

Теперь нарисуйте звезду цветом #F6B54D. Это фигура из списка custom shapes tool.

Примените следующие стили слоя:

Звезда получилась не обычная, а золотая:

Дублируйте слой несколько раз и поместите дубликаты как на рисунке:

Нарисуйте линию светло серого цвета и ниже белую линию толщиной в 1 пиксель на новом слое:

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

Нарисуйте круг с помощью ellipse tool:

Примените gradient overlay:

Также добавьте stroke цветом #AF0600 и размером 1 пиксель:

Ctrl+клик по слою, чтобы загрузить выделение. Создайте новый слой и залейте выделение белым цветом:

С помощью eraser tool сотрите часть слоя как на рисунке. Это придаст глянец кнопке:

Напишите 1. я использовал шрифт Arial Black:

Добавьте текст:

Снова с помощью polygonal lasso tool сделайте выделение как на рисунке:

Создайте новый слой и залейте выделение черным цветом. Поместите слой ниже других слоев в палитре слоев:

Теперь примените те же стили слоя, что и к кнопке:

Придайте блеска этой фигуре и добавьте немного drop shadow:

Напишите рейтинг любым шрифтом. Все готово!

Вот другой вариант этой же картинки. Для его получения необходимо удалить blending options 2 звездочкам и изменить текст:

АВТОРСКИЕ ПРАВА
Источник: alldes.net
При перепечатке ссылка на источник обязательна
Оставить комментарий

Ваш email не будет опубликован. Обязательные поля помечены (обязательно)

Вы можете использовать это HTMLтеги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Форум phpBB, русская поддержка форума phpBB
Рейтинг@Mail.ru 2008 - 2014 © BB3x.ru - русская поддержка форума phpBB