Форматы векторной и растровой графики

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

Растровое изображение представлено в памяти персонального компьютера, как комплекс информации о цвете всех пикселей, упорядоченных каким либо образом. Самым актуальным примером растровой графики в обыденном миру является мозаика. Мозаика состоит из одинаковых элементов разного цвета и в сборе представляет собой единое целое напоминая изображение их точек. В растровом изображение точки до того мелкие, что человеческий глаз их не видит, а видит изображение как единое целое.

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

Схематическое изображение пикселей.

К наиболее популярным форматам растровой графики можно отнести форматы: GIF, JPEG, PNG.

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

Аналоги векторным изображениям в реальном мире подобрать не просто. Хотя, например может претендовать геометрия со своими фигурами или же инженерная графика так, как в проектирование каких либо узлов оборудования создаются чертежи, которые состоят из различных геометрических фигур и в итоге составляют единое целое (изображение).

Схематическое представление объектов, которые составляют изображение.

К самым популярным форматам векторной графики можно отнести: CDR, Ai, SVG.

Основные различия растровой и векторной графики

Достоинства растровой графики:

• Растровая графика предоставляет возможность создавать любые изображения не обращая внимание на сложность их исполнения в отличие от векторной графики, которая неспособна предать хорошо переход цветов от одного к другому.
• Широкий спектр применения – растровая графика на сегодняшний день нашла широкое применение в различных областях, от мелких изображений (иконок) до крупных (плакатов).
• Очень высокая скорость обработки изображений различной сложности, при условие что нет необходимости в их масштабирование.
• Представление растровой графики является естественным для большинства устройств и техники ввода-вывода графики.

Недостатки растровой графики:

• Большой размер файлов с простыми растровыми изображениями.
• Невозможно увеличение изображения в масштабе без потери качества.
• Вывод изображения при печати на плоттер является затруднительным.
• При хорошем качестве изображения требуются значительный объем дискового пространства для хранения файлов.
• Сложность преобразования растрового изображения в векторное.

Исходя из вышеуказанных недостатков хранить простые рисунки рекомендуется не в сжатой растровой графике, а использовать векторную.

Достоинства векторной графики:

• Масштабирование размеров без потери качества изображения.
• Масштабированные изображения не увеличиваются в весе ни на один байт.
• Во время масштабирования качество, резкость, четкость и цветовые оттенки изображений не страдают.
• Вес изображения в векторном формате в разы меньше веса изображения в растровом формате.
• При конвертации изображения из векторного формата в растровый, не возникает никакой сложности.
• Толщина линий при изменение масштаба (увеличение или уменьшение) объектов может не изменяться.

Недостатки векторной графики:

• В векторной графике можно изобразить далеко не каждый объект. Объем памяти и интервал времени на отображение векторной графики зависит от количества объектов и их сложности.
• После преобразование из растрового изображения в векторное, обычно качество векторного изображения не высокое.

На сегодняшний день наиболее популярными и востребованными графическими редакторами являются:

Редактор растровой графики: Adobe Photoshop, GIMP.

Редакторы векторной графики: CorelDraw и Adobe Illustrator.

Векторная и растровая графика хранится в определенных форматах изображения.

Для заказчиков контента и новичков – копирайтеров

Здравствуйте, друзья! Во 2 уроке «Ручки-нарисучки» я напомню вам, какие бывают форматы растровых и векторных изображений. «Как? Опять вокруг, да около!», — возмутятся самые нетерпеливые. Но поверьте, уважаемые поклонники рисованного видео: знание подобных «мелочей» значительно ускорит нам продвижение к рисовашкам в дальнейшем. По крайней мере мы будем понимать, о чем идет речь, когда дело дойдет до работы в программах.

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

Кстати, а что это такое — формат графики? Это метод визуализации (показа на воспроизводящем устройстве) той информации, которая сохранена в файле. По сути формат изображения — это способ кодирования изображения и инструкция, как воспроизвести статическую или динамическую картинку со всеми ее параметрами (размерами, палитрой цветов, их глубиной и оттенками).

Признаюсь, что никакой инновационной информации в статье не будет. Я лишь постараюсь изложить этот непростой материал доступным языком и в том объеме, который необходим нам — будущим видеоскрайберам и дудлвидеоменам. Поехали?

Что такое растровый формат, его виды, применение

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

Под размерами растровых изображений чаще всего понимают количество пикселей по длине и ширине, например, 600*300 px. Важной характеристикой является также их разрешение, то есть количество ячеек (точек) на единицу площади носителя — экрана, бумаги. Чем выше эта величина, тем более точно происходит воспроизведение оригинала.

Цифровые фотоаппараты, сканеры, графические редакторы типа Paint, Canva, Photoshop — все эти устройства и программы выдают продукцию (и работают с ней) в растровом формате. Кстати, скриншоты (снимки экрана монитора) — это тоже растр.

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

Самые распространенные форматы пиксельной технологии, применяемые для web -ресурсов:

• gif — несколько устаревшее, но все еще популярное расширение, которое поддерживает анимацию, имеет не слишком большой вес и допускает прозрачность;
• jpeg — самый легкий из растровых форматов; сжатие происходит за счет отбрасывания части данных, которые в меньшей степени воспринимает человеческий глаз; для хранения или размещения на сайтах подходит прекрасно;
• png — не поддерживает анимацию, в отличие от gif имеет расширенную цветовую палитру, возможна регулировка прозрачности, но вес изображений довольно велик.

Перечисленные расширения имеют отношение к рисованному видео постольку, поскольку именно их мы будем учиться переводить в вектор.

В полиграфии и издательском деле чаще используют форматы BMP и TIFF, которые обеспечивают самое высокое качество печати. В сайтостроении они не применяются из-за чересчур большого веса. Нам с вами, друзья вряд ли придется встречаться с ними в дальнейшем.

Векторные форматы — какие бывают, для чего используются

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

1. Они позволяют значительно менять размер изображения или отдельных его деталей без ущерба для качества — свойство масштабируемости.
2. Размеры векторных файлов существенно меньше растровых, что дает хорошую экономию дискового пространства ПК.
3. Именно векторная графика применяется для создания рисовашек, потому что она лучшим образом подходит для простых рисунков, не требующих фотореализма. И это третье преимущество для нас с вами, наверняка, становится решающим.

Главным минусом векторной графики является невозможность задавать плавные переходы цвета. Но всегда приходится чем-то жертвовать. Кстати, хочу заметить, что векторную картинку перевести в любой из пиксельных форматов можно абсолютно просто. Для этого нужно всего лишь пересохранить ее в нужном расширении в одном из векторных граф-редакторов. Обратная операция — перевод растра в вектор — это целая наука, которую мы и будем изучать в скором времени. А сейчас давайте познакомимся с форматами векторных изображений — какие же они бывают:

• svg — самое популярное из расширений графических файлов в двухмерном пространстве, используется в производстве дудл-видео; дает широкие возможности для web-дизайна, поддерживает анимацию, окраску, прозрачность;
• swf — баннеры, анимированные логотипы, игры; не позволяет задавать прозрачность; при экспорте может самопроизвольно переформатироваться в растр, поменять цветовые градиенты;
• eps — один из первых векторных форматов; является по сути смешанным, так как может содержать наряду с векторными объектами и растровые; прозрачность не поддерживает, его файлы имеют большой вес;
• ai — имеет хорошее качество изображений, стабильный, его принимают практически все векторные редакторы; используется при создании рекламной продукции;
• cdr — используют в полиграфии для продукции, не отличающейся слишком широкой палитрой — визиток, логотипов; несовместим с другими граф-редакторами, ограниченно с Adobe Illustrator; при попытках конвертации файлы искажаются, теряют прописанные эффекты;
• pdf — полиграфия, электронные книги, презентации — область применения довольно широка; программное обеспечение для отображения pdf-файлов бесплатное; печать допускается на самых простых устройствах без искажения; может использоваться как архиватор, так как значительно сжимает данные.

В программах для скрайбинга используются только SVG расширения. Но форматы AI и EPS нельзя сбрасывать со счетов, так их легко, буквально в несколько кликов можно преобразовать в нашу «рабочую лошадку» по имени ЭсВиДжи. Этим они и ценны для нас.

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

На этом позвольте закончить мою «песнь» о форматах. А на закуску — вот вам урок 2. На этот раз он — шуточный — о том, как «Как-то раз все дело встало из-за страшного скандала».

До свидания. До встречи в третьем уроке «Нарисучки».

Для того, чтобы вести дискуссию о программах по работе с графикой сначала нужно разобраться в понятиях и различиях между двумя основными типами 2D графики: растровые и векторные изображения. Это очень важный урок, тем более, если вы намереваетесь работать с графикой.

Для начала давайте начнем с разговора о более распространенном типе – о растровых изображениях.

Понятие растрового изображения

Растровые изображения это изображения, которые состоят из крошечных прямоугольных точек индивидуального цвета — пикселей, объединенных воедино. Каждый пиксель имеет свое особое расположение на картинке и свое индивидуальное значение цвета.

Каждое изображение имеет фиксированное количество пикселов. Их вы можете видеть на экране монитора, большинство из которых отображают примерно от 70 до 100 пикселей на 1 дюйм (фактическое количество зависит от вашего монитора и настройки самого экрана).

Чтобы проиллюстрировать это, давайте взглянем на типичный значок на рабочем столе — Мой компьютер, который, как правило, состоит из 32 пикселей по ширине и 32 пикселей по высоте. Другими словами, существует 32 точки цвета в каждом направлении, которые в сочетании формируют изображение такого значка.

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

Размер изображения и его разрешение

Растровые изображения зависят от разрешения. Разрешение изображения это число пикселей в изображении на единицу длины. Оно является мерой четкости деталей растрового изображения и обычно обозначается как dpi (точек на дюйм) или ppi (пикселей на дюйм). Эти термины в некотором смысле синонимы, только ppi относится к изображениям, а dpi — к устройствам вывода. Именно поэтому dpi вы можете встретить в описании мониторов, цифровых фотоаппаратов и т. д.

Чем больше разрешение, тем меньше размер пиксела и тем больше их приходится на 1 дюйм, и соответственно тем лучше качество картинки.

Разрешение подбирается для каждого изображения индивидуально и зависит от того, где Вы планируете его использовать:

• если вы планируете использовать его для размещения в Интернете, то разрешение выбирается 72 ppi, поскольку основным критерием для Интернета является скорость загрузки изображений, а не их изумительное качество, именно поэтому выбираются соответствующие форматы сохранения файлов, где качество стоит далеко не на первом месте.
• если вы захотите напечатать изображение, то разрешение должно быть гораздо больше чем 72 ppi. Так, для того чтобы распечатать изображение в хорошем качестве разрешение его должно быть в диапазоне 150-300 ppi. Это основное требование для фототипографий, печатающих журналы, каталоги и малоформатную продукцию (буклеты, флаеры, рекламные листовки).

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

Размер изображения в растровой графике — это физический размер файла, в котором хранится это изображение. Он пропорционален размеру изображения в пикселах.

Программа Photoshop показывает соотношение между размером изображения и его разрешением. Это можно просмотреть, открыв диалоговое окно «Размер изображения», находящееся в меню «Изображение». При внесении изменений в одну из данных величин все остальные автоматически будут приведены в соответствии с измененной.

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

• размер изображения в пикселях
• битовая глубина
• цветовое пространство
• разрешение изображения

Примером растрового изображения может служить любая фотография или картинка, созданная путем сканирования, фотографирования или рисования в растровом редакторе, а также созданная путем преобразования векторного изображения в растровое.

Форматы растровых изображений

К самым распространенным форматам растровых изображений относятся:

Преобразование между форматами растровых изображений происходит очень легко, при этом используется команда «Сохранить как …», в меню которой после имени файла выбирается формат, в котором Вы хотите сохранить изображение.

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

Программы для работы с растровой графикой

Самые популярные программы для работы с растровой графикой:

• Adobe Photoshop
• Adobe Fireworks
• Corel Photo-Paint
• Corel Paint Shop Pro
• Corel Painter
• GIMP
• Paint

Как по мне, то редактор Adobe Photoshop – является самой лучшей из программ.

По сравнению от этого типа графики, векторная графика также имеет немало достоинств. Давайте их рассмотрим.

Что такое векторные изображения

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

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

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

Еще одно преимущество изображений является то, что они не ограничены прямоугольной формой, как растровые. Такие объекты могут быть размещены на других объектах (размещение на переднем или заднем плане выбирается лично Вами).

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

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

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

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

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

Векторные форматы

К самым распространенным форматам вектора относятся:

• AI (Adobe Illustrator);
• CDR (CorelDRAW);
• CMX (Corel валютный);
• SVG (масштабируемая векторная графика);
• CGM Computer Graphics Metafile;
• DXF AutoCAD.

Самые популярные программы для работы с векторами: Adobe Illustrator, CorelDRAW и Inkscape.

Так чем же отличаются векторные и растровые изображения?

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

• масштабируемые;
• не зависят от разрешения;
• не имеют фона;
• легко преобразуются в растр.