Интернет- версия проекта MegaPlus.ru

на главную | обратная связь  

Компьютерная графика:
что это такое, и как с ней бороться

В доисторические времена древний человек не ограничивался только выживанием, а рисовал на стенах пещер сценки охоты, животных. Нашу современную жизнь вообще невозможно представить без изображений различного рода и предназначения. С появлением компьютера, картинки, как и многое другое, стали оцифровываться и существовать в электронном виде. Но, как и в любом деле, вместе с достоинствами этого процесса появились и недостатки. Они выражаются в появлении параметров оцифрованного изображения и терминов, их обозначающих. Для успешной работы с картинками, даже для такой простой операции, как отсканировать фотографию и послать ее по почте другу, желательно хотя бы немного понимать, что значат выражения "битовая глубина", "разрешение", "компрессия". Эта статья поможет вам получить представление, каким образом картинки "живут в компьютере". Своего рода небольшой графический ликбез.

Иэначально компьютерная графика делится на два направления. Это векторная или объектная, где изображение описывается математическими выражениями. Обычно векторными бывают чертежи, схемы, графики, логотипы. Но сначала мы займемся изучением другого направления, которое называется растровой. С ней обычному пользователю приходится сталкиваться гораздо чаще. Если вы хоть раз смотрели фотографии на мониторе или заходили в интернет, то вы лицезрели растровые изображения. Даже пиктограммы в операционной системе представляют собой именно растровые картинки.

Растровая графика

Разрешение

Если взять и увеличить в несколько раз такое изображение, скажем, оцифрованную фотографию, то мы увидим, что она состоит из одноцветных квадратов, словно мозаика. Они называются пикселами (pixel), сокращение, произошедшее от английского picture element (элемент изображения). И все красоты, видимые вами на мониторе, состоят только из этих пикселов.

Теперь рассмотрим очень важное понятие, которое называется "разрешением". Оно указывает количество пикселов на единицу длины. Обычно этой единицей служит дюйм. Говорят так: разрешение этого изображения составляет 200 точек или пикселов. Это значит, что если к картинке приложить линейку, то в одном дюйме окажется 200 пикселов. Только не путайте, не в квадратном дюйме, а именно в линейном. Записывается это так: 200 dpi, от английского dots per inch (точек на дюйм).

Чем больше разрешение, тем качественне получается картинка. Но это совсем не значит, что нужно сканировать фотографии с максимально возможным количеством точек. Возьмем для примера две одинаковые картинки одного размера, у одной будет разрешение 72 точки, а у другой - 150, и поместим их рядом на экране.
Разрешение 150 dpi Разрешение 75 dpi

Никакой разницы, верно? Дело в том, что физическое разрешение компьютерных мониторов составляет 72 dpi. Если изображение предназначено только для просмотра с экрана, то большие значения разрешения не принесут пользы, только бесполезно увеличится размер файла.

Для цветной печати, то есть журналов, буклетов, календарей существует стандарт в 300 dpi. Однако, как показывает практика, изображения неплохо смотрятся при разрешении 200 точек, при 150 - более-менее прилично, а дальнейшее уменьшение этого параметра ведет к появлению заметных квадратов-пикселов. Этими же цифрами можно руководствоваться и при печати на цветном принтере. Но если вы хотите получить сверхкачественное изображение, не отличимое от хорошей фотографии даже под лупой, и имеете фотопринтер, заряженный специальной бумагой, тогда имеет смысл делать разрешение у картинок более, чем 300 dpi. Увеличивать же количество точек на дюйм более 600 представляется малоцелесообразным.

Бывают ситуации, когда человек распечатывает прекрасно выглядящую на мониторе картинку, но на бумаге становится видно квадраты-пикселы. Оказывается, что разрешение этого изображения составляет 72 dpi. Так что проверяйте разрешение ваших картинок перед тем, как послать их на принтер, а уж тем более, в журнал.

