Металлический урок
В очередной раз, блуждая по dribbble, наткнулся на довольно-таки привлекательную металлическую кнопку… Уж больно захотелось воссоздать ее, да еще и поделиться уроком 🙂 Ну и пока мы не начали, советую почитать мой пост о том, где взять бесплатные изображения, возможно вам пригодится..
Создаем металлическую текстуру
Сразу предупреждаю: урок проще простого! Так что дважды подумайте, пока вы за него не взялись 😉 Ну а теперь начнем создавать нашу металлическую текстуру. Нарисуйте простой круг при помощи инструмента “Эллипс“.
Дальше потребуется применить к нему стиль “Наложение градиента“. Чтобы открыть панель со стилями, достаточно дважды щелкнуть по иконке слоя…
Вы уже могли заметить: я использовал особый градиент, который не составит труда повторить, вдруг что комментируйте – я отвечу. Ладно, с градиентом разобрались, дальше нужно добавить шум. Создайте новый слой: я его назвал “шум” и залил серым цветом #808080. Посмотрите на картинку внизу…
Полпути пройдено, назад уже не вернетесь, так что примените к слою “ШУМ” такие фильтры:
- Фильтр – Шум -Добавить шум…
- Фильтр – Размытие – Радиальное размытие…
В результате вы должны получить забавный эффект, схожий с кругами на воде, но это еще не все! Нужно слой с “Кругом” превратить в смарт объект. Смотрите, как это делается:
Слой “Шум” потребуется перевести в обтравленную маску, режим наложения слоя нужно изменить на “линейный заменитель” и прозрачность поставить на 20%.
Вот и все, металлическая текстура готова, делов на 2 минуты, а результат очень неплох 🙂
Немного поэкспериментировав, можно сделать очень интересные штуки, кстати, я вот всегда в своих работах использую выборочную цветокоррекцию, так как это очень хороший способ придать картинке цветовую изюминку 😉
Заключение
Признаюсь, пока много времени новому дизайну не уделял , но все же кое-какие коррективы есть, мне вот что-то сильно режет глаз, но никак не пойму что, у кого есть минутка поделитесь вашими мыслями по этому поводу, я обещаю сделать все наоборот 
Чтобы увеличить, кликните картинку 😉
Ну и кто не в курсе, то прошлая версия дизайна расписана в статье про трилогию фишек фотошопа. Ох, тяжкое дело писать посты в глубокой ночи, все мяукающие коты уже спят, а я…
Что же, остается только пожелать хорошего послезавтрашнего дня!
Узнай как выборочная цветокоррекция поможет спасти вашу фотографию. 
Нужно вырезать обьект с фото? Не беда урок как вырезать обьект в фотошопе поможет вам справится быстро илегко. 
Надоели невзрачные кисти? Урок как создать кисть поможет вам!. 
Как сделать макет визитки по правилам типографий. 
Очень просто установить кисть в фотошоп Оставить комментарий
Интересные статьи
Фишки фотошопа. Часть 1
Делаем металлическую кнопку
Фишки фотошопа часть 2
Фишки фотошопа часть 3
Хороший урок. Теперь с такой текстурой нужно соц. кнопки делать…
По дизайну первое что бросилось в глаза это черные маркеры у меню рубрик и темные письмо и стрелка в поиске. Да по меню ты меня правильно понял, только подвинь его на уровень заголовков и контента.
Да есть такие мысли насчет соц. кнопок.. ) Все хочу сделать кнопочки в векторе но никак не дается илюстратор, я к нему уже и с видео курсами подкатывал а он…
Не переживай, ты не один такой, я с иллюстратором тоже не сдружился. В кореле немного работаю иногда. 😉
Урок классный. На самом деле очень все просто и легко 😉
На счет дизайна у меня такие замечания: границы поля поиска не контрастны, из-за этого оно сливается с фоном; та же тема и вокруг соц.кнопок – тут или поярче выделить контраст или вообще убрать белые кругляши; менюшку и вправду чуток вправо надо сдвинуть, до уровня контента. Думаю пока хватит. 🙂
Еще пару штрихов и думаю можно будет внедрять..)
Кстати как там дела с марафоном? Участники подтягиваются?
Кстати, я попробовал замутить такую кнопку стальную. Получилось прям в точности 😉
Надо мне все же сделать кнопку что бы картинки в комментарии лепить 🙂 Как то уже были попытки но результат не очень хороший(