Как сделать портфолио в фотошопе

Как оформить портфолио в фотошопе своими руками

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопеПоставив перед собой цель оформить портфолио своими руками, вы столкнетесь с необходимостью использования графических редакторов – фотошоп, гимп и других. Не все знают, как работать с этими программами, эта проблема и побудила меня на написание данной статьи.

Наверное, не стоит упоминать, что при работе нужно учитывать требования школы, и при этом создать документацию, которая бы понравилась и самому школьнику (дошкольнику).

В данной статье я пишу о том, как заполнять готовые шаблоны портфолио, которые вы найдете на сайте portfo-leo.ru в разделе «Готовые шаблоны портфолио»

Получив готовый шаблон, вы можете оформить его для своего ребенка самостоятельно. Для этого вам достаточно будет информации, которую я изложу ниже.

Конечно, если вы впервые работаете с графическими редакторами – понадобится время и терпение, чтобы закончить работу. К тому же конечный результат может несколько отличаться от задуманного вначале, но зато у вас есть возможность своими руками создать для своего ребенка портфолио, которое будет отражать его индивидуальность.

Готовые шаблоны конечно несколько ограничивают индивидуальный подход, тем не менее и из них можно сделать неповторимую работу, к тому же это займет у вас гораздо меньше времени и сил, чем создание портфолио с нуля.

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

Итак, давайте разберемся…

Как сделать портфолио своими руками

Для работы возьмем шаблон «Морские просторы» вот ОТСЮДА

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

1. Открываем титульный лист в программе фотошоп. Открываем фотографию, которую вы собираетесь на нем разместить. Удобнее всего, когда вы видите перед собой сразу и фото и лист, с которым работаете. Выбираем в фотошопе инструмент «перемещение» (выделен красным кружком), щелкаем левой кнопкой мышки по фотографии и не отпуская кнопку мышки, перетаскиваем фото на шаблон (смотрите 1 и 2 изображение).

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопеКак сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопеУ вас должно получиться также. Чтобы фото оказалось внутри рамки нам нужно переместить его под нее. Для этого щелкаем левой кнопкой мышки на первый слой (выделен красным кружком), и удерживая нажатие, перетаскиваем этот слой под слой с титульным листом. Должно получиться вот так:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопеФотографию под рамкой можно передвигать, чтобы добиться ее наиболее удачного расположения.

Может случиться так, что фото не будет соответствовать размеру рамки. Чтобы исправить такую ситуацию, в графическом редакторе фотошоп есть инструменты масштабирования. Я пользуюсь вот таким простым приемом:

Чтобы увеличить или уменьшить фотографию, проверьте, чтобы именно ее слой оказался активен, а потом нажмите сочетание клавиш Ctrl + T. Или найдите в меню «Правка» функцию «Свободное Преобразование» и выберите ее. Затем, удерживая нажатой кнопку «Shift» на клавиатуре, потяните фото за уголок в сторону увеличения или уменьшения. Не забывайте про «Shift», иначе изображение будет искажено.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе2. Итак мы вставили фото. Теперь нам нужно вставить текст. В данном случае – подписать титульный лист. Для этого в графическом редакторе выбираем инструмент «Текст» (выделенный красным), встаем курсором мыши на строки шаблона и пишем фамилию, имя и отчество ученика. В данном случае я использую шрифт Times New Roman курсив. Цвет и шрифт можно выбрать любой. Проследите за правильным расположением слоев — это важно, чтобы текст был виден он должен находится выше слоя с титульным листом.
Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопеПосле того, как лист готов, не забудьте сохранить его в формате jpg – именно этот формат нужен для распечатки листов.

Если при заполнении портфолио возникла необходимость установить новый шрифт в фотошоп, как это сделать, читайте здесь.

Дополнение к мастер классу маленький видеоурок:

Таким образом, можно заполнить все листы готового шаблона портфолио. Если остались вопросы – оставьте их в комментарии, я обязательно отвечу.

Распечатать готовое портфолио для школьника (дошкольника) можно дома на цветном принтере. Для этого лучше использовать фотобумагу. Однако самый оптимальный вариант — заказать печать в фото-салоне или в типографии – это будет и качественнее и по цене выгоднее.

Для тех, кто не очень хочет тратить время на поход в фото-салон, будет полезен сервис Netprint, где выбрав подходящий формат А4, вы сможете заказать печать портфолио, и дождаться готовые листы по почте или забрать их в ближайшем к вам пункте выдачи.

