Единое окно доступа к образовательным ресурсам

Компьютерная графика и web-дизайн: Учебное пособие

Голосов: 7

Учебное пособие содержит основные понятия, терминологию и справочные материалы. Изложен теоретический материал по растровой и векторной графике. Рассмотрены особенности подготовки графики для печати и web-изданий в профессиональном редакторе Photoshop. Пособие предназначено для студентов второго курса специальностей 030602 "Связь с общественностью" и 030901 "Издательское дело и редактирование" вечернего, заочного и дневного отделений, а также может быть полезно студентам других гуманитарных специальностей.

Приведенный ниже текст получен путем автоматического извлечения из оригинального PDF-документа и предназначен для предварительного просмотра.
Изображения (картинки, формулы, графики) отсутствуют.
        · Adobe Illustrator – векторный редактор, в основном используется при соз-
дании векторной статической графики (простых, схематичных вещей, таких, как,
например, логотипы, кнопки, геометрические узоры), но может так же использо-
ваться и для векторных анимаций. В Illustrator также возможна вставка и обработ-
ка растровой графики (естественно, возможности работы с растровой графикой
гораздо уже, чем, например, в Photoshop). По общепринятому мнению, Adobe
Illustrator и CorelDRAW программы – конкуренты и представляют собой самые
мощные программные средства. Есть вещи, которые невозможно сделать в
Illustrator’е, но можно в CorelDRAW, и наоборот. Для тех, кто работает в
Illustrator’е, удобно то обстоятельство, что сочетания клавиш для многих опера-
ций совпадают с Photoshop. По количеству операций с объектами уступает редак-
тору CorelDRAW.
    · CorelDRAW – признанный лидер среди профессиональных графических
редакторов. Если собираетесь серьезно работать с векторными изображениями,
выбирайте CorelDRAW. Это повысит вашу ценность как специалиста. Редактор
отлично справляется с такими задачами, как обработка и создание векторной и
растровой графики, web-дизайн, верстка, цветоделение, разработка новых шриф-
тов, нанесение штрих-кодов. Является наилучшей программой для полиграфии.
Поставляемые с ней дополнительные программы обеспечивают работу с аними-
рованной векторной графикой. Этот редактор поддерживает многостраничные до-
кументы. Однако следствием высокой мощности является требовательность к ре-
сурсам компьютера.
         Растровые:
    · Microsoft Paint. Простейший графический редактор, поставляемый вместе с
операционной системой Windows, обладает минимумом возможностей и вряд ли
может быть применен в сколько-нибудь серьезной работе.
    · Microsoft Photo Editor – Этот редактор предназначен в основном для рабо-
ты с фотографиями. Часто поставляется с пакетом Microsoft Office, поэтому рас-
пространен довольно широко. Оснащён скромными средствами для редактирова-
ния изображений.
    · Microsoft Office Picture Manager – пришёл на смену редактору Microsoft
Photo Editor. Очень удобный редактор для небольшой корректировки изображе-
ний. Содержит настройки: яркость-контрастнось, цвет, поворот и отражение, уст-
раняет эффект «красных глаз», обрезка, изменение размера, а также в автоматиче-
ском режиме помогает сжать изображение с учётом его дальнейшего использова-
ния, к примеру, для сообщений по электронной почте. Организует достаточно
удобный просмотр графики.
    · Microsoft Image Composer – наиболее развитое средство обработки графи-
ки из всех программ фирмы Microsoft. Главное достоинство продукции Microsoft –
простота и удобство интерфейса. Этот редактор занимает немного места на диске
и очень быстро загружается. Поставляется вместе с редактором анимированной
графики Microsoft Gif Animator и программой для создания web-страниц Microsoft
FrontPage.
    · Corel Painter. Растровый графический редактор, разработанный корпораци-
ей Corel, не стоит путать с Microsoft Paint, встроенным в ОС Windows. Главное
                                        10


отличие Corel Painter от других – большой выбор инструментальных «художест-
венных материалов», некоторые из которых имитируют реальные (например, аэ-
рографы, масло, пастель, акварель и др.), но есть и множество других, а кроме
этого – возможность создавать свои. Для удобства работы рекомендуется исполь-
зовать графический планшет: в зависимости от давления и наклона ручки будет
изменяться толщина линии [10].
   · Adobe Photoshop – самый совершенный профессиональный редактор рас-
тровой графики и самый популярный. Его основное предназначение – обработка
готовых изображений, таких, как отсканированные фотографии. Последние вер-
сии дополнены компонентами для работы с web-графикой и с видеомонтажом.
Вместе с другими программами фирмы Adobe он может составить интегрирован-
ный пакет дизайнерских программ, способный удовлетворить самые требователь-
ные запросы.
    Наряду с программами по созданию и редактированию графических изобра-
жений, необходимо иметь программу, позволяющую сортировать и просматри-
вать, выводить на печать графические файлы вне зависимости от того, в каком ре-
дакторе они были созданы. Как правило, программы для просмотра графики ос-
нащены дополнительными, позволяющими преобразовывать форматы файлов и
выполнять не сложные коррекционные работы (обрезка, сжатие файлов, «коррек-
ция кранных глаз», общая цветокоррекция и т.п.), создание и запись изображений
виде слайд-шоу, для последующего просмотра на компьютере, web-сайте или на
CD/DVD приводах.
                    Программы, организующие просмотр графики
    · ACDSee 7.0 Powerpack – многофункциональный инструмент для просмот-
ра, конвертирования и редактирования изображений. Обеспечивает расширенный
поиск, сортировку, печать и запись изображений на CD и DVD носители. Под-
держивает большое количество форматов, в том числе аудио- и видеоформаты
файлов.
Кроме того, ACDSee позволяет оценивать изображения, записывать их на CD и
DVD носители и, с помощью Easy Select и Selective Browsing, локализировать фо-
тографии из различных папок:
    - Magnifying Glass View – дополнение, которое дает пользователям возмож-
ность детально изучать фотографию, а также проверять ее на наличие дефектов,
двигая указатель мыши по определенным участкам изображения;
    - Master Keyword List определяет ключевые слова для файлов, используя при
этом основной список ключевых слов;
    - Slideshows создает слайд-шоу в формате HTML для размещения на web-сайте
или CD/DVD носителях, а также слайд-шоу в специальном формате для показа на
компьютере;
    - Screensavers обеспечивают возможность плавных переходов (Hollywood-
style) от одного изображения к другому;
    - Seamless Three Step Acquire Wizard автоматически обнаруживает фотогра-
фии, предназначенные для импорта с камер, сканеров, CD или любых других уст-
ройств;

                                        11


    - Pan Lock позволяет сравнивать детали в сериях фотографий путем автомати-
ческого переключения с одной фотографии на другую, сопровождающегося зум-
мированием одинаковых участков изображения;
    - Улучшенный пользовательский интерфейс;
    - Расширенные возможности сортировки и поиска – ищет и сортирует фото-
графии по любой относящейся к файлу информации;
    - Преобразование баз данных – преобразовывает базы данных старых версий в
базы данных для ACDSee 7.0;
    - EXIF Print – использует формат EXIF4 (Exchangeable Image File Format) для
обеспечения лучшего качества печати на домашних принтерах.
    · ACDSee Classic 2.44 – Популярная программа для просмотра, организации
файлов с изображениями. Поддерживаются более 30 распространенных графиче-
ских форматов, GIF-анимация, просмотр архивов, возможно создание слайд-шоу.
Программа поддерживает простое редактирование графики (поворот картинки,
изменении яркости/контрастности, наложение эффектов и т. д.) Пакет ACDSee
Classic (ранее известный под названием ACDSee 32) представляет собой ориги-
нальный продукт компании ACD Systems для быстрого и удобного просмотра
изображений и их уменьшенных образцов. Удобный пользовательский интерфейс
и доступные функции управления, такие, как пакетное переименование файлов,
поворот, создание описаний и временных меток. Пакет ACDSee Classic способен с
высокой скоростью отображать в полном разрешении 15 форматов изображений,
в том числе BMP, JPEG, PIC и GIF. Имеется возможность упорядочивания сним-
ков и рисунков с индивидуальными описаниями, что позволяет осуществлять их
быстрый поиск. Поворот изображения в формате JPEG происходит без потери ка-
чества. Также поддерживается воспроизведение звуковых файлов в формате
WAV. Гибкий и эффективный интерфейс содержит ярлыки и кнопки для доступа
к наиболее востребованным функциям. Данный пакет ориентирован на просмотр
и упорядочение коллекции изображений с возможностью печати.
    · IrfanView 4.10 – мощный, маленький, быстрый и удобный инструмент.
Имеет поддержку огромного числа форматов. Имеет возможность пакетного пре-
образования, подключения плагинов, просмотра большого числа изображений.
Ничего лишнего.
    Наряду с программами просмотра существуют программы, ориентированные
на презентабельное отображение подготовленных графических объектов. Это
программы по созданию фотоальбомов. Создать фотоальбом можно и в графиче-
ских редакторах. Такими возможностями располагает Photoshop. Специализиро-
ванные программы оснащены разнообразными эффектами отображения снимков
и возможностью оживить показ музыкальным сопровождением или скомбиниро-
вать с показам видеофайлов.



   4
     Стандартный формат для добавления к цифровым фотографиям метаданных: информации
об используемой камере, дате, времени и условиях съемки и так далее. Поддерживается боль-
шинством популярных графических пакетов
                                             12


                     Программы формирующие фотоальбомы
   · Pinnacle Instant PhotoAlbum 1.0.48 – программа, с помощью которой соз-
даются фотоальбомы и слайд-шоу из различного сочетания звуковых, видеофай-
лов и файлов изображений, на любых носителях (CD и DVD). Программа может
напрямую работать с цифровыми камерами и сканерами. В программу встроены:
графический редактор, редактор меню дисков с готовыми шаблонами, редактор
этикеток дисков и вкладышей для боксов.
   · FlipAlbum 6.0 Pro – создаёт альбом с переворачивающимися страницами –
иллюзия классического альбома. Версия Professional поддерживает файлы в фор-
мате MPEG, AVI и MP3, которые можно внедрять на альбомные страницы. Соз-
данный альбом можно защитить паролем. Имеется возможность распечатать
страницу во время просмотра.
    вышеперечисленный список не отражает всего многообразия программ.
Приведены наиболее известные. Основная цель знакомства – помочь сориентиро-
ваться в программах для решения конкретной цели с наименьшими затратами по
времени.
           1.1.5. Обоснование выбора программного обеспечения
    В рамках учебного курса рассматриваются профессиональные редакторы, за-
воевавшие всемирную известность. Это редакторы векторной графики – Corel-
DRAW и растровой – Photoshop. Спрос на данные редакторы определяется со-
временными требованиями «рынка труда». Требования к специалистам по своему
профилю можно проанализировать по следующим адресам:
   · http://omsk.rabota.ru (Крупный портал поиска работы: вакансии, резюме);
   · http://vakant.ru (Реальная работа из виртуального мира: вакансии, резюме);
   · http://www.rbs.ru/compans/list.php?fo_group_id=315300000000
(Омский деловой портал: трудоустройство, подбор персонала).

         1.1.6. Общие принципы работы в графических редакторах
    В процессе обучения компьютерной графике прослеживается взаимосвязь ос-
новных команд и организация компонентов в интерфейсах программ. Для удобст-
ва изложения определимся с некоторыми основными понятиями.
    Щелчки мыши. Говоря о щелчке мышью, подразумевается однократное на-
жатие левой кнопки мыши с отпусканием. Двойной щелчок мыши означает, что
нужно быстро выполнить два нажатия подряд.
    выделение объектов. Щелчок левой клавишей мыши по нужному объекту
позволяет выбрать объект. При выборе нескольких объектов необходимо удержи-
вать на клавиатуре, во время выбора, клавишу Shift в редакторе CorelDRAW,
Ctrl, в большинстве случаев. Группу объектов можно выделить последовательно,
щелкая мышью на объектах при нажатой клавише Shift. В режиме выделения
рамкой следует установить мышь в некоторой точке, нажать левую кнопку и, не
отпуская, начать перемещать мышь. При этом появится пунктирная рамка, кото-
рая и будет ограничивать область выделения. Когда рамка достигнет нужных Вам
размеров, отпустите кнопку мыши. В результате все объекты, попавшие в область
рамки, окажутся выделенными.
                                        13


    Перетаскивание объектов. Под перетаскиванием понимается следующее:
устанавливаете мышь на каком-либо объекте, нажимаете ее левую кнопку и, не
отпуская кнопку, перемещаете мышь в нужное положение, после чего кнопку от-
пускаете. Объект оказывается перенесенным в новое положение.
    Операции с объектами. Операция трансформирования. Достаточно часто в
графических редакторах требуется увеличить (или уменьшить) объект, для этого
изображение выделяют, а затем тянут за угол изображения при нажатой левой
клавише до необходимого размера, но если при этом необходимо сохранить про-
порции, то при выполнении данной операции удерживайте нажатой клавишу
Schift.
    Для удобства пользователей, фирмы – производители придерживаются одно-
типного устройства интерфейса своих программ, что облегчает дальнейшее зна-
комство с профильными линейками программного обеспечения. Наибольшим
сходством обладают программы, выпущенные одним производителем. Рассмот-
рим организацию интерфейса программ Photoshop и CorelDRAW.
    Меню. Представляет собой список команд, расположенный в верхней части
экрана (Рис. 3).




                       Рис. 3. Меню программ Photoshop и CorelDRAW




     Рис. 4. Слева представлено окно (диспетчер объектов) в CorelDRAW, в котором располо-
   жены объекты в соответствии с их порядковым слоем. Представление слоёв в программе
 Photoshop показано в центре. Справа окно, в котором собраны элементы управления, предна-
        значенные для выполнения операции выдавливание в программе CorelDRAW
   Слои. Аналог кальке. Дают возможность работать с объектами, расположен-
ными в одном слое, не затрагивая других объектов. В CorelDRAW, по умолчанию,
все создаваемые объекты располагаются в разных слоях, в программе Photoshop

                                             14


создание слоёв зависит от пользователя. Возможна работа в одном фоновом слое.
В программах предусмотрены операции группировки и представления на экране с
учётом их последовательности и перекрытия (Рис. 4).
                                                    Палитра. Окно позволяю-
                                                    щее осуществлять работу с
                                                    цветом. Используются го-
                                                    товые палитры, или стили
                                                    заливок, а также имеется
                                                    возможность создания соб-
                                                    ственных палитр (Рис. 5).

         Рис. 5. Показаны палитры: слева в программе
              Photoshop, справа в CorelDRAW

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




                             Рис. 6. Панели свойств: верхняя в программе Photoshop для
                       инструмента Многоугольник, внизу в CorelDRAW для инструмента
                                             Многоугольное лассо.

                       Строка состояния. Находится внизу окна открытого доку-
                    мента и содержит информацию о документе и параметрах
                    выполняемой команды (рис. 8).
        Рис. 7.
  Инструмен-
 тальные пане-
   ли, слева в
   Photoshop,
    справа в
  CorelDRAW


                  Рис. 8. Строки состояния: верхняя в программе CorelDRAW информирует об
                  инструменте, о текущих координатах и размерах объекта; внизу в Photoshop,
                   при фиксации профиля документа, указывается текущая цветовая модель



                                               15


    Окна. Специальное окно, в котором собраны элементы управления, предна-
значенные для выполнения операций обработки изображения и настройки пара-
метров инструментов и команд. Как правило, их можно свободно перетаскивать
по экрану мышью и объединять друг с другом в удобной для Вас комбинации, а
при желании их положение можно зафиксировать (см. Рис. 4).




            Рис. 9. Контекстное меню при работе с текстовым блоком в программах:
                          слева в Photoshop, справа в CorelDRAW

    Контекстное меню. Появляется чаще всего при щелчке правой кнопкой мы-
ши на объекте и содержит набор команд, доступных для него в данный момент
(Рис. 9).




                                                                          Рис. 10.
                                                                Всплывающая подсказка и
                                                                   клавиша быстрого
                                                                доступа для инструмента
                                                                         Кисть




  Рис. 11. Подсвечена команда Вставить, рядом с которой указано клавиатурное сокращение
           для быстрого доступа к этой команде. Photoshop слева, CorelDRAW справа
    Всплывающая подсказка. Это строка, появляющаяся при подведении и
удержании указателя мыши к кнопке команды или инструмента. Содержит назва-
ние инструмента или описывает выполняемую им функцию (Рис. 10).
    Горячие клавиши и клавиатурные сокращения. Это средства ускорения
обращения к командам и инструментам. Горячая клавиша инструмента обычно
указана рядом с его названием. Чтобы воспользоваться ею, следует активизиро-
вать палитру инструментов и нажать указанную клавишу. вызов команды меню по
горячей клавише требует нажатия и удерживания клавиши Alt; горячая клавиша
команды обозначается подчеркиванием в ее имени. Кроме того, многим командам
                                            16


назначаются специальные сочетания клавиш для быстрого доступа – клавиатур-
ные сокращения, которые указываются в меню справа от имени команды (Рис. 11).
    Кнопки OK, Cancel (Отмена), Apply (Применить), Yes (Да), No (Нет), Back
(Назад), Next (Далее) и т. д., появляющиеся в диалоговых окнах, имеют одинако-
вое назначение во всех программах.
    Работа в любом графическом редакторе обычно происходит в такой по-
следовательности:
   1. Создание нового или открытие существующего файла.
   2. выделение объекта (слоя) или области.
   3. Наложение эффекта либо активизация инструмента щелчком мыши на его
обозначении в панели графики и работа с этим инструментом.
   4. Снятие выделения с объекта путем щелчка мышью на свободном месте окна
изображения.
   5. Сохранение файла.
                                  ПРИМЕЧАНИЕ
    Графические редакторы иногда надолго «задумываются», особенно
CorelDRAW, в таком случае следует проявить терпение и не пытаться прерывать
их работу и тем более перезагружать компьютер, даже если он, как Вам кажется,
ничем не занят и не пишет на диск.

         1.2. ОСНОВНЫЕ ВИДЫ КОМПЬЮТЕРНОЙ ГРАФИКИ,
                  ИХ СВОЙСТВА И ХАРАКТЕРИСТИКИ
                                1.2.1. Растровая графика
    В разделе 1.1.3 были рассмотрены типы представления двухмерной графики.
Рассмотрим более подробно растровую графику. По своему составу она напоми-
                                        нает мозаику. Чем больше кусочков,
                                        тем подробнее получается рисунок.
                                        Роль кусочков выполняет пиксель. Оп-
                                        ределение пикселя было изложено вы-
                                        ше.
                                             Размеры пикселя зависят от раз-
                                        решения изображения.
                                            На рисунке Рис. 12 показано рас-
                                        тровое изображение и его увеличенный
                                        фрагмент. Отчетливо видны элементы
                                        квадратной формы, из которых скла-
                                        дывается изображение.
                                            Учитывая эту специфику построе-
                                        ния, растровая графика имеет следую-
                                        щие особенности:

         Рис. 12. Растровое изображение       · растровое изображение всегда
                                           прямоугольной формы;

                                          17


   · растровое изображение не столь гибко, как векторное, к изменению размера
(масштабирование может заметно ухудшить качество);
   · растровый документ не может содержать объекты в разных цветовых режи-
мах.
     Основной характеристикой растровой графики служит разрешение
     Разрешение изображения (resolution) – описывает, насколько детальным яв-
ляется данное изображение. Термин обычно применяется к изображениям в циф-
ровой форме, хотя его можно применить, например, для описания уровня грану-
ляции фотопленки, фотобумаги или иного физического носителя. Более высокое
разрешение означает более высокий уровень детализации [10]. Разрешение графи-
ческих файлов обозначают в PPI (количество пикселей на единицу длины (дюйм,
сантиметр) [16].




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

                                          18


    Следует четко различать: разрешение экрана, разрешение печатающего уст-
ройства и разрешение изображения. Все эти понятия относятся к разным объек-
там. Друг с другом эти виды разрешения никак не связаны, пока не потребуется
узнать, какой физический размер будет иметь картинка на экране монитора, отпе-
чаток на бумаге или файл на жестком диске.
    Физическое разрешение монитора – количество точек (пикселей монитора)
приходящихся на один дюйм. Измеряется в DPI (Dots Per Inch). Оно равно 72 или
96 DPI.
    Настраиваемое разрешение экрана – это стандартизованное количество пик-
селей, которые могут отображать мониторы, представленные в настройках экрана.
Ширина диапазона определяется физическими возможностями видеокарты и мо-
нитора. Измеряется в пикселях и определяет размер изображения, которое может
поместиться на экране целиком. Например, 800 × 600, 1024 × 768, 1280 × 1024,
числа означают размеры изображения в пикселях по горизонтали и вертикали,
указывающие на разрешение экрана монитора.
    Разрешение принтера – это свойство принтера, выражающее количество от-
дельных точек, которые могут быть напечатаны на участке единичной длины.
Разрешение измеряется в единицах DPI (точки на дюйм). Например, 300 DPI, 600
DPI, 1200 DPI. Указание DPI позволяет «привязать» изображение, размеры кото-
рого задаются в относительных единицах (пикселях) к физическим – дюймам.
    Физический размер изображения может измеряться как в пикселях, так и в
единицах длины (миллиметрах, сантиметрах, дюймах). Он задается при создании
изображения и хранится вместе с файлом.
    Если изображение готовят для демонстрации на экране, то его ширину и вы-
соту задают в пикселях, чтобы знать, какую часть экрана оно займёт.
    Например, изображение размером 100×50 пикселей займет на экране пример-
но 1×0,5 дюйма = 25х13 мм (100 pix/96 ppi = 1,04 inch; 50 pix/96 ppi = 0,52 inch; 1
дюйм = 25,4 мм). Приведенный расчет выполнен исходя из разрешения монитора
96 ppi.
    Для разрешения 72 ppi размер того же изображения окажется иным: 1,4×0,7
дюйма = 35×18 мм (100 pix/72 ppi = 1,39 inch; 50 pix/72 ppi = 0,69 inch). В файлах
изображений хранится информация о геометрическом размере и разрешении изо-
бражений. Эти величины используются при помещении изображения в программу
верстки или подготовки иллюстраций.
    Если изображение готовят для печати, то его размер задают в единицах дли-
ны, чтобы знать, какую часть листа бумаги оно займет.
                                                                        Таблица 1
   Основные значения разрешения изображения и сферы их применения [6]
 Значение раз-                          Сфера применения
   решения
    72 PPI          Экранное разрешение. В нем сохраняются изображения,
                 предназначенные для отображения на мониторе
    150 PPI         Среднее разрешение, применяемое при некачественной пе-
                 чати. В этом или близком ему разрешении печатается большин-
                                          19



    
Яндекс цитирования Яндекс.Метрика