Создайте новый документ 500х50 пикселей. Выделите прямоугольную область 480х30 пикселей:
Теперь Select > Modify > Smooth 2px
Создайте новый слой и залейте выделение любым цветом. После этого примените стили:
- Gradient: #313332 > #46474a 
- Stroke: #676767
Выделите верхнюю часть панели (выделите всю, а потом, зажав ALT, выделите НИЖНЮЮ часть):
Создайте новый слой и залейте его градиентом от белого к прозрачному:
Установите режим смешивания для этого слоя на Linear Dodge и непрозрачность на 35%:
Создайте новый слой и выделите область 1px в высоту под верхней границей панели, используя инструмент Single Row Marquee:
Залейте выделение белым:
Теперь CTRL-клик на иконке первого слоя, чтобы выделить его содержимое:
Select > Inverse, выделяем в панели слоев слой с однопиксельной белой полоской и нажимаем DELETE:
Меняем режим смешивания для этого слоя с полоской на Soft Light и непрозрачность устанавливаем на 60%:
Выделите прямоугольную область 130х24 пикселя и смягчите ее Select > Modify > Smooth 2px
Создайте новый слой и залейте любым цветом. Примените стили:
- Gradient: #000000 to #2f3233 
- Stroke: #0f1011 to #575858
Создайте новый слой и CTRL+клик по слою с только что сделанным прямоугольником. Далее Edit > Stroke 1px белого цвета:
Понизьте непрозрачность слоя на 15%:
Выберите верхнюю часть кнопки и на новом слое залейте ее градиентом от белого к прозрачному:
Понизьте непрозрачность слоя до 80%:
Добавьте текст на кнопки:
Теперь нужно добавить разделители между кнопками. Создайте новый слой, выделите область инструментом Single Column Marquee и залейте ее #1a1b1c. Передвиньте выделение на 1px вправо (одно нажатие на стрелку вправо на клавиатуре) и залейте его теперь уже #5d5f60. Еще раз двигаем на 1px вправо и заливаем уже #232526:
Сотрите верхнюю и нижнюю части разделителя при помощи ластика размером 20px мягкой кисти и понизьте непрозрачность слоя до 50%:
Скопируйте слой два раза и поместите копии между другими кнопками:
Готово!
Источник: http://www.avivadirectory.com/photoshop/vista-style-nav-bar/ | 