Источник

Как сделать портфолио в фотошопе

Создадим новый документ с параметрами: ширина – 1440 пикс, высота – 1500 пикс, разрешение – 72 пикс/дюйм.

Шаг 2. Создание шапки

Создадим новую группу и назовем ее Шапка. Все слои созданные в этом шаге помещаем в эту группу.

Устанавливаем вертикальные направляющие на 250 и 1190 пикс, и горизонтальную на 300 пикс. (Просмотр ® Новая направляющая).

Создаем новый слой и называем его Шапка. С помощью инструмента Прямоугольная область создаем выделение

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Установим основной цвет – 204139 и фоновой – 002931. С помощью инструмента Градиент с настройками

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Зальем выделенную область и снимем выделение (CTRL+D).

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Выберем инструмент Кисть Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопес параметрами

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Установите кисть в середине верхней части шапки и щелкните один раз.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Поставьте горизонтальную направляющую с положением на 50 пикс. Выделите верхнюю часть и удалите ее.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Создаем новый слой. Вдоль верхней горизонтальной направляющей создаем выделение толщиной в 1 пикселей, для этого щелкнем по направляющей инструментом Область (горизонтальная строка) Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе. Заливаем произвольным цветом.

Добавим эффект слоя Наложение градиента, нажав на кнопку Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопеи устанавливаем параметры

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Добавим название. Выберите инструмент Текст. Шрифт установим Impact, размер 200 пунктов. Установим к слою эффект Внешнее свечение, а Заливку слоя установим 0%.

Удерживая нажатой клавишу CTRL, щелкните по иконке текстового слоя. Создадим новый слой.

Чтобы залить текст необычной заливкой, нужно создать собственную заливку. Для этого создаем новый слой 10 на 10 пикселей, разрешение – 72 пикс/дюйм, фон – прозрачный.

Установим вертикальную и горизонтальную направляющие на 5 пикселей. С помощью инструмента Прямоугольное выделение создать выделение и залить его цветом – 012931. Получим:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Выполним команду Редактирование ® Определить узор. Дать название узору и нажать Ок.

Перейдем в документ шаблона. Выберем инструмент Заливка. Устанавливаем параметры

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

И заливам выделение.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Шаг 3. Создание панели навигации

Создаем группу Навигация и размещаем в нее слои этого шага.

Поставьте горизонтальную направляющую на 370 пикс. Создайте новый слой.

Выделите область между горизонтальными направляющими и залейте ее цветом 012a31.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Теперь добавим эффекты слоя: Тень, Наложение градиента и Обводка.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Создаем новый слой. Заливаем выделение 002931 цветом. Сжимаем на 2 пикселя. Нажимаем клавишу DELETE и задаем слою непрозрачность 30%. Получим:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Создаем еще один новый слой. Заливаем его черным цветом, сжимаем на 1 пиксель, нажимаем клавишу DELETE. Снимаем выделение. Получим:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Шаг 4. Создание кнопки

Еще создаем группу и называем ее Кнопка. Новые слои помещаем в нее.

Создаем новый слой. Выбираем инструмент Прямоугольник со скругленными углами, радиус скругления задаем 20 пикселей

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Применим к слою эффекты: Внешнее свечение и Обводка.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Создайте новый слой и нарисуйте еще одну овальную фигуру внутри прежней.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Добавим новой фигуре стили слоя: Внутреннее свечение, Обводка и Наложение градиента.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Нажав клавишу CTRL, щелкните по иконке слоя внутренней части кнопки. Создайте новый слой. Выберите инструмент Прямоугольная область и, зажав клавищу CTRL, выделите нижнюю часть кнопки. Получившееся выделение залейте белым цветом. Получим:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Уменьшаем непрозрачность до 15%. Получим:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

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

Шаг 5. Создание фона

Перейдем на слой Фон. Созданным нами ранее узором зальем слой с параметрами:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Создадим область где будет размещаться наш текст. Создадим новый слой. Добавим эффекты слоя: Тень и Обводка с параметрами

Источник

Создаем простой и понятный макет портфолио

Окончательное изображение

Программное обеспечение: Photoshop CS3 и выше.

Ресурсы

Шаг 1

Давайте для начала создадим в Photoshop новый документ. Нажмите CMD/CTRL+N и установите для документа ширину 1400 пикселей, высоту 1630 пикселей:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Теперь давайте создадим направляющие, чтобы наш макет был идеально выровнен. Перейдите в Вид> Новая направляющая и задайте следующие вертикальные направляющие: 200 пикселей, 450 пикселей, 700 пикселей, 950 пикселей и 1200 пикселей:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Шаг 2

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

