кнопка №1:

1. Для изготовления кнопки нам потребуется трехмерный шар. Его можно сделать так. Берем новое изображение (300х300 с прозрачной основой!). Делаем выделение в виде окружности и заливаем его желаемым цветом. Снимаем выделение Ctrl+D. Затем применяем Filter/Render/Lighting Effects с установками, указанными ниже. После этого уменьшаем изображение до размера 100х100. Шар готов!
   
   
   
   
2. Сделаем кнопку средней величины. Уменьшаем шар до размера 25x25 пикселов. Командой Image/Duplicate создаем две копии изображения. У первого изображения командой Image/Canvas Size обрезаем правую половину, у второго левую, а у третьего обрезаем края так чтобы его ширина стала 1 пиксел (в окошке width ставим 1).
   
   
   

   Обрезка правой половины

   
   
3. Командой Image/Image Size увеличиваем ширину третьего изображения до 125 пикселов (не забудьте убрать галку в окошке рядом с надписью Constrain Proportions).
   
   
   
4. Создаем новое изображение 170х40 и заливаем его цветом Вашей страницы.
5. Переходим к третьему изображению, выделяем его и копируем Edit/Copy Merged, а затем вставляем в только-что созданное изображение. Аналогично поступаем с первым и вторым изображениями, только 1-е передвигаем влево, а 2-е - вправо.
   
   
   
6. Два раза применим команду Layer/Merge Down, чтобы получить только 2 слоя - Background и Layer 1 - слой с кнопкой. Добавляем тень (Layer/Layer Style/Drop Shadow...).
   
   
   
7. Пишем текст на кнопке (смотри урок Вдавленная надпись).
   
   
   
8. При желании можно "оживить" кнопку при помощи события ommouseover из Java Script. Это делается так. Для начала Вам понадобиться второе изображение, которое будет заменять исходное при наведении на него курсора мыши. Я создал второе изображение из первого путем цветовой настройки слоя с кнопкой - Image/Adjustments/Hue Saturation (Colorize). Итак, второе изображение готово. Назовем первое but.jpg, а второе but1.jpg. Для того,чтобы кнопка жила, Вам необходимо в html- код Вашей странички вставить следующую строку:
   <img src=but.jpg name="p1" border=0 onmouseover="document.p1.src='but1.jpg'" onmouseout="document.p1.src='but.jpg'">

   Данную кнопку можно сделать указателем гиперссылки, поместив вышеуказанный фрагмент кода внутри тэга гиперссылки.

   

   проверь кнопку

Теперь Вы уже знаете, как создавать объемный шар. Сделайте нечто подобное для закрепления. Задний фон любой. Если понравился этот, то делайте его так. Передний цвет в палитре светло-голубой, задний - белый; далее последовательно используем фильтры: 1.Render/Clouds; 2.Stylize/Wind/Method Stagger; 3.Brush Strokes/Ink Outlines... с настройками сверху вниз:10, 12, 10.

кнопка №2:

1. Для изготовления кнопки создаем новое квадратное изображение, к примеру, 50x50 пикселов. Создаем выделение окружностью .
2. Выбираем светлый цвет для переднего цвета, а темный для заднего. Используя Градиент внутри выделения заполняем окружность от светлого к темному.
   
   
   
3. Командой Select/Modify/Contract уменьшаем выделенную окружность и заполняем ее теми же цветами только в обратном направлении.
   
   
   
4. А теперь можно что-нибудь написать на кнопке и отбросить от нее тень.
   
   
   

Создайте кнопку, аналогичную рассмотренной, но квадратную и еще одну произвольной формы.

анимированная кнопка:

1. Создаем изображение, заполненное любой текстурой или цветом.
2. Делаем выделение в виде эллипса или окружности. Сохраняем выделение. Выбираем два цвета: светлый и темный (на примере - оттенки зеленого). С помощью инструмента градиент - заполняем выделение от светлого к темному под нужным углом.
   
   
   
3. Теперь на 5 пикселов сожмем выделение: Select/Modify/Contract 5 pixels. Заполним получившееся выделение от темного к светлому. Загружаем первоначальное выделение Alt+Ctrl+4 и немного размываем кнопку Filter/Blur/Gaussian Blur 1.5.
   
   
   
4. Создаем новый слой. В пишем надпись или картинку на кнопке.
   
   
   
5. Переходим в первый слой. Загружаем выделение (Ctrl+Alt+4). Обводим кнопку черным кольцом: Edit/Stroke (1 Pixel, Outside, Black). Теперь Select/Inverse и применяем Filter/Blur/Gaussian Blur 1.0. И еще Select/Inverse и применяем Filter/Blur/Gaussian Blur 2.0 (эти шаги мы проделали для того, чтобы избавиться от лишних пикселов по краям кнопки). Полдела сделано. Сохраняем результат работы в формате GIF.
   
   
   
6. Создадим третий слой. Поместим его между слоем с текстом и слоем кнопки. Загрузим выделение (Ctrl+Alt+4). Заполним его 30% черным. (Edit/Fill/Black/30%).
   
   
   
7. Обращаем выделение (Ctrl+Shift+I). Сдвигаем его на 4 пиксела вправо и вниз и заполняем 80% черным.
   
   
   
8. Загрузим выделение: Ctrl+Alt+4. Обратим его: Ctrl+Shift+I. Теперь удалим выделенную часть, нажав кнопку Delete.
9. Для пущей реалистичности сдвинем изображение на кнопке вправо и вниз на 1-2 пиксела. Все! Кнопка готова. Сохраним нажатую кнопку как и в прошлый раз (см. пункт 5), но под другим именем.
   
   
   
10. Вот так будет выглядеть Ваша анимированная кнопка. Используйте JavaSctript и событие OnMouseOver чтобы при наведении мышкой на кнопку она "нажималась".

Закругленные углы

1. Создаем выделение нужной формы на белом фоне (потом его можно будет поменять) и залеваем его черным. Выделение треугольником делаем, выбрав инструмент каарндаш и удерживая клавишу Shift при рисовании сторон треугольника.
   
   
   
2. "Размываем" его: Filter/Blur/Gaussian Blur со значением 5.
   
   
   
3. Затем Ctrl-L или Image/Adjust/Levels... и в Input levels вводим следующие значения: 120:1.00:140.
   
   
   
4. С результатом (слева) можно делать что угодно, для начала залить его фоном Вашей странички и, копировав кнопки в новый слой, поработать с эффектами слоя (справа):