Первое, что мы делаем - это создаем прямоугольник, всеми доступными способами, любого цвета. Такого размера, которого должна быть ваша кнопка.

Задаем прямоугольнику обводку 1px, и опускаем значение заливки до 0.

Жмякаем по слою правой кнопки мыши и растрируем слой.

Задаем параметры 1рх линии. Градиент и внешнее свечение.
Примечание для новичков в фотошопе. Я говорила и буду говорить, чтобы каждый из вас не ленился и "играл" с ползунками, с галочками до посинения. Вы поймете, что слою можно задать не только темную размытую тень, но ответите на вопросы "как же это делается". Методом проб и ошибок. Сразу ничего не приходит.
Итак, градиент задаем любой, конечно же с оттенками золота, или можно серебра, все зависит от ваших предпочтений.

Внешнее свечение. Для создания дополнительной контрастности. Темную. Режим наложения - Нормальное. Размах - 100 рх - для четкости линии. Размер - 2рх.

Итак, теперь нужно повторить все, что мы до этого проделывали. Для закрепления, для того чтобы сделать рамочку кнопки двойной.

А получится в итоге - вот так вот.

Мы закончили с рамкой. Приступим к основе.
Примечание. Лучше если Вы соедините слои с рамочкой. Но боясь утратить значения слоев, сгрупируйте их, продоблируйте, а потом соединяйте дубликат.
Примечание 2. Не забывайте называть слои.

Далее создаем прямоугольник любого цвета, под размер рамки.

Теперь мы будем задавать ему различные значения. Градиент, внутреннее свечение, тиснение.

Градиент. Определитесь с цветом. Не долго думая взяла свои любимые оттенки. Снизу вверх светлеет.

Внутреннее свечение. Цвет выбрала - #64aac4. Режим наложения - Яркий свет. Стягивание - 0рх. Размер - 10рх.

Тиснение. Тиснение добавляет объем. Введите все те значения, которые указаны на скриншоте.

Прежде чем начать, хочу отметить, что для этого урока я ничего не качала, все материалы стандартны для фотошопа. В данном этапе речь пойдет о различных кисточках и как с помощью их создавать интересные текстуры.

Я брала обычные, мягкие, текстурные. Если что в настройках всегда можно поглядеть разделы со стандартными кисточками фотошопа.

Для того чтобы всякий раз потом не удалять лишнее, мы нажимает Ctrl на слой с прямоугольником и выделяем эту область. Создаем новый слой. Потом мягкой кисточкой проводим по нижней части нашей кнопочки цвет #... . Режим наложения - Осветление основы

На скриншоте вы уже сможете наблюдать несколько слоев с кистями. Да, используя все доступные кисточки, я создала брызги (светлые кисточки с различными наложениями), потертости (темными кисточками, можно и без наложений, регулируя прозрачность слоя). Удаляйте лишнее, меняйте цвета, способы наложения.
Примечание для новичков. Только не переборщите. Больше и ярко-вырвиглаз -  не значит лучше. Мера.

Текстура. Ее можно и не добавлять. Но в ваших закромах они всегда должны быть. Шум, мраморные, каменные текстуры. Если нет - обязательно заведите свою коллекцию. Без нее никак.
В данном случае поэксперементируйте, НО прошу без фанатизма. На моей работе должно быть видно маленькое и незначительное различие. Способ наложения - зависит от вашей текстуры.

Этот этап завершающий.
Придающий нашему элементу - кнопке, четкости и яркости. Что-то делать не обязательно.
Но я покажу, про что не стоит забывать.
Во-первых, вы можете уменьшить яркость кнопки. Если это нужно.

Во-вторых, вспомним про группировку слоев, чтобы не потерять значение каждого. Копию же мы должны соединить.

В-третьих, не забываем никогда про доступные нам фильтры. В данном случаем добавляем нашей кнопки резкости.

Изменяем значения, которые подходят -оставляем.

Не забываем о таком инструменте как "Осветлитель" и "Затемнитель"

С помощью их мы можем создать отблески на уголках. Или наоборот затемнить (см. результат)

Вот результат не сложных манипуляций. После всевозможных проб. Я определилась с этой конечной точкой. Не стала добавлять блеска, поработала с маленькими элементами, про которые пойдет речь в другом уроке. Но поверьте, что я не отходила далее того, что я вам уже рассказала. Все зависит от терпения и вашей фантазии. Спасибо за внимание.