Design resources

Шаг 7. Скачаем ещё один набор Кистей (созданный BL1nX). На новом слое «Stars1» в новой папке Stars, находящейся в папке Background, рисуем белой 500-той Кистью из нового набора звезды. Для этого слоя применяем Стиль Слоя — Gradient Overlay (Наложение Градиента) (#3A8FEF, #FFFFFF и #66C9FC).

Шаг 8. На новом слое «Stars2» рисуем звездную пыль (Кисть номер 650), при необходимости, стирая лишнее Ластиком (Eraser Tool (E)). Стиль Слоя — Outer Glow (Внешнее свечение) — #8AB2FF.

Шаг 9. Добавляем еще звезд на слое «Stars2», стираем лишнее Ластиком и применяем Стиль Слоя — Gradient Overlay — #6AB1D1, #FFFFFF, #94CFED и #FFFFFF.

Шаг 10. Скачиваем ещё один набор Кистей. Выбираем Кисть номер 148, размер — 65 пикселей, цвет — белый и рисуем на новом слое пятнышко над буквой I. Применяем к этом слою Стиль Слоя — Outer Glow (цвет свечения — #00BCF9).

Шаг 11. Копируем слой со словом Magic, заменяем его на Night и размещаем, как на картинке внизу. Стили Слоя — Outer Glow (#FFFFFF) и Gradient overlay (#F9DA5B, #FEAE00, and #FFD403).

Шаг 12. Добавим облаков. Скачиваем redheadstock’s Кисти. выбираем кисть номер 2464, диаметра 960 пикселей и #234B7F цвета. Создаем новый слой «cloud1» и одократно кликаем там кистью. Теперь, перемещаем новый слой в папку Background и меняем размер облака (Ctrl+T).

Шаг 13. Выбираем Инструменты Dodge (Осветлитель) и Burn (Заткмнитель) и, соответственно, затемняем облако снизу и осветляем сверху. Непрозрачность (Opacity) этого слоя ставим — 50%.

Шаг 14. На новом слое «cloud2» добавляем ещё облаков (мы для них использовали #5F83A5 цвет). Затемнить и осветлить их можно также, как это делалось в предыдущем шаге.

Шаг 15. Повторяем предыдущий шаг, только теперь используем другую Кисть (цвет — #36638C) и рисуем облако на слое «cloud1». Затемнение, осветление и изменение размера — по желанию.

Шаг 16. Выбираем мягкий Ластик и стираем нижнюю часть облака на слое «cloud1», чтобы получился эффект плавного перехода.

Шаг 17. Переходим от шапки к телу сайта. Рисуем на новом слое прямоугольник #0A1D37 цвета (слой с ним должен находиться под папкой со слоями с облаками). Обратите внимание, что прямоуголник находится в пределах сделанных в самом начале направляющих. Далее идем Layer>Layer Mask>Reveal all и на этой маске проводим черно-белый градиент (см. рисунок). В конце отметим еще одной направляющей место перехода цвета в фон.

Шаг 18. Добавим (опять на новый слой) ещё один прямоугольник, который будет использоваться в дальнейшем под навигацию. Цвет у него пусть будет — #091525, Маска слоя — как в предыдущем шаге.

Шаг 19. Нарисуем необычную Rss-иконку в шапке нашего сайта. Для этого, для начала, скачаем фото луны и помещаем его на новый слой «moon-rss». После этого регулируем значения Hue/Saturation (Ctrl+U) и добавляем Стили Слоя — Inner Glow и Outer Glow.

Шаг 20. На новом слое (находящемся над слоем с луной) рисуем маленькое облако #7997B3 цвета. Лишние места стираем Ластиком.

Шаг 21. На новый слой (находящийся под слоем с облаком, но над слоем с луной) добавляем классическую фигуру Rss-иконки (#DCA30B цвета) и применяем к ней Стили Слоя, показанные внизу. Ну и в конце, добавляем звездочку, как в Шаге 10.

Шаг 22. Помещаем эту фотку на новый слой, она будет служить фоном под основную навигационную панель. Передвигаем её в нужное место (Move Tool (V)), изменяем размер (Ctrl+T) и деформируем (Flag warp).

Шаг 23. Затемняем (Burn Tool) некоторые места меню, чтобы увеличить иллюзию трехмерности.

Шаг 24. Добавим текстуру с помощью Стилей Слоя Gradient Overlay (#045F96 и #FBF4BD) и Pattern Overlay.

Шаг 25. Отбросим тень от навигационного меню. Для этого создадим его копию, с помощью Hue/Saturation (Ctrl+U) Обесцвечиваем её (ползунок Lightening на -100) и размываем немного. После этого с помощью Инструмента Free Transform (Свободная Трансформация (Ctrl+T)) искажаем тень

Шаг 26. Добавим немного облаков (также, как мы делали в Шаге 15) и текст (шрифт — Georgia — Italic). Для обычных ссылок будет использовать #0B1827 цвет, а для посещенных — #211808 цвет. Различные декоративные элементы (звездочки, линии) добавляются по желанию.

Шаг 27. Последним шагом в работе с меню, проведем по нему несколько раз разноцветными рассеивающими Кистями. Непрозрачность для слоя с ними (Stars) зададим в 40%.

Шаг 28. Добавим текст к RSS-иконке. Для этого мы использовали шрифт Aria высотой 10 px желтого (#F2C90D) и белого (#FFFFFF) цветов.

Шаг 29. В качестве дополнительной детали добавим воздушный шар. Отделяем его от фона, помещаем в наш файл и применяем к нему Стиль Слоя — Color Overlay (#1F416E — Blending Mode: Overlay) и, при желании, затемняем с помощью Burn Tool.

Шаг 30. С помощью Кисти номер 615, добавим ещё звезд. А с помощью обычной 3px нарисуем веревочку у нашего шарика.

Шаг 31. Начнем добавлять контент на наш макет. На новом слое «Post» вбиваем Заголовок и дату. Можно ещё добавить звездочку рядом с датой.

< /td>

Шаг 34. Добавляем звезд, воздушный шарик и надпись Georgia Italic шрифтом и #D5A934 цветом. И по аналогии рисуем кнопку «Go!»

Шаг 35. Вбиваем пункты меню (каждую секцию помещаем в отдельную папку) и добавляем, при желании, разнообразные фоновые элементы. Основные линии лучше определить направляющими.

Шаг 36. Теперь, давайте нарисуем дно нашего меню. Для этого рисуем несколько облаков, обработаем их, добавляем звезд и воздушных шаров. Следите за тем, чтобы они не выходили за пределы отведенные под боковое меню.

Шаг 37. Ну и наконец, создадим футер (дно) нашего сайта (в отдельной папке «Footer»). Сотрем лишнее на маске слоя основного синего слоя и добавим облаков #0B1C38 и #223E63 цвета. Не забываем про направляющие и непересечение различных частей сайта.

Шаг 38. Затемняем облака и рисуем красивое скопление звезд с помощью различных Кистей.