[Борцы за рекламу '12] - Ps1. Инструментарий

Доброго времени суток всем. Т.к у ребят сессия, чтобы не тратить попросту и наше, и их время на приезды/переезды и сами занятия, решила начать выкладывать гайды прямо сюда. Так как никто особо не знаком с Photoshop, а всем хочется. Итакс, начнем!

Прежде всего, вам необходимо установить программу Adobe Photoshop на свой компьютер. Можно купить, можно скачать, роли не играет, главное чтобы всё работало. Я буду показывать на примере Adobe Photoshop CS3 Extended. Тем, у кого версия старше, не страшно, ибо они особо не различаются (кроме CS6 конечно же), вплоть до CS5 включительно.

Сегодня мы разберем основные понятия и панель инструментов в Photoshop.
Итак, Вы установили и запустили программу. Вот как она у Вас выглядит (в версиях постарше, может выглядеть чуть иначе, не страшно):

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

Итак, создание нового файла. Чтобы создать новый файл, следует выполнить следующие действия:

1. Нажимаем "Файл"
2. Жмем "Новый"

Что в итоге у Вас должно открыться:

Разберем каждый отдельный параметр:

• Имя (Name) - имя будущего документа. Чаще всего этот параметр не задают, а имя файлу назначают при сохранении.

• Ширина (Width) и Высота (Height) - ширина и высота будущего изображения. Удобнее всего задавать в пикселах. Пиксел (Пиксель/Pixel) - единица изображения в растровой (что такое растровая, и какие бывают другие виды графики, мы с Вами разберем немного позже, либо прямо на занятиях) двухмерной графике. Именно из пикселов, как из кирпичиков, строится изображение.

• Разрешение (Resolution) - количество точек на единицу длины. Чем выше этот показатель, тем качественнее изображение, но и больший размер файла. Поэтому за норму принято разрешение в 72 пиксела на дюйм (для печати требуется не меньше 250, а то и 300).

• Режим (Color mode) - самый распространенный RGB* цвет (color), т.к. позволяет использовать все видимые человеческим глазом цвета. Глубина цвета задается в битах, хватает стандартных 8 бит.

• Содержимое фона (Background contents) - определяет фон изображения (белый, прозрачный, цвет заднего плана).

Остальные настройки используются редко. Сделайте настройки как на картинке и щелкайте OK.

Панель инструментов

В данной статье, я расмотрю только некоторые из них.

Инструменты выделения

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

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

Итак, для прямоугольного выделения имеем следующие параметры: 

- новое выделение. Создается новое выделение, при этом имеющиеся выделенные области (если они есть) исчезают.

- добавить к выделению. Обозначенная область добавится к уже существующему выделению.

- удалить из выделения. Исключает выделенную область из выделения.

- выделить пересечение. Из двух выделений (старого и нового) выделит область пересечения.

Растушевка - по краям выделения появляется область частично выделенных пикселов. Позволяет сделать плавный переход объекта в фон.   

Стиль - задает способ выделения: нормальный (normal) - свободное выделение, заданные пропорции (fixed aspect ratio) - пропорциональное выделение, фиксированный размер (fixed size) - область выделения заданного размера.  

Для всех инструментов выделения параметры аналогичны.

Выбор цвета

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

1 - цвет переднего плана.

2 - цвет фона.

3 - установить цвета по умолчанию (т.е. черный и белый).

4 - поменять местами цвета переднего плана и фона.

Щелкните по квадратику, и откроется окно сборщика цветов. Щелкните по понравившемуся цвету, а затем ОК. Цвет, который вы выбрали станет цветом переднего плана. Теперь щелкните по "поменять местами цвета переднего плана и фона" и проделайте тоже самое со вторым квадратиком. Подробнее о цвет читайте в статье цвета для web. 

Теперь рассмотрим следующую группу инструментов.

Инструменты заливки

 - заливка. Щелкните по этому инструменту и удерживайте левую клавишу мыши, раскроется меню выбора: градиент и заливка.

Здесь можно выбрать необходимое.  Ведро - заливает изображение (выделение) цветом или текстурой.  Рассмотрим панель параметров:

Итак, для заливки имеем следующие параметры: 

• Заливка (fill) - определяет, что использовать в качестве "краски": основной цвет (foreground)зальет основным цветом, шаблон (узор - pattern) зальет некоторым узором. 

• Шаблон (pattern) - узор для заливки.

• Режим (mode) - способ наложения пикселов, значений много и рассматриваться будут по мере необходимости. 

• Непрозрачность (opacity) - определяет степень прозрачности заливки.

• Допуск (tolerance) - диапазон цветов для заполнения.

Галочка сглаживание означает смягчить края перехода.

Второй подраздел, который имеется в "Заливке" - градиент.

 - градиент. Создает заливку с плавным переходом между двумя или несколькими цветами.

Рассмотрим панель параметров:

 - если щелкнуть по срелочке справа, то откроется палитра с вариантами градиента, при двойном щелчке перед стрелкой откроется окно редактирования градиента (здесь можно настроить свои варианты градиента).

 - определяет вид градиента (слева направо - линейный, радиальный, угловой, отраженный, ромбовидный).

Инверсия (reverse)- галочка указывает геометрически перевернуть градиент.

Дизеринг (глубина - dither) - галочка указывает сгладить для уменьшения сегментации.

Прозрачность (transparency) - галочка указывает на использование прозрачности.

Сохранение изображения

Щелкните пункт меню "Файл (File)", в отрывающемся меню вы увидите привычный пункт -"Сохранить Как (Save As)", и новый - "Сохранить для Web (Save for Web)". Разберемся какой для чего.  Если вы работаете над изображением и хотите иметь возможность изменять его в будущем, то следует выбрать пункт меню - Сохранить Как (Save As)

Где сохранять и какое имя дать - ваше личное дело, а вот формат будет *.PSD;*.PDD. Именно в этом формате сохраняются все ваши настройки (у нас их пока нет, но позже появятся). Таким образом, сохраняется не картинка целиком, а сохраняются ее части, каждую из которых вы сможете изменить когда захотите. Чтобы просто сохранить картинку, будь то JPEG, PNG, TIFF и т.п, в "Тип файлов" измените на тот формат, который Вам нужен. К слову, о картинках, а точнее о их форматах. Для того, чтобы сохранить картинку (возможно для дальнейшей работы, а может оно Вам такое и нужно) с прозраным фоном (!), сохраняйте ее в формате ".png", все остальные форматы сохраняют Вашу работу с белым фоном. Формат картинки ".jpeg" (.jpg), тяжелее всех остальных (имеется ввиду по весу самого файла). Подробнее о форматах поговорим в следующих уроках.

Если же ваше изображение готово, то выбирайте пункт меню - Сохранить для Web (Save for Web). Изображение будет сохранено оптимизированным для Интернета (т.е. с наилучшим сочетанием качество\размер файла). Отрывшееся окно сохранения следует рассмотреть подробнее:

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

Оригинальный (original) - изображение как оно есть. Как правило, большой размер файла, недопустимый для web. Оптимальный (optimized) - оптимальное соотношение качества и размера файла с точки зрения программы. 2-up, 4-up - соответственно два и четыре варианта изображения рядом, внизу каждого указан размер. Вы можете выбрать оптимальный на ваш взгляд.

В правом верхнем углу этого окна задаются дополнительные настройки:

Здесь можно выбрать формат сохраняемого изображения. Общие рекомендации - используйте форматы JPEG и PNG для фотографий с тонкими реалистичными цветовыми переходами, формат GIF - для контрастных, малоцветных рисунков. Кстати, все рисунки на этой страницы сохранены в формате GIF.

Итак, выбирайте самое оптимальное изображение на ваш взгляд и щелкайте по кнопке Сохранить (Save). Откроется уже привычное окно сохранения, где следует указать Папку (куда сохранить) и Имя файла, остальное будет уже указано, снова щелкаем по Сохранить (Save). Изображение для web готово.

На этом на сегодня всё, надеюсь основные понятия Вам понятны (а если не понятны, пишите в личку в вк (ссылки будут ниже)). Позднее я выложу второй урок, в котором мы рассмотрим работу с текстом и с основным понятием графических программ - слоями.

Всем спасибо, меня зовут Маша,
До скорых встреч!

Контакты:
vk - http://vk.com/masha_kovalenko
twitter - http://twitter.com/masha_kovalenko
facebook - Masha Kovalenko
icq - 598114936
mail - click2fun@i.ua
skype - sypiosypio
youtube - http://youtube.com/theclick2fun