После этого продублируйте слой ( CMD / CTRL + J ) и переместите копию в правую часть документа. Используя тот же инструмент, введите надписи, чтобы они представляли ссылки на разделы портфолио. На рисунке ниже показано, как этот сделал я:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Шаг 3

Перейдите в Слой> Новый> Группа или просто нажмите иконку быстрого создания группы в нижней части палитры слоев. После этого выберите инструмент « Прямоугольник » ( U ) и нарисуйте между первой и последней направляющей прямоугольник размером 1000 на 574 пикселей. С помощью инструмента « Перемещение » ( V ) переместите эту фигуру на 40 пикселей ниже ссылок навигации, чтобы между элементами было достаточно свободного пространства, и они выглядели аккуратно:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Отлично! Теперь нам нужно немного затемнить изображение, чтобы текст на нем легко читался.

Создайте новый слой под названием Shadow и добавьте маску, как мы делали чуть раньше. После этого выберите инструмент « Градиент » ( G ) и задайте переход градиента от черного к прозрачному. Задайте для параметров градиента значения, приведенные на рисунке ниже:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Не забудьте оставить немного свободного пространства вокруг текста, чтобы он выглядел аккуратно. Чтобы следовать общим принципам разработки дизайна, слева и снизу я оставил свободное пространство шириной в 40 пикселей:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Теперь нам нужно создать кнопку призыва к действию, чтобы предложить посетителю подробнее вникнуть в суть предлагаемых услуг. Выберите инструмент « Прямоугольник » ( T ) и нарисуйте прямоугольник с размерами 212 на 46 пикселей.

Поместите его справа от изображения, оставив с каждой стороны прямоугольника по 40 пикселей свободного пространства ( снизу у нас будет отступ 30 пикселей, так как нам нужно выровнять кнопку по горизонтали с заголовком ):

Шаг 4

Задайте для снимков размер 313 на 235 пикселей и разместите их в три колонки по два снимка в каждой. Оставьте отступ 40 пикселей сверху и снизу и 30 пикселей между изображениями и по бокам:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Шаг 5

После этого с помощью инструмента « Перемещение » ( V ) переместите прямоугольник на 40 пикселей ниже примеров работ:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

После этого добавьте еще немного информации, которая может понадобиться посетителям. Я включил сюда ссылки для связи в социальных сетях и свой электронный адрес. Убедитесь, что вы оставили достаточно свободного пространства по бокам, чтобы все выглядело аккуратно:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Скомпонуйте ранее введенную контактную информацию и новую кнопку, внесите соответствующие изменения в текст надписи кнопки, и все готово:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Источник

Собственное портфолио в Photoshop’e

В этом несложном уроке мы создадим своё первое портфолио для графических работ, простое и лаконичное, и поможет на м в этом графический редактор Photoshop CS3 +.

Детали урока:

Используемые ресурсы:

1 шаг:

Создаём новый документ в ФШ. Жмём Сmd/Ctrl + N, задаём ширину и высоту (1400х1630 пикс.).

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Для идеального выравнивания дизайна проведём несколько вспомогательных линий. Следуем в Просмотр – Вспомогательные элементы (View – New Guide), где задаём такие вертикальные линии: 200px, 450px, 700px, 950px и 1200px.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

2 шаг:

Получив вспомогательные линии, приступаем непосредственно к работе. Создаём новую группу с названием Top Nav, заходим в меню Слой – Новый – Группа (Layer – New- Group) или щёлкаем по значку группы в нижней области панели слоёв.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Активируем Горизонтальный Текст (Horizontal Type Tool) (T), помечаем шрифт Montserrat, задаём размер 20px, цвет — синий #075dfb, и вводим имя создаваемого портфолио, после чего устанавливаем его рядом с вертикальной вспомогательной линией, предусмотрев немного места сверху, в нашем случае, это 40px.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Далее, копируем слой (Cmd/Ctrl + J), выносим его в правую область холста. Применяя тот же инструмент, меняем текст на ссылки, которые нужно разместить в портфолио. Образец прилагаю:

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

3 шаг:

Группу Top Nav сворачиваем нажав на маленькую стрелку рядом с именем группы, и создаём новую группу, обозначив её как Featured.

