Мы запустили Форум! (*beta)
сортировать посты по: Рейтингу | Посещаемости | Комментируемые
Подсказка
Если Вы нашли неточность в переводе, ошибку или считаете, что содержание данного шага не совсем точное – используйте функцию «Изменить», чтобы внести свои изменения.
*Ваши изменения будут отправлены администрации на модерирование.
*Поля "Имя" и "Комментарий" не обязательны.
1. Создайте новый документ размером 780×700 px и разрешением 72 dpi. При помощи инструмента Прямоугольник (Rectangle Tool) создайте фон страницы сайта.




3. Используя инструмент Прямоугольник (Rectangle Tool), нарисуйте маленькую полосу цветом #1B1B1B на верхней части страницы.

4. При помощи инструмента Прямоугольник с закругленными краями (Rounded Rectangle Tool) (радиусом 10 рх) создайте заголовок сайта. Сначало создайте основной слой, затем, удерживая Alt, тем же инструментом вырежьте зону для кнопок меню.








6. Создайте новый документ размером 4×4 px и разрешением 72 dpi. При помощи инструмента Карандаш (Pencil Tool) нарисуйте чёрный узор, как показано ниже:

7. Перейдите в меню Редактировать>Определить узор (Edit>Define Pattern) и сохраните узор. Вернитесь к странице сайта. Выберите инструмент Прямоугольник (Rectangle Tool) и создайте специальный слой для кнопок меню. Этот слой расположите ниже слоя, содержащего заголовок сайта.

8. Установите Заливку (Fill) слоя - 0% и примените для слоя стиль Наложение узора
(Layer Style - Pattern Overlay).
(Layer Style - Pattern Overlay).



10. Установите Заливку (Fill) слоя - 0% и примените для копии стиль Наложение узора
(Layer Style - Pattern Overlay).
(Layer Style - Pattern Overlay).



11. Выберите инструмент Прямоугольник с закругленными краями (Rounded Rectangle Tool) (радиус - 5 рх) и вставьте кнопку в зону меню на заголовке сайта.







13. Скопируйте слой кнопки и в режиме Свободного трансформирования (Free Transform) расположите копию, как на рисунке ниже.



15. Сделайте 2 копии созданного слоя копии и инструментом Свободное трансформирование (Free Transform) расположите новые копии, как показано ниже:












20. Теперь перейдите к работе с местами для рисунков. Для этого потребуется инструмент Прямоугольник (Rectangle Tool) и белый цвет.



22. На установленные места для рисунков вставьте сами картинки (предварительно вырежьте их).






24. При помощи инструмента Линия (Line Tool) создайте несколько разделительных линий цветом #555555.

25. Создайте новый слой (Create New Layer) и выберите инструмент Карандаш (Pencil Tool) (кисть - 2 рх) и нарисуйте возле ссылок несколько указателей цветом #27D1F4.


26. При помощи инструмента Прямоугольник (Rectangle Tool) создайте ползунок цветом #3E3E3E на правой стороне рисунка:









Ссылка на источник урока
Создан: 16 октября 2009
написал : nervig
Простите чайника, вот сделал все как указано в уроке. Красиво! А как к сайту прикручивать не пойму. Ведь это же только картинка
---------------19 октября 2009 00:04 | ICQ: -- | [цитировать]
написал : positive1
Нужно резать и хтмлом прикручивать. в фотошопе есть Slice Tool
почитай в нэте про этот инструмент
---------------почитай в нэте про этот инструмент
ПОДПИСЬ
19 октября 2009 01:15 | ICQ: -- | [цитировать]
написал : SenDen
В 1-ом пункте полоса сверху не отображается, когда я её нарисовал, а в 4ом пункте не могу вырезать зону для кнопок меню...
---------------23 июня 2010 12:03 | ICQ: -- | [цитировать]
написал : positive1
Какая полоса в 1 пункте??? там просто создание фона при помощи прямоугольника.
а в 4-ом - создайте большой прямоугольник сначала, а потом зажмите Alt и создайте маленький, либо в настройках инструмента сверху установите нужно значение, чтобы было вырезание из фигуры.
---------------а в 4-ом - создайте большой прямоугольник сначала, а потом зажмите Alt и создайте маленький, либо в настройках инструмента сверху установите нужно значение, чтобы было вырезание из фигуры.
ПОДПИСЬ
23 июня 2010 15:45 | ICQ: -- | [цитировать]


+1
