Бесплатные видео-уроки

Adobe Edge Animate

Создание графики, анимации и интерактивного контента для веб

  • бесплатно
  • перспективно
  • быстро
  • доступно

О форматах файлов и Edge Animate

В мире двумерной (2D) компьютерной графики существует две системы хранения и отображения изображений:

  • растровая графика (bitmap);
  • векторная графика.

Растровая картинкаРастровая графика представляет из себя набор пикселей, каждый из которых характеризуется своим положением и цветом. Когда мы говорим bitmap, то имеем в виду не формат файла с расширением .bmp, а, фактически, любую картинку, сохраненную в одном из растровых форматов, а именно: .gif, .jpg, .tiff и .png.

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

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

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

Картинка увеличенная на 400 процентов

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

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

Adobe Edge Animate может импортировать 4 типа графических файлов: JPG, GIF, PNG и SVG. Однако, здесь есть несколько подводных камней, которые, возможно, Вас удивят.

JPG

Файлы этого формата, известные также, как JPEG являются растровыми и широко используются в сети интернет и многими цифровыми фотоаппаратами. В JPG реализован метод сжатия с потерями, чтобы создать файл меньшего размера. Графические редакторы, работающие с JPG обычно дают возможность выбирать степень сжатия (компрессии). Если заранее известно, что картинку будут смотреть только на экране, то компрессию можно усилить. Если в дальнейшем предполагается печать на принтере, то для лучшего качества на выходе нужно сохранить все пиксели (сохранение без сжатия).

GIF

В последнее время популярность этого растрового формата упала по сравнению с JPG и PNG, тем не менее Вы обнаружите его еще на многих сайтах. В нем реализован метод сжатия без потерь (lossless), но при этом используется ограниченная по количеству цветов палитра. В результате получается картинка с ограниченным количеством цветов, но маленького размера. Чаще всего используется для отображения логотипов и простой графики. С другой стороны, фотографии с большим количеством цветов и оттенков будут выглядеть гораздо хуже в GIF чем в JPG из-за существующего в нем ограничения на количество используемых цветов.

GIF интересен еще и тем, что в нем можно хранить покадровую анимацию! Программы вроде Adobe Fireworks и Flash создают такую анимацию достаточно легко.

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

PNG

Этот формат был разработан во времена, когда существовал патент на использование GIF. Используется он исключительно в сети интернет и, в некотором смысле, является улучшенной версией GIF. Метод, который используется в нем для сжатия данных — без потерь (lossless), цветовая палитра дает возможность использовать большее количество цветов чем в GIF, кроме того он может содержать покадровую анимацию и прозрачные части изображения. Этот формат хорошо поддерживается современными веб-браузерами, хотя некоторые из старых (но таких очень мало) с ним не работают. PNG очень хорошо работает с Edge Animate, поскольку оба создавались для веб.

SVG

В основу этого формата положен вектор. SVG (Scalable Vector Graphics) — масштабируемая векторная графика. Это означает, что вместо того, чтобы сохранять карту состоящую из пикселей, SVG содержит формулы, описывающие прямые линии, кривые, формы и другие детали изображения. Все современные веб-браузеры поддерживают этот формат, но старые с ним работают не стабильно.

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


Добавьте комментарий
bbcode:
[br]  [b][/b]  [i][/i]  [u][/u]
[img]link image[/img]
[color=colour][/color]
[url]link[/url]
[url=link]title[/url]
 
* Введите проверочный код
* Поля с красной звездочкой необходимо заполнить