- •Содержание
- •Глава 1. Виды компьютерной графики, их характеристика 6
- •Глава 2. Графический редактор adobe photoshop 19
- •Глава 3. Подготовка графики для web и мультимедиа 81
- •Глава 4. Основы web-дизайна. Язык html 90
- •Глава 5. Сайтостроение в Macromedia Dreamweaver 103
- •Глава 6. Проектирование web-сайта 122
- •Введение
- •Глава 1. Виды компьютерной графики, их характеристика
- •I. Растровая, векторная, фрактальная графика
- •II. Разрешение растровых изображений
- •1. Разрешение экрана монитора:
- •III. Изменение размеров, разрешения изображения
- •IV. Программы – графические редакторы двумерной графики
- •V. Форматы графических файлов
- •1. Критерии выбора формата файла
- •2. Методы сжатия информации (используемые в разных форматах файлов)
- •3. Виды форматов графических файлов
- •Глава 2. Графический редактор adobe photoshop
- •I. Выделение областей в Photoshop
- •4. Выводы: что можно делать с выделенной областью?
- •II. Инструменты рисования. Выбор цвета
- •III. Многослойные изображения
- •IV. Создание теней, отражений
- •V. Цветокоррекция
- •Цветокоррекция с помощью Пипеток
- •Особенности действия Пипеток :
- •Цветокоррекция Белой и Черной пипетками
- •VI. Ретушь – устранение дефектов фото
- •Типы дефектов: технические дефекты (царапины, пятна, отслоение эмульсии) и художественные (неправильная композиция, освещенность, неудачный фон).
- •1. Инструменты ретуши, коррекции
- •1.1. Инструмент `Штамп`
- •1.2. Инструмент `Восстанавливающая кисть`
- •1.3. Инструмент `Заплатка` (Patch)
- •1.4. Инструментом `Красные глаза` убираем дефект
- •1.5. Инструмент `Замена цвета`
- •1.6. Инструменты Размытие , Палец (Размазывание) , Резкость
- •1.7. Инструменты Осветлитель , Затемнитель , Губка
- •1.8. Инструмент Обрезка (Рамка)
- •2. Увеличение резкости
- •2.1. Инструменты увеличения резкости отдельных элементов (вручную)
- •2.2. Фильтры для увеличения резкости
- •2.2.1. Автоматические фильтры
- •2.2.2. Настраиваемые фильтры
- •3. Профессиональная ретушь фото:
- •Этап I. Создание снимков фото в палитре История
- •Этап II. Фильтр `Пыль и царапины`
- •Этап IV. Удаляем крупные дефекты Штампом
- •Этап V. Завершение ретуши: фильтр `Контурная резкость`
- •Методика использования фильтра `Контурная резкость`
- •VII. Использование каналов
- •2. Использование альфа-каналов
- •3. Создание рамок для фото, используя альфа-каналы
- •4. Получение черно-белых изображений (из цветных)
- •VIII. Векторные инструменты, контуры в Photoshop
- •2. Работа с контурами (Paths): обводка, заливка и пр.
- •3 . Векторные инструменты группы Перо (Pen)
- •С Установка стиля нового слоя вободное перо : создание контуров, выделений
- •Инструменты редактирования контуров
- •Глава 3. Подготовка графики для web и мультимедиа
- •I. Оптимизация – уменьшение объема файла
- •Х Таблица 5 арактеристики растровых форматов файлов
- •II. Создание рисунка на прозрачном фоне (без фона)
- •III. Анимация: разработка анимированных баннеров
- •Глава 4. Основы web-дизайна. Язык html
- •I. Основные понятия. Редакторы html
- •II. Структура html-кода страницы
- •III. Html-теги и атрибуты
- •Обязательные тэги
- •Форматирование абзацев, заголовков
- •Создание гиперссылок
- •Форматирование шрифта
- •Вставка изображения
- •Создание списков
- •Создание таблиц
- •Описание фреймов
- •Комментарии
- •Глава 5. Сайтостроение в Macromedia Dreamweaver
- •I. Интерфейс Dreamweaver. Начало работы
- •Начало работы в Dreamweaver
- •II. Принципы языка html и работа в режиме html-кода
- •III. Работа в режиме дизайна: форматирование текста
- •Форматирование абзацев
- •Создание списков
- •IV. Создание сайта в Dreamweaver
- •1. Настройки окна `Определение сайта`
- •2) В категории Удалённая информация (Remote Info)
- •3) В категории Примечания к дизайну (Design Notes)
- •2. Установка параметров страницы и русской кодировки
- •3. Разметка макета web-страницы
- •4. Настройка цвета страницы
- •5. Вставка рисунков
- •6. Ввод текста web-страницы
- •7. Настройка гиперссылок
- •Создание остальных страниц сайта и настройка ссылок
- •Рисунки в качестве ссылок. Карты изображений
- •Глава 6. Проектирование web-сайта
- •Этапы проектирования сайта
- •Содержание этапов работы по проектированию сайта
- •Рекомендуемая литература
- •241036, Г. Брянск, ул. Бежицкая, 14
VII. Использование каналов
1. Понятие канала. Полноцветное изображение в Photoshop состоит из 3-4 полутоновых изображений - каналов. Так, у рисунка в режиме RGB (режим для экранного показа) цвет каждого пикселя складывается из 3х цветов - красного (R), зеленого (G), синего (B). Поэтому весь RGB-рисунок можно разложить на 3 полутоновых рисунка: в оттенках красного цвета (Красный канал), в оттенках зеленого (Зеленый канал), в оттенках синего (Синий канал).
При их сложении получается обычный цветной RGB-рисунок. Каналы можно увидеть, открыв любой рисунок и включив палитру Каналы (если её нет, нажмите Окно /Каналы). Но есть особые альфа-каналы. Они хранят выделения, а не рисунок. Зачем? Часто нужно создать сложное выделение на рисунке и сделать что-то над выделенной областью; затем |
|
убрать выделение для нормальной работы с рисунком, а позже снова вернуть выделение. Чтоб не создавать выделение заново, его можно сохранить в альфа-
канале, а когда нужно - загрузить. ЗАДАНИЕ: сохраним выделение в канале 1) Откройте чашка.jpg и выделите чашку. Нажмите Выделение/ Сохранить выделение, дайте ему имя `Выделение`. Оно сохранится в альфа-канале. |
|
Откройте палитру Каналы (Channels). Посмотрите: внизу появился ещё один канал. Щелкните по нему - канал откроется (отобразится вместо фото). Вы видите - альфа-канал хранится как черно-белый рисунок, причем белым обозначена выделенная область, черным – невыделенная.
2) Вернитесь в обычный цветной канал RGB (щелкните по нему).
Сделаем наше выделение плавным (чтоб выделенные пиксели плавно переходили в частично выделенные, а только потом в невыделенные).
Нажмите Выделение/ Растушевка =15. Сохраните это выделение:
Выделение/ Сохранить выделение, дайте ему имя `Плавное выделение`.
В палитре Каналы щелкните по новому альфа-каналу - он отобразится. Вы видите - кроме белой и черной области (выделенной и невыделенной) появились пиксели в оттенках серого - так обозначаются частично выделенные пиксели. В теме 1, см. стр. 27, мы поясняли, как ведут себя частично выделенные пиксели, например, после растушевки контура выделения.
ВЫВОД: альфа-канал хранит выделение в виде черно-белого рисунка: белым цветом обозначены выделенные пиксели, черным - невыделенные, серым - частично выделенные (чем темнее серый, тем слабее выделены пиксели).
Главное - последующие операции (например, заливки, фильтры) действуют на 100% на выделенные области, не действуют на невыделенные, а на частично выделенные области операции действуют не в полную силу!
Выделение можно создать: а) обычным способом – прямо на фото и сохранить в альфа-канале; б) можно сначала создать пустой канал, там нарисовать рисунок выделения (черно-белыми цветами, также можно применять градиентные черно-белые заливки, деформировать выделение фильтрами!).
Чтоб загрузить такое выделение позже (при обработке фото), в палитре Каналы щелкают по каналу, удерживая Ctrl, или нажимают Выделение /Загрузить.
ЗАДАНИЕ. Как меняются каналы в разных цветовых режимах.
В фото чашки вернитесь в обычный цветной канал RGB, выделение снимите
Преобразуйте фото в серое полутоновое: Изображение /Режим /Градации серого. В палитре Каналы все цветные каналы соединятся в 1 Серый, альфа-каналы сохранятся (т.е. сохранятся выделения чашки, их можно загрузить).
Преобразуйте фото в черно-белое двуцветное (Изображение /Режим/ Битовый). В палитре Каналы канал Серый сменится на Растр. Но этот `чертежный` режим не может хранить альфа-каналы – они не сохранятся.