Следуем в меню Слой – Новый – Группа (Layer – New – Group) или просто щёлкаем по значку группы в нижней области панели слоёв, активируем Прямоугольник (Rectangle tool) (U) и между первой и последней вспомогательными линиями выводим прямоугольник форматом 1000x574px.

Задействовав Перемещение (Move tool) (V), переносим эту фигуру на 40рх ниже от навигационной стрелки, чтобы разделить достаточно свободным пространством.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

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

Размещаем слой с этой картинкой поверх слоя с прямоугольником, и зажав Alt, наводим курсор на миниатюру слоя. Появится стрелка, нажав на которую мы создадим Обтравочную Маску так, чтобы все объекты расположенные внутри обтравочной маски разместились внутри части с прямоугольником.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Великолепно! Теперь требуется имитировать тень на картинке, чтобы размещённычй нами сверху текст, стал читабельным.

Создаём очередной слой Shadow (Shift + Cmd/Ctrl + N), создаём для него обтравочную маску аналогично прошлому шагу, активируем Градиент (Gradient Tool) (G), где отбираем от черного к прозрачному. Параметры градиента показаны ниже.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Зажав Shift, растягиваем градиент от нижней части картинки к верху, после чего уменьшим непрозрачность до 65-ти %.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

На очереди заголовок. Инструментом Горизонтальный текст (Horizontal Type Tool) (T) и шрифт Montserrat, задаём размер букв 40px, с цветом #FFFFFF, после чего прописываем суть наших работ в трёх-пяти словах, соблюдая разумную дистанцию возле текста, для визуального баланса.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Не помешает наличие яркой и бросающейся в глаза иконки, поэтому берёмся за Прямоугольник (Rectangle Tool) (T), которым выводим форму размером 212x46px. Размещаем его в правой части нашей картинки, как всегда резервируя пространство в 40px вокруг (30px внизу, поскольку нам потребуется его выровнять по горизонтали с названием).

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Активируем Горизонтальный Текст (Horizotal Type Tool) (T), задаём чёрный цвет #000000, размер букв — 14px, прописываем то, что нужно на нашей кнопке, после чего размещаем надпись по центру белого прямоугольника.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

4 шаг:

Длу улучшения стиля портфолио, нужно добавить побольше наших работ, а для этого открываем группу Featured нажав на стрелку возле её названия и создаём группу Work.

Далее, конвертируем выбранные изображения в смарт-объекты, нажав на правую клавишу мыши (Convert to Smart Object).

Зажав Сmd/Ctrl + T меняем габариты картинок на 313×235 px, размещаем их в колонки по два. Резервируем свободное пространство по 40px внизу и вверху, и 30px по сторонам и между картинками.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

5 шаг:

С этим мы закончили. Скрываем группу Work, создаём новую группу Footer. Берёмся за Прямоугольник (Rectangle Tool) (U) и выводим большой прямоугольник окрашенный в цвет #075dfb, ранее нами задействованный так, чтобы он скрывал нижнюю область документа. Это послужит фоном для нижнего колонотитула. После этого, инструментом Перемещение (Move Tool) (V) размещаем его на 40px ниже наших изображений.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

для заполнения нижнего колонтитула выбираем Горизонтальный Текст (Horizontal Type Tool) (T), размером 16px и белого цвета, после чего вписываем слово БЛОГ (BLOG), а снизу — ссылки на посты блога. Размещаем эти надписи, зарезервировав сверху расстояние в 70px, визуально делая наш нижний колонотитул более сильным и независимым.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Добавляем больше информации, полезной для посетителей (ссылки на социальные сети, контакты и прочее)

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Нам потребуется снова создать кнопку действия для использования её посетителем, а для этого заходим в группу Featured, находим слои с кнопкой, зажав Cmd/Ctrl щёлкаем по слоям с прямоугольником и текстом, далее жмём Cmd/Ctrl + J для их копирования. Переносим их в группу Footer и размещаем сверху фона. Применив ранее созданный текст, переносим его на только что созданную кнопку и корректируем.

Как сделать портфолио в фотошопе. Смотреть фото Как сделать портфолио в фотошопе. Смотреть картинку Как сделать портфолио в фотошопе. Картинка про Как сделать портфолио в фотошопе. Фото Как сделать портфолио в фотошопе

Осталось добавить свой копирайт, чтобы защитить свои шедевры, а для этого просто применим ранее созданный текст, продублировав его и изменив на всё что угодно. Размещаем текст в 60рх ниже от последнего текста, вот и всё!

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *