Шаблон сайта «на старой бумаге» в Photoshop

  • doc
  • 17.04.2020
Публикация в СМИ для учителей

Публикация в СМИ для учителей

Бесплатное участие. Свидетельство СМИ сразу.
Мгновенные 10 документов в портфолио.

Иконка файла материала 9. ЛР по теме Шаблон сайта «на старой бумаге» в Photoshop.doc

Шаблон сайта «на старой бумаге» в Photoshop

Давайте создадим шаблон для сайта в Photoshop. 7 шагов и ваш шаблон готов!

Шаблон сайта

папирус

Шаг 1. Для создания такого шаблона сайта вам потребуется изображение бумаги, лучше папируса. Когда вы его найдете, положите его в центр вашего шаблона (на отдельном слое, конечно же).

стили слоя
drop shadow

Теперь, добавим Тень нашему папирусу. Для этого, находясь на слое с папирусом, идём Layer>Layer Styles>Drop Shadow (Слой>Стиль Слоя>Тень) и задаём параметры, как на картинке

рисуем тень

А вот как должен выглядеть результат

lasso tool

Шаг 2. Выбираем Инструмент Полигональное Лассо (Polygonal Lasso Tool (L)) и создаём выделение, как на картинке

layer

С помощью данного выделения мы нарисуем несколько кнопок. Убедитесь, что вы находитесь на слое с папирусом...

копируем выделенное

...и нажмите Ctrl+J, чтобы скопировать выделенную область на новый слой (можно назвать новый слой, например, "button (кнопка)").

transform

Шаг 3. Находясь на слое с кнопкой выбираем Edit>Transform>Rotate 180 (Редактирование>Трансформирование>Поворот на 180 градусов), и с помощью Инструмента Перемещения (Move (V)) перемещаем кнопку наверх.

button

После этого переносим нашу кнопку под папирус, для этого просто слой с кнопкой перемещаем под слой с листом.

шаблон сайта

Для создания других кнопок просто повторяем предыдущие действия. У нас их будет пять и вяглядеть они будут так

шаблон для сайта

Ну и текст заодно добавим

hue

Шаг 4. Изменим цвет кнопок. Для этого идем на слой с нужной кнопкой и далее нажимаем Ctrl+U, чтобы вызвать окно Hue/Saturation (Цветовой тон/Насыщенность). Зададим параметры, как на картинке

кнопка

Вот так выглядит наша новая кнопка

рисуем меню

А вот так всё меню после того, как мы раскрасили все кнопки

создаем шаблон сайта

Шаг 5. Пришло время добавить текст и картинки (думаю вы сами с этой задачей прекрасно справитесь).

создаем шаблон

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

desaturate

Выглядить стал получше, но если текстуру обесцветить (для этого идём Image>Adjustment>Desaturate (Изображение>Коррекция>Обесцветить)) всё вообще станет замечательно.

desaturate

Выглядить стал получше, но если текстуру обесцветить (для этого идём Image>Adjustment>Desaturate (Изображение>Коррекция>Обесцветить)) всё вообще станет замечательно.

А вот и наш финальный макет сайта:

макет сайта


Скачано с www.znanio.ru