Сайт-визитка в Фотошопе

Ваше собственное портфолио-веб-сайт

Your Own Portfolio Web Site
Здесь я собираюсь показать вам, как сделать оригинальный дизайн сайта, где вы можете разместить своё портфолио.
Во-первых, вы должны создать новый документ, в котором можно сделать этот веб-сайт. Для этого урока я буду использовать размер 1000?700 пикселей с разрешением по умолчанию  72. Затем вам нужно будет найти шаблон ,добавить на заднем фоне. Я нашел это . Также вы можете использовать ваши собственные шаблоны. Откройте файл и примените Редактирование Edit> Определить Узор Define Pattern ,чтобы сохранить это изображение как шаблон, после чего вернуться в наш основной документ и использовать Ведро Paint Bucket Tool ( использовать Образец-Узор Режим вместо Передний план).
Your Own Portfolio Web Site 01
Затем нажмите Ctrl + Shift + U, обесцвечивание
Your Own Portfolio Web Site 02
Применить Наложение цвета Color Overlay стиля слоя в слой фона.
Your Own Portfolio Web Site 03
Смотрите результат ниже:
Your Own Portfolio Web Site 04
Ок, мы закончили с фоном. Переход к следующему шагу. Создаём окно для содержания. Создайте новый слой, затем выберите Прямоугольная Область  Rectangular Marquee Tool сделать выбор как на моих фотографиях ниже, и заполнить ее с цветом # f4f4f4.
Your Own Portfolio Web Site 05
Удалите выделение Ctrl + D. Делаем отверстия как в блокноте. Используйте Овальную Область Elliptical Marquee Tool .Сделать  как на моих фотографиях ниже, и нажмите Удалить в выбранной области.
Your Own Portfolio Web Site 06
Держать ЛКМ и перемещая выделенную область жмём  Удалить снова. Делать то же самое, пока не получится,как у меня.
Your Own Portfolio Web Site 07
Удалите выделение Ctrl + D и перейти к следующему шагу. Время делать листу области на трех основных частей: веб-сайтов, логотипов и иконок. Выберите Линия Line Tool и линия  около 4 пикселей, а затем вытянуть соответствие с черным цветом. После этого сделать непрозрачность около 15% для этого слоя.
Your Own Portfolio Web Site 08
Добавить две линии побольше.(чтобы линия была прямая,вести её с зажатым Shift)
Your Own Portfolio Web Site 09
Время, чтобы добавить ярлыки. Создайте новый слой и создайте выделение с помощью Прямоугольная область Rectangular Marquee Tool. Заполните выбранную область цветом # e04e21.
Your Own Portfolio Web Site 10
Затем выберите Прямолинейное Лассо Polygonal Lasso Tool Чтобы создать еще одно выделение, как показано на моей картине ниже.
Your Own Portfolio Web Site 11
Затем с помощью Затемнителя Burn Tool (Brush: PX 45, диапозон: Midtones, Выдержка: 30%), чтобы добавить темные пятна в выбранной области этикетки.
Your Own Portfolio Web Site 12
Затем с помощью Осветлителя Dodge Tool (Brush: PX 45, диапозон: Midtones, Выдержка: 30%) довести эту форму метку тома.
Your Own Portfolio Web Site 13
После этого инвертировать выделение Ctrl + Shift + I и сделать работу немного больше.
Your Own Portfolio Web Site 14
Удалите выделение Ctrl + D и нажмите Ctrl + T чтобы вращать этикетку, а затем применить Редактирование-Трансформирование-Деформация Edit> Transform> Warp и поискажать.
Your Own Portfolio Web Site 15
Применить Тень Drop Shadow на текущий стиль слоя:
Your Own Portfolio Web Site 16
Затем щелкните правой кнопкой мыши на слое эскизы панели и выберите Создание слоя.
Your Own Portfolio Web Site 17
Жмём Ctrl+T и крутим как надо:
Your Own Portfolio Web Site 18
Затем я хотел бы добавить заголовок. Выберите Текст Horizontal Type Tool и впишите названия ярлыка.
Your Own Portfolio Web Site 19
Я использовал Bernhard Modern шрифт как шрифт выбора. Теперь поворот текста с помощью Ctrl + T.
Your Own Portfolio Web Site 20
Первая этикетка готова. Добавить еще две метки тем же способом.
Your Own Portfolio Web Site 21
Переходим к следующему шагу. Нам необходимо добавить содержимое. Я пошел к Google Images . Вы можете скачать его с здесь . Откройте изображение ,примените Рамку Crop Tool:
Your Own Portfolio Web Site 22
Кадрировать и снизить непрозрачность.
Your Own Portfolio Web Site 23
Применить Внутреннее Свечение Inner Glow стиля слоя к этому слою.
Your Own Portfolio Web Site 24
Результат должен быть следующим:
Your Own Portfolio Web Site 25
Теперь мне нужно добавить имя проекта с кратким описанием. Выберите Текст Horizontal Type Tool снова и вписать некий текст в несколько строк, используя цвет #45454 и Tahoma шрифтом.
Your Own Portfolio Web Site 26
Добавить больше содержания в тот же путь. Логотип фотографии можно загрузить по адресу здесь и значок фотографии можно загрузить по адресу здесь.
После чего перейти к следующему шагу. Я хотел бы вписать логотип с нашим портфолио. Выберите Horizontal Type Tool усиления и выписать текст с помощью цвета # b2d763 и Bernhard Modern шрифт снова.
Your Own Portfolio Web Site 28
После этого применяются Тень Drop Shadow и Наложение Градиента Gradient Overlay в стилях слоя на слой с текстом.
Your Own Portfolio Web Site 29
Your Own Portfolio Web Site 30
Вы можете увидеть результат на рисунке ниже:
Your Own Portfolio Web Site 31
И последнее , что мы должны добавить, контакты  в нижней части сайта.
Your Own Portfolio Web Site 32
Я использовал Tahoma шрифт снова и выбранный цвет текста как # f4f4f4 и # d5ea9f. Вот получился сайт-визитка.
Your Own Portfolio Web Site 27
Перевод: swaego



Случайный пост Оставить комментарий