Основное меню


Во-первых, создатайте новый документ размером 1000×700. Затем вам нужно найти узор для заливки фона. В данном случае нам подойдет вот такой узор:

Создание дизайна для портфолио

Залейте таким или подобным этому узору фон. Примените к фоновому слою следующие параметры наложения.

Создание дизайна для портфолио

Отлично, мы сделали фон. Перейдем к следующему шагу. Создадим окно для контента. Создайте новый слой, затем выберите Rectangular Marquee Tool (Инструмент "Прямоугольная область") и заполните его цветом #f4f4f4.

Создание дизайна для портфолио

Снимите выделение с помощью клавиш Ctrl+D.Теперь проделаем дырки в верхней части прямоугольника. Используйте Elliptical Marquee Tool (Инструмента"Овальная область"). В верхней части прямоугольника выделите с помощью инструмента Elliptical Marquee Tool (Инструмента "Овальная область") овал и нажмите "Delete" для удаления выделенной области.

Создание дизайна для портфолио

Сделайте такие отверстия до конца прямоугольной области, при этом оставляя небольшие промежутки между овалами.

Создание дизайна для портфолио

Снимите выделение Ctrl+D и перейдем к следующему шагу. Выберите Line Tool (Инструмент "Линия"), толщиной около 4 пикселей, нарисуйте линию черным цветом как показано на картинке ниже. После этого установите непрозрачность около 15% для этого слоя.

Создание дизайна для портфолио

Добавьте еще две линии ниже как показано на картинке:

Создание дизайна для портфолио

Пришло время добавить метки. Как мы можем это сделать? Создайте новый слой и создайте выделение с помощью Rectangular Marquee Tool (Инструмента "Овальная область"). Заполнить выделенную область с помощью цвета #e04e21.

Создание дизайна для портфолио

Затем выберите Polygonal Lasso Tool (Инструмент "Прямолинейное лассо"), чтобы создать еще одно выделение, как было показано на картинке ниже.

Создание дизайна для портфолио

Затем используйте Burn Tool (Инструмент "Затемнитель"), выставьте параметры - size brush: 45 px, range: midtones, exposure: 30% (размер кисти: 45 px, диапазон: средние тона, экспонир: 30%) , чтобы добавить затемнения в выделенной области метки.

Создание дизайна для портфолио

Теперь между затемнениями добавим осветлителя. Используйте Dodge Tool (Инструмент "Осветлитель"), выставьте параметры - size brush: 45 px, range: midtones, exposure: 30% (размер кисти: 45 px, диапазон: средние тона, экспонир: 30%) , осветвляем серединку метки как показано ниже.

Создание дизайна для портфолио

После этого инвертируйте выделение с помощью клавиш Ctrl+Shift+I, и осветлите другую часть метки.

Создание дизайна для портфолио

Снимите выделение с помощью сочетания клавишь Ctrl+D и нажмите Ctrl+T, чтобы повернуть метку, а затем нажмите вкладку Edit -> Transform -> Warp (Редактирование -> Трансформирование -> Деформация), и деформируйте метку как показано ниже на картинке.

Создание дизайна для портфолио

Добавьте тень к вашей метке с помощью параметров наложения. Выставьте параметры как показано ниже.

Создание дизайна для портфолио

Создайте новый слой.

Создание дизайна для портфолио

Перейдите на слой ниже и нажмите вкладку  Edit -> Transform -> Distort (Редактирование -> Трансформирование -> Искажение),  немного исказите его как на изображении ниже:

Создание дизайна для портфолио

Затем добавим название. Выберите Horizontal Type Tool (Инструмент "Горизонтальный текст") и напишите имя метки. Далее переверните текст используя клавиши Ctrl+T, согласно углу наклона самой метки.

Создание дизайна для портфолио

Первая метка готова. Добавить еще две метки в том же порядке.

Создание дизайна для портфолио

Следующим шагом будет добавление контента. Зайдете в Яндекс или Google картинки и найдите картинку вроде той что показана ниже:

Создание дизайна для портфолио

Добавьте найденую картинку на свой холст.

Создание дизайна для портфолио

Примените для слоя с найденной вами картинкой следующие параметры наложения:

Создание дизайна для портфолио

Теперь нужно добавить название и описание под картинкой. Выберите Horizontal Type Tool (Инструмент "Горизонтальный текст") и напишите какой-нибудь текст в несколько строк, используя цвет #45454 и шрифт Tahoma.

Создание дизайна для портфолио

Добавить больше содержания таким же образом. Логотип и значок вы можете загрузить отсюда.

Создание дизайна для портфолио

Хорошо, после этого перейдем к следующему шагу. Создадим логотип в виде названия для нашего портфолио. Выберите Horizontal Type Tool (Инструмент "Горизонтальный текст") и напишите текст, используя цвет #b2d763.

Создание дизайна для портфолио

Теперь добавим тени и градиент.

Создание дизайна для портфолио

Создание дизайна для портфолио

И последний этап в создании портфолио, будет добавление в нижней части, текста с контактами.

Создание дизайна для портфолио

Для создания текста контактов использовался шрифт Tahoma и цвет текста #f4f4f4 и #d5ea9f.

На этом создание портфолио закончено, результат смотрите ниже:

Создание дизайна для портфолио

Источник материала

Раздел: Статьи для веб-дизайнера

магазин автозапчастей киев


Дополнительно Популярное
Дизайнерский веб-ресурс: Дле, Вордпресс, Джумла, фотошоп, плагины, иконки, шаблоны, текстуры, смайлики, логотипы.