Сразу хотим предостеречь от бездумного увеличения разрешения. Если ваше изображение имеет разрешение 36 dpi, и вы, не изменяя размер, поменяли это значение на 72 dpi, то ничего хорошего не получится. Количество информации в картинке останется такое же, как и было, и при печати все равно будут видны квадраты, только вместо одного пиксела они будут состоять из четырех. Методы интерполяции, применяемые в программах обработки растровой графики, частично могут сгладить этот эффект, но лишь на чуть-чуть.

Вывод таков: уменьшать разрешение можно без проблем, а вот увеличивать, не теряя в качестве, возможно только при уменьшении размера самой картинки. Если измерять изображение не в дюймах, а в пикселах, то их количество по каждой стороне можно увеличить примерно в полтора раза, без резкого падения качества. Это при условии, что изначально вы взяли хорошую и четкую картинку. рис8.

Битовая глубина и цвет

Как известно, в компьютере абсолютно вся информация состоит из битов. Бит может существовать только в одном из двух состояний, или, как говорят, содержать единицу или ноль. Если провести аналогию с жизнью, то единицу можно представить как "свет включен", а ноль - как темноту, "свет выключен".

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

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

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

Основой монитора, как и телевизора, является электронно-лучевая трубка, или сокращенно ЭЛТ. Когда монитор выключен, то экран почти черный, но для простоты объяснения будем считать его абсолютно черным. ЭЛТ формирует изображение из трех каналов. Каждый канал имеет свой цвет: красный, зеленый, синий. Когда ни один из них не работает, то получается черный цвет. Если работает только красный на "полную катушку", то соответственно мы видим ярко-красный цвет. При включении зеленого канала на половину получается темно-зеленый оттенок. Если работают красный и зеленый одновременно, наблюдаем желтый. Синий и красный - фиолетовый. Работа всех каналов на полную мощность даст белый цвет.

Таким образом мы продвигаемся от черного к белому, прибавляя значения в каналах до максимума. Поэтому такая система называется аддитивной (по английски add - добавлять). Ее обозначают как RGB по первым буквам названий цветов каналов (Red-Green-Blue, красный-зеленый-синий). В русской транскрипции читается как "эр-жи-би".

В 24-битной системе обозначения цвета на каждый канал отводится по 8 бит, то есть по 256 оттенков. Таким образом общее количество цветов составляет 16,7 миллиона. Этого более чем достаточно для любой картинки, и поэтому данная цветовая модель еще называется True Color (истинный цвет).

Если немного углубиться в систему RGB, то работает она примерно так: один пиксел имеет цветовые параметры 23-100-249 соответственно для каждого канала, следующий 236-45-123 и так далее. Это хорошо, когда изображение содержит отличающиеся пикселы, как, например, фотография. Но если мы имеем картинку, где большие области окрашены в один цвет, например, логотип, то эта система записи становится непродуктивной, потому что она по-прежнему фиксирует цветовые значения каждого пиксела, не обращая внимания на их одинаковость.

Подобные изображения лучше записывать в системе индексированного цвета. В нем сначала составляется палитра оттенков, присутствующих в изображении. То есть записываются параметры цвета в системе RGB, затем каждому имеющемуся оттенку присваивается номер. И каждый пиксел картинки теперь кодируется не 24 битами, а номером цвета. Визуально картинка не отличается от записанной в системе RGB, а размер файла существенно меньше.
Система RGB Индексированные цвета

Таким образом, исходя из количества оттенков в вашей картинке, следует выбирать систему записи цвета. Для цветных фотографий применяйте 24-битный цвет, черно-белые храните в "оттенках серого", а графичные изображения, содержащие несколько оттенков, переводите в индексированные цвета. Однако если вы сохраните черно-белую фотографию своего дедушки в системе RGB, ничего страшного не произойдет, только увеличится размер файла.

Полиграфическая система записи цвета.

В жизни мало что бывает простым. И то многообразие цветовых моделей, которое мы уже рассмотрели, оказывается, не совсем подходит для печати. Потому что монитор, когда на нем ничего нет, становится черным, а бумага, когда на ней тоже ничего нет - белая. Получается, что здесь придется двигаться в направлении, противоположном аддитивной системе. Цветовая модель, предназначенная для полиграфии, называется субтактивной (от английского subtaction - вычитание). В ней черный цвет достигается смешением трех каналов с максимальной интенсивностью. Логично предположить, что их цвета должны быть противоположны каналам модели RGB. Отсюда мы получаем голубой, пурпурный и желтый. Но на практике, из-за химических свойств красителей не получается настоящего черного цвета, а выходит нечто темно-грязно-коричневое. Поэтому полиграфистам приходится применять и черную краску. Система записи цвета получила название CMYK (Cyan-голубой, Magenta-пурпурный, Yellow-желтый, blacK-черный). По-русски произносится как "цмик". Почти вся цветная печатная продукция получается составлением этих четырех цветов. Если у вас долго висел на солнечной стене какой-нибудь красочный календарь, то через некоторое время он блекнет, и, как правило, становиться черно-синим. Желтая и пурпурная краска, как наименее светостойкие, выгорают.

Система CMYK по своей природе не может отобразить все оттенки, как это "умеет" модель RGB. Поэтому не ругайте принтер, напечатавший блеклую картинку вместо цветной и яркой, как она была на мониторе. Перевод изображения в эту цветовую модель также требует некоторых знаний в области полиграфии. Одна и та же картинка, конвертированная с различными параметрами, выглядит по-иному.
Изображение в системе RGB Оно же после конвертации в СMYK с различными параметрами

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

По большому счету конвертировать изображения из системы RGB в CMYK для того, что бы распечатать на принтере, особой необходимости нет. За вас это сделает программа-драйвер. К тому же, как было сказано выше, некоторое принтеры печатают шестью цветами, и соответственно производят цветоделение "под себя", отличающееся от стандартного четырехцветного.

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

Вывод таков: не используйте CMYK без особой надобности. Даже если вы собираетесь напечатать картинки в журнале, то лучше приносите их в RGB. В редакции сами переведут их в нужную цветовую модель с учетом нужных полиграфических требований.

На этом закончим с системами записи цвета. Конечно, мы не рассмотрели все существующие, но в этом нет необходимости. Например, рядовой пользователь вряд ли будет иметь дело с цветовой моделью Lab, и нет смысла описывать ее в данной статье.

Форматы файлов

Изображения существуют в компьютере, будучи записаны в файлы различных графических форматов. Если провести сравнение с повседевной жизнью, то файл подобен книге. А различные форматы похожи на разные языки. Так же, как "Война и мир" может быть напечатана на английском и французском, так и одна и та же картинка может быть записана в формате TIFF или JPEG. Некоторые программы умеют читать и писать большое количество разнообразных форматов, другие - меньшее, но существуют несколько самых распространенных, которые понимаются большинством программ, связанных с растровой графикой. Сейчас мы кратко их рассмотрим.

BMP

Стандартный графический формат для компьютеров с операционной системой Windows. А так как мы пользуемся именно ей, то почти все приложения, соприкасающиеся с растровой графикой, понимают этот формат. Поддерживает цветовые модели RGB, Indexed Color, Grayscale и Bitmap.

Tagged-Image File Format (TIFF)

Расширение tif, произносится "тиф". Формат, ставший стандартом в полиграфии благодаря своей двухплатформенности. Он существует как на компьютерах РС, так и на Macintosh. Поддерживает цветовые модели CMYK, RGB, Lab, Indexed Color, Grayscale и Bitmap. Имеется алгоритм LZW компресии без потерь. Обычно она уменьшает вес файла примерно в полтора раза.

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

Joint Photographic Experts Group (JPEG)

Расширение jpg, читается как "джей-пег". Разработан специально для хранения фотографий и подобных им изображений с плавными переходами цвета. Алгоритм компрессии при записи файла позволяет выбирать оптимальное соотношение между качеством картинки и ее весом. То есть более качественное изображение будет иметь больший размер в байтах, и соответственно, передача такого файла по сети займет большее количество времени. А уменьшение качества ведет к сокращению веса картинки. Поддерживает цветовые модели CMYK, RGB и Grayscale.
Качество 100
Размер файла
22 Кб
Качество 80
Размер файла
11 Кб
Качество 50
Размер файла
5 Кб
Качество 20
Размер файла
3 Кб
Качество 5
Размер файла
2 Кб
Фрагменты, увеличенные в четыре раза

Graphics Interchange Format (GIF)

Произносится как "гиф" или "джиф". В основном, русскоязычное население предпочитает первое.

Это формат индексированного цвета. Максимальное количество оттенков ограничивается 256. На первый взгляд не очень много, но обычно в "гифах" содержатся картинки из еще меньшего количества цветов. Это различные значки, логотипы, элементы оформления интернет-страницы. Обычно хватает 16 или 32 цветов, изредка 64. Достоинством этого формата является наличие прозрачности. То есть при экспорте вы указываете, какие цвета оригинального изображения должны стать прозрачными, и в этом месте будет виден фон странички. Таким образом мы можем отойти от надоевшей прямоугольности.
128 цветов
Размер файла
10 Кб
32 цвета
Размер файла
6 Кб
16 цветов
Размер файла
4 Кб
8 цветов
Размер файла
3 Кб
4 цвета
Размер файла
2 Кб
Фрагменты, увеличенные в четыре раза

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

Таким образом мы имеем два формата, ориентированные на немного различные по характеру растровые изображения. Фотографии, и картинки, содержащие плавные переходы цвета лучше записывать в JPEG, а графичные изображения, состоящие из небольшого количества оттенков, сохранять в формате GIF. При подготовке интернет-страницы удобно пользоваться программами-оптимизаторами, которые показывают, каков будет вид и вес картинки после конвертации.

Однако то, что форматы JPEG и GIF были разработаны специально для интернет, совсем не значит, что в них нельзя хранить изображения для других целей. Просто они используют запись с потерями некоторого количества информации. Так что если хотите сохранить свое изображение без потерь, то используйте другие форматы. С другой стороны, запихнуть десяток фотографий приличного размера на дискету удастся только при сжатии их в JPEG.

Программы и средства обработки.

Для работы с растровыми картинками вам потребуется программа-редактор. Их существует довольно большое количество, от маленьких и простейших до больших и сложных. Лидером является пакет Photoshop от фирмы Adobe. Это профессиональная программа с огромными возможностями, используемая большинством компьютерных художников и дизайнеров. С ее помощью возможны разнообразнейшие манипуляции с изображением. Однако оборотной стороной медали является сложность освоения и приличное количество расходуемых ресурсов компьютера.

С другой стороны находятся простые программы, предназначенные для тех, кто планирует проводить нехитрую обработку изображений и не хочет разбираться с большими и сложными профессиональными пакетами. Примером может служить Irfan Viewer. Это маленькая утилита (всего 700кб) позиционируется как средство для просмотра графических файлов, но дополнительно она умеет записывать их в другом формате, поворачивать, обрезать, изменять разрешение и цветовую модель. К тому же Irfan Viewer не требует инсталляции и совершенно бесплатен.

Векторная графика

Этот вид компьютерной графики еще называется объектно-ориентированным, что еще более отражает его сущность. Изображение описывается специальными формулами. Если представить вольный перевод на человеческий язык, то будет звучать примерно так: "квадрат высотой 45 и шириной 86, цвет заливки синий, расположен в точке с координатами 52,78". То есть квадрат - это объект, над которым можно производить различные действия. Так же объектами могут служить круг, треугольник, отрезок и другие геометрические фигуры. Их можно масштабировать, поворачивать, растягивать, скручивать. Скажем, если вы изменили размер вышеописанного квадрата, то в обозначении ширины и высоты появятся другие цифры. А все остальное останется прежним до тех пор, пока вы не сочтете нужным это изменить.

Большое преимущество векторной графики перед растровой - масштабирование без потери качества. Изображение можно сколь угодно уменьшать или увеличивать, хуже ему совершенно не станет. Таким образом векторная графика хорошо подходит для выполнения различных чертежей, схем, диаграмм. Провели линию не в том месте - спокойно передвигаете ее на нужное. Не та длина - уменьшили, не тот угол - повернули. Потому что в этом случае мы оперируем объектами. К тому же файлы векторного формата весят намного меньше, нежели чем растрового.

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


Программ для векторной графики довольно много, но имеет смысл заняться только изучением лидирующих пакетов, или хотя бы одного. Corel Draw и Adobe Illustrator делят между собой пальму первенства, немного позади идет Macromedia FreeHand. Это полнофункциональные редакторы с большими возможностями и обширной сферой применения. Но есть и специальные программы, которые используются в более узких областях. Например, Autocad, специализированный пакет для создания чертежей, применяется инженерами, конструкторами и архитекторами.

Комбинирование различных видов графики.

Прежде всего следует поговорить о конвертации одного вида графики в другой. Наиболее простым является перевод векторной в растровую. Если вы хоть раз печатали текст на принтере, то имели дело с этим процессом. Потому что текст относится к векторной графике. Вы можете изменять размер, шрифт, интервал практически в любом текстовом редакторе. Любой принтер формирует изображение из точек, и соответственно печатает растровую картинку. Перевод из вектора в растр осуществляется без вашего участия. Тоже самое происходит и при печати векторных изображений. А как быть, если надо получить растровый файл? В таком случае открывается векторный редактор, и картинка экспортируется в выбранный вами растровый формат, из тех, какие умеет записывать данная программа. Еще необходимо выбрать разрешение конечной картинки и битовую глубину. Если хотите получить черно-белое изображение, то выбирайте Grayscale, если цветное, то RGB.

Конвертация растра в вектор несколько сложнее. Бывают забавные случаи, когда человек сканирует текст, а потом удивляется, почему Word не может отредактировать этот фрагмент. А потому, что этот текст после сканирования является самой обычной растровой картинкой, а не набором букв. Что бы получился нормальный текст, изображение надо прогнать через специальную программу, которая умеет распознавать напечатанные буквы.

То же самое происходит и при переводе растровых рисунков в векторный формат. Необходимо воспользоваться программой-трассировщиком. В этом случае требуется настроить параметры конвертации для получения различных по количеству объектов и детализации рисунков.

Растровый оригинал Векторные картинки после обработки программой-трассировщиком с различными параметрами

Фактически, растровое изображение может быть переведено в векторный формат совсем без потерь. Так как растровая картинка состоит из квадратов-пикселов, то ее можно воспроизвести и в векторном изображении абсолютно идентично. Однако это имеет смысл только при совмещении двух видов графики. Скажем, вы делаете открытку, где на фотографию леса нужно наложить поздравительный текст и векторный рисунок. В таком случае растровая картинка "засасывается" в векторный редактор, они этому обучены, а затем достраиваются необходимые элементы.

Здесь присутствуют некоторые варианты, в зависимости от использования конкретной программы. Например Corel Draw молча встраивает растровое изображение в векторный файл, который существенно увеличивается в размерах. Это, конечно, минус, однако получается один самодостаточный файл. Adobe Illustrator предлагает на выбор два варианта - встроить картинку в файл или же установить на нее ссылку. Это значит, что в файле будет записана небольшая копия вашего изображения, которая отобразится на экране. Такой подход хорош тем, что вес файлов получается существенно меньше, потому что алгоритмы записи векторных файлов не умеют эффективно сжимать растровое изображение, как это делает, например формат JPEG. Но для печати вам уже необходимо несколько файлов, как векторный, так и растровые, на которые он будет ссылаться.

Этот метод используется в полиграфии. Все газеты, журналы, книги делаются в специальных программах-верстальщиках, например Adobe PageMaker и QuarkXPress. Они представляют из себя смесь векторного и текстового редакторов с возможностью вставлять растровые изображения.

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

Артём Войтенков
www.artvoitenkov.narod.ru