- •Содержание
- •Глава 1. Виды компьютерной графики, их характеристика 6
- •Глава 2. Графический редактор adobe photoshop 19
- •Глава 3. Подготовка графики для web и мультимедиа 81
- •Глава 4. Основы web-дизайна. Язык html 90
- •Глава 5. Сайтостроение в Macromedia Dreamweaver 103
- •Глава 6. Проектирование web-сайта 122
- •Введение
- •I. Растровая, векторная, фрактальная графика
- •Глава 1. Виды компьютерной графики, их характеристика
- •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
1.7. Инструменты Осветлитель , Затемнитель , Губка
(изменения цветовых свойств)
Инструмент осветляет (Dodge) изображение, инструмент - затемняет (Bum). Губка (Sponge) уменьшает или увеличивает насыщенность цветов. |
|
ЗАДАНИЕ. Откройте фото Кот.jpg. Сделайте фото выразительнее - измените насыщенность фона, окраски кота. (результат - см. рис. справа, а также в презентации). Для инструмента Осветлитель задайте Диапазон - Средние тона. Проведите вокруг кота, осветив его ореол. |
|
Инструментом Затемнитель затемните фон по краям фото. Тогда кот со светлым ореолом будет выразительнее смотреться на темном фоне.
Для Губки задайте Режим - Снизить насыщенность. И по желанию Губкой можно уменьшить насыщенность шерсти кота, сделать её серее.
Для инструмента задайте Диапазон - Света. Осветите им центр морды кота (нос, глаза) и те части лап, подстилки, где должен падать свет.
1.8. Инструмент Обрезка (Рамка)
Инструмент Рамка (Обрезка) может делать 3 операции:
1- поворот всего холста; 2- обрезка холста по краям;
3- добавление частей холста по краям фонового цвета
ЗАДАНИЕ а. Отретушируйте фото авто.jpg. Чтоб повернуть фото и обрезать его по краям используй-те инструмент . 1) Итак инструментом : поверните фото (очертите вокруг всего фото рамку; |
|
наведите мышь на угловой маркер рамки; дождавшись изогнутой стрелки, поверните рамку влево, чтоб она стала параллельна авто. Нажмите Enter)
обрежьте по краям ненужные части (очертите рамку, чтоб внутрь неё попала часть фото, которую хотите оставить, остальное обрежется. Нажмите Enter)
2)
Инструментами Палец
и Размытие
уберите линию, пересекающую изображение,
а также рваные края фото.
3) Инструментами Затемнение уберите светлое пятно на бампере
ЗАДАНИЕ б. Отретушируйте фото девушки (файл На берегу.jpg). Поворот фото, обрезку по краям выполните инструментом . Для устранения дефектов используйте Штамп, Палец, Затемнение. |
|
2. Увеличение резкости
2.1. Инструменты увеличения резкости отдельных элементов (вручную)
В фото слева фотоаппарат был неправильно сфокусирован: внимание надо было привлечь к цветку со шмелем, но он получился нерезким, размытым. А второстепенный задний план получился резким, отвлекает внимание. |
Нечеткий оригинал Результат |
Частично эти недостатки можно убрать 2 инструментами (находятся на одной кнопке панели инструментов): |
|
Размытие
и Резкость
.
Они работают, как кисть. Имеют параметры:
диаметр кисти; сила действия инструмента (рекомендуют 50%, чтобы не получить излишне сильный эффект);
режимы работы (наложения новых пикселей на фото). Режимы есть: Нормальный, Замена темным /Светлым, Насыщение, Свечение (см. пункт 1.6).
Сравните действие разных режимы резкости - цветное фото см. в презентации.
ЗАДАНИЕ. Откройте файл Хмель.bmp. Для инструмента Резкость установите диаметр кисти =30, силу 50%, режим Замена темным. Мазками увеличьте резкость шмеля. В режиме Замена светлым увеличьте резкость цветка. |
|
Для инструмента Размытие установите диаметр кисти =30, силу 50%, режим Нормальный. Размойте зелень вокруг цветка. Сохраните результат
