Главная
Блог разработчиков 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
При перепечатке ссылка на источник обязательна
Оставить комментарий
БАЗА ЗНАНИЙ
СЛУЧАЙНАЯ СТАТЬЯ
СЛУЧАЙНЫЙ БЛОГ
СЛУЧАЙНЫЙ МОД
СЛУЧАЙНЫЙ СКИН
НОВЫЕ МОДЫ
НОВЫЕ СКИНЫ
НАКОПЛЕННЫЙ ОПЫТ
Форум phpBB, русская поддержка форума phpBB
Рейтинг@Mail.ru 2008 - 2017 © BB3x.ru - русская поддержка форума phpBB