Что у нас новенького?

Содержание:

  1. Введение
  2. Графические форматы (обзор)
  3. Как создавать картинки?
  4. Фильтры и plug-in'ы
  5. Разнообразные полезные советы, или просто "Tips and tricks"
  6. Коллекция линков


Введение

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

Данная статья не преследует своей целью научить людей рисовать. При написании я ставил перед собой цель помочь webmaster'ам избегнуть некоторых проблем при создании картинок для своих серверов.


Графические форматы

Несколько слов о графических форматах, имеющих хождение в World Wide Web. Насколько мне известно, сейчас существуют три основных формата: GIF, JPEG, PNG и их разновидности. Форматы GIF и JPEG поддерживаются практически всеми, а PNG, насколько мне известно, только NCSA Mosaic for X Window (если я неправ, напишите мне письмо, адрес в конце страницы). Остальные форматы в силу некоторых причин не получили такого широкого распространения.

Рассмотрим вышеописанные форматы подробнее.

  1. GIF, так же известный как CompuServe Graphics Interchange Format. Формат является коммерческим из-за использования в нем алгоритма компрессии LZW, который запатентован компанией Unisys. Вследствие применения этого алгоритма картинки в этом формате получаются достаточно компактными. Этот формат предусматривает один бит на прозрачность (либо прозрачный, либо нет), и позволяет использовать палитру из 256 цветов (максимум), вследствие чего 24-битные изображения в нем хранить нельзя.
    Картинки в формате GIF бывают interlaced и non-interlaced. Первый отличается от второго тем, что отрисовывается он не подряд, а через строчку, т.е. сначала нечетные, а затем четные (или наоборот, я точно не помню :).
  2. JPEG (сокращение от Joint Photographic Experts Group). Этот формат прекрасно подходит для хранения реалистичных картинок (типа фотографий, отсканированных изображений, и т.д.), но для рисованных картинок (графиков, и т.д.) он не подходит. Формат позволяет хранить 24-битные изображения. JPEG очень хорошо компрессирует изображения, в частности, он может сжать картинку до одной десятой от оригинального размера.
    В последнее время получила широкое распространение модификация этого формата, известная как Progressive JPEG. По смыслу и внутреннему устройству это очень похоже на interlaced GIF, это тот же JPEG, но данные в нем располагаются в несколько порций, что позволяет при декодировании сначала быстро нарисовать картинку плохого качества, затем улучшить ее, считывая и декодируя следущие порции данных.
    На этой странице приведен пример.
  3. PNG, так же известный как Portable Network Graphics. Этот формат, использующий компрессию на основе алгоритма LZ77, является свободным от всяческих патентов, и в данный момент предлагается на роль единого стандарта в World Wide Web. Данный формат позволяет без потерь при компресии хранить 24-битные изображения, с зарезервированным местом под прозрачность. Более подробную информацию о данном формате можно найти на сервере W3 Consortium.


Как создавать картинки?

Ну вот, с форматами разобрались, теперь можно приступать к созданию картинок. Здесь самое время задаться вопросом: что выбрать? Какой редактор подойдет для этой цели лучше всего? Я постараюсь описать некоторое количество редакторов и помочь вам выбрать нужный. Пока я буду рассматривать _ТОЛЬКО_ системы под Windows, системы под Mac, UNIX и т.д. пока во внимание браться не будут.

Для начала рассмотрим системы для создания двумерной графики, причем только растровой (системы вроде CorelDRAW! или Adobe Illustrator пока трогать не будем).

  1. Для людей без особых запросов можно порекомендовать PaintBrush из дистрибутива Windows (в случае с Windows95 это будет Paint). Однако будем надеяться, что людей без особых запросов уже не осталось, поэтому описывать возможности Paint я здесь не буду :)
  2. Значительно более навороченным по сравнению с предыдущим является Ulead ImageEditor из комплекта Ulead VideoStudio. Из опыта работы с этим редактором могу сказать, что он достаточно удобен, надежен, без особых проблем работает с картинками огромных размеров (тогда как некоторые другие редакторы могут просто вызвать General Protection Fault). Очень удобно, по моему мнению, сделана работа со шрифтами (из-за чего я его, собственно, и держу :).
  3. CorelPhotopaint из дистрибутива CorelDRAW!. Это достаточно мощный редактор растровой графики, с огромным количеством возможностей, но очень неудобный, громоздкий, и, кроме всего прочего, написанный на чем то кривом и тормозном, как все Corel'овское, вследствие чего и сам не дурак подумать. Кроме того, наблюдались глюки при работе с большими (около 10-15 мегабайт в размере) изображениями, заключающиеся в том, что случался General Protection Fault, и все умирало.
  4. Самый мощный и удобный, по моему мнению, редактор - это Adobe Photoshop. Он предназначен в основном для post-processing'а (ретушь, обработка сканированных изображений, компоновка, и т.д.) и дизайна. Я использую версию 3.0.5 (for Win95, с поддержкой длинных имен), а под Windows 3.x можно использовать 3.0.4 (требуется установить Win32s). Этот редактор умеет практически все, что может пожелать человек, решивший заняться созданием картинок для Web сервера. В частности, огромную помощь при создании картинки оказывают "слои" (в оригинале "layers"). Их смысл состоит в том, картинка составляется из независимых объектов, и операции над объектами соответственно могут производиться независимо. Правда, возможность использования "слоев" доступна только при работе с картинкой в формате PSD (собственный формат Photoshop с сохранением информации о "слоях"). Еще одной отличительной сосбенностью Adobe Photoshop являются так называемые "фильтры" (в оригинале "plug-ins", так же иногда называемые "filters", "effects"). Фильтр - это, по сути, внешняя программа, специально написанная и откомпилированная для взаимодействия с Photoshop'ом через его специальный plug-in API, и предназначенная для выполнения некоей функции, которой нет в Photoshop (например, отбрасывание какой-нибудь крутой тени, или еще чего-нибудь подобное). Данный API документирован, так что желающие могут попробовать свои силы в разработке фильтров для Photoshop'а ;). Однако о фильтрах разговор пойдет дальше.
  5. Еще один редактор, с котором нельзя умолчать, это Fractal Design Painter 4.0. Этот редактор более всего подойдет художнику и предназначен именно для рисования (а не для post-processing'а или дизайна, как например Photoshop). Конечно, в нем такие возможности так же присутствуют, но основное его предназначение - это именно рисование. В нем отличные возможности по выбору кистей, карандашей, фактур бумаги, и т.д. Поддерживаются наиболее популярные типы планшетов. Еще одна существенная черта, о которой следует упомянуть, это возможность работы во Fractal Desing Painter с последовательностью изображений (AVI, последовательность файлов, например Targa). Однако, если вы не хотите (или не умеете) рисовать, а хотите заняться дизайном или компоновкой, то, вероятнее всего, вам Fractal Design Painter не подойдет.

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

  1. Наиболее популярной системой для создания трехмерной графики является Autodesk 3D Studio for DOS (последняя вышедшая версия - release 4.1c). В системе имеется мощный интерактивный редактор для создания сцен и моделей, real-time preview, мощные возможности по манипулированию текстурами и материалами. До недавнего времени 3D Studio обладала самыми мощными на PC возможностями анимации, включая продвинутую анимацию по key-frame и инверсную кинематику. 3D Studio имеет открытую архитектуру, и, как следствие, для нее существует огромное количество IPAS-процессов, позволяющих создавать различные эффекты. Для монтажа видеопоследовательностей с применением различных эффектов, простейшего видео-композинга имеется функция VideoPost.
  2. Особо стоит сказать о 3D Studio MAX - новом продукте фирмы Autodesk. В данный момент фирма Autodesk отказалась от развития 3D Studio r4 for DOS и переключилась на развитие своего нового проекта - 3D Studio MAX. Данная система предназначена для Windows NT. Хотя она и работает под Windows95, но при инсталляции она честно заявляет, что "у вас Windows95, и под ним я буду глюкать..." (то же самое, в общем-то, она говорит и в случае с Windows NT 4.0 beta и shell preview ;). Со времен 3D Studio серьезные изменения претерпел интерфейс: если раньше были, вообще говоря, четыре разных модуля (Lofter, Shaper, 3D Editor и KeyFramer), то в 3D Studio MAX доступ ко всем функциям пакета осуществляется через централизованный интерфейс. Количество видов текстур увеличилось приблизительно вдвое, прибавилась возможность изменять во времени любые параметры объектов в сцене (вплоть до качества проработки геометрии), добавлена возможность синхронизации со звуком (хотя как это можно применить в Web? ;). Идея открытой архитектуры в 3D Studio MAX доведена до абсурда: имея Development Kit, распостраняемый вместе с пакетом, можно создавать все, начиная с простейших процессов и кончая собственными rendering engine'ами. В отличие от 3D Studio r4 данная система поддерживает сложные отражения (reflections), преломления (refractions) и наложения текстур (texture mappings), атмосферные эффекты (уже вышел первый freeware процесс Combustion, который позволяет делать туман, взрывы, моделировать пламя). Производительность системы существенно повышена, она обеспечивает самый быстрый рендеринг на платформе Intel x86 при достаточно высоком качестве, и поддерживает ускорители трехмерной графики, основанные на архитектуре GLINT. Вместо того, чтобы поддерживать OpenGL, 3D Studio MAX использует свою собственную подсистему, ласково названную создателями Heidy, которая обеспечивает real-time preview. В стадии beta-тестирования находится специальный блок для анимации двуногих существ Biped, в котором поддерживаются самые странные и сумасшедшие вещи, такие как вариации напряжения мышц при движении персонажей. Так же в 3D Studio MAX развита новая технология пространственных деформаций SpaceWarps, которая в корне отличается от существующих вариаций на эту тему. 3D Studio MAX полностью использует возможности Windows NT, а именно при наличии нескольких процессоров Pentium Pro она способна распараллелить процесс рендеринга "по ScanLine'у на процессор". AutoDesk заявляет, что коэффициент увеличения скорости на двухпроцессорном Pentium Pro относительно однопроцессорной машины составляет до 1.98. На обычных Pentium этот коэффициент значительно ниже.
  3. Под Windows имеется еще одно мощное средство для создания трехмерных изображений - Caligari trueSpace. Эта система использует библиотеку 3DR фирмы Intel. Правда, использует не всегда корректно, и по этому в 70% случаев trueSpace запускается и работает, а в остальных 30% он глюкает, причем иногда довольно круто и витиевато. Система обладает мощным интерактивным редактором сцен и моделей, развитыми возможностями по манипулированию текстурами и материалами, preview. У trueSpace на редкость дружественный интерфейс, снабженный системой интерактивной подсказки, и даже человек, не имеющий опыта работы с 3D пакетами, может освоить его довольно быстро (как это случилось со мной ;). При этом качество рендеринга у trueSpace явно выше среднего, поддерживается метод трассировки лучей (рекомендуется иметь update до 2.1a, в котором этот алгоритм работает значительно быстрее и корректнее). С другой стороны, у trueSpace довольно бедные возможности анимации, небольшое количество разработанных специально для него plug-in'ов (я видел всего один - Explode), а поддержка стандартных plug-in'ов реализована исключительно криво (например, Alien Skin BlackBox 2.0 работает приблизительно на 30% и глюкает на остальные 70%, а Kai's Power Tools 3.0 работает на 70% и на 30% глюкает).
  4. Еще один 3D монстр - это LightWave 3D (мы пробовали версию 4.0). 3D modeller оставляет откровенно тяжелое впечатление, однако блок рендера и анимации до появления 3D Studio MAX мог по праву считаться одним из самых продвинутых. При минимуме удобств обеспечивается максимум функциональных возможностей. Однако широкому применению LightWave препятствуют чрезвычайно высокие требования его к аппаратуре и операционной системе: желательна машина с процессором Pentium 100MHz или быстрее, а лучше с несколькими, объем памяти не менее 16Mb (лучше 32Mb или более), и Windows NT, на более слабой машине вы просто рискуете не дождаться конца рендеринга вследствие того, LightWave использует весьма специфичный многопроходный алгоритм рендеринга, название которого я сказать затрудняюсь, позволяющий добиться прекрасного качества, однако временные затраты на рендеринг при разработке LightWave во внимание, видимо, не принимались (нам кажется, что идеальная машина для запуска LightWave - это четыре процессора Pentium Pro, 64Mb RAM, винта много-много, и Windows NT ;). Несмотря на это, продвинутый пользователь может утешиться тем, что на хорошей машине LightWave так же способен распараллелиться и заюзать multi-threading подобно 3D Studio MAX. Недостатки 3D modeller'а компенсируются возможностью импорта/экспорта моделей из 3D Studio (формат .3DS).
  5. На платформу PC недавно портирован с Silicon Graphics еще один пакет, заслуживающий пристального внимания. Это SoftImage 3D. По техническим причинам мы его использовать не смогли (минимальная рекомендуемая конфигурация - Pentium не менее 100MHz, 64Mb RAM и 200Mb на винте под swap). Полная поддержка OpenGL. Из документации и слухов нам удалось почерпнуть довольно восторженные впечатления. Как сказал один мой знакомый, 'это масса крутых фичей при не менее крутых потребностях не менее крутого железа'. Более подробно об этом пакете я пока рассказать не могу, так что следите за новыми поступлениями ;)
  6. Ну и еще одна система для рисования трехмерной графики - Persistence Of Vision Ray Tracer, так же известный как POVRay, которую можно считать классикой трехмерной графики. Эта система в корне отличается от вышеописанных тем, что использует для обсчета _ТОЛЬКО_ метод трассировки лучей (в оригинале ray tracing), что гарантирует получение при рендеринге картинок более высокого качества, чем, например, при использовании 3D Studio, которая использует метод ScanLine (по-моему, он так называется :). Правда, с другой сотроны POVray отличается от других тем, что в нем напрочь отсутствует редактор сцен и моделей: они описываются на некотором подобии языка программирования (надо сказать, достаточно мощном и развитом), и сам POVray является в какой-то мере компилятором с этого языка. В следствии этого POVray можно назвать системой, ориентированной исключительно на фаната (либо на того, кого не устраивают остальные существующие системы), хотя разработано достаточно много редакторов сцен, генерирующих на выходе исходник для POVRay. Из самых растпространенных можно назвать: M На сервере POVRay есть раздел с произведениями, нарисованными фанатами этого ray-tacer'а. Очень много рутых картинок.


Фильтры и plug-in'ы

Нечасто получается изобразить нечто крутое просто так, вручную. Тогда могут помочь "фильтры", так же называемые "plug-in'ами" и "эффектами". Я буду называть их и так, и сяк. Для начала мы рассмотрим самые распространенные.

  1. Родные Photoshop'овские plug-in'ы. Их список можно увидеть в меню "Filters", если, конечно, вы не установили что-нибудь еще...
  2. AlienSkin BlackBox - коммерческий пакет для использования совместно с Photoshop, но, по утверждению AlienSkin Software, версия пакета BlackBox для Windows работает с Adobe Photoshop v2.5 или более новой, Micrografx Picture Publisher v5.0 или более новой, CorelPhotoPaint v5.0F5 или более новой, и JASC PaintShop Pro v3.12). Еще AlienSkin Software заявляет, что в данный момент BlackBox для Windows не работает с Fractal Design Painter, Pixel Paint Pro, и некоторыми другими программамиm не перечисленными выше, но, как они сами говорят, "они работают над тем, чтобы добиться максимальной совместимости с другими программами, поддерживающими фильтры к Photoshop'у", и обещают извещать зарегистрированных пользователей обо всех изменениях, дополнениях и update'ах. Пакет очень мощный и развитой, поддерживаются real-time preview, картинки в цветовых форматах RGB, CMYK, GrayScale и LabImage, а так же "слои" Photoshop'a v3.0 ("layers"), причем по утверждению AlienSkin Software 'BlackBox - это первый и единственный набор фильтров, которые позволяют редактировать прозрачность в "слоях", и поэтому "слоях" очень удобно использовать такие полупрозрачные эффекты, как DropShadow, Glow и MotionTrail'. По утверждению все того же AlienSkin Software, '32-битная версия акселерирована для Windows 95 и Windows NT'. В дистрибутив входят 16- и 32-битные версии plug-in'ов, причем инсталлятор сам сообразит, под какую систему вам надо ставить (16-битные в случае Windows 3.x, 32-битные в случае Windows 95 и Windows NT). При инсталляции очень важно правильно ответить на вопрос, куда его инсталлировать, а именно нужно указать каталог с фильтрами Photoshop'а (это обычно подкаталог plug-ins в каталоге, куда вы установили Photoshop), потому что если вы укажете другой каталог, то Photoshop после этого не увидит проинсталлированный AlienSkin BlackBox, а если поменять в настройках Photoshop'а путь к plug-in'ам на каталог с вновь установленным AlienSkin'ом, то Photoshop не увидит своих родных фильтров). После установки в меню "Filters" появится подпункт "Alien Skin", в котором и находятся данные фильтры.
    После того, как BlackBox установлен, можно начинать рисовать... Хе-хе, рисовать вы будете сами, а я попытаюсь сделать обзор возможностей пакета.
    В AlienSkin BlackBox v2.0 входят десять следущих фильтров:
    Однако в AlienSkin BlackBox v2.0 есть один неприятный глюк, описание которого вы можете прочитать здесь. Этот глюк сильно снижает впечатление об версии 2.0 данного пакета.
    Однако не все так плохо, как кажется. Недавно вышла версия 2.0a пакета AlienSkin BlackBox. Теперь пакет содержит только 32-разрядные версии всех фильтров, причем глюк версии 2.0, упомянутый выше, исправлен (правда, написано об этом было не в официальном readme, а в файле file_id.diz, который был приложен, ээээ, неким человеком, к фирме AlienSkin Software имеющим весьма далекое отношение, а именно неким членом какой-то пиратско-хакерской группы, который этот пакет где-то добыл и объявил его причисленным к категории с громким названием WAREZ). По непонятным причинам на сервере AlienSkin Software не сказано ни слова о новой версии их самого популярного продукта, что есть по меньшей мере странно.
  3. Kai's Power Tools - еще один мощный коммерческий пакет для совместного использования с Adobe Photoshop'ом. Самая навороченная и продвинутая на сегодняшний день версия Kai's Power Tools - версия 3.0. Она предоставляет кучу возможностей для манипулирования изображениями. Однако Kai's Power Tools довольно требовательна к ресурсам, а именно: по утверждениям изготовителей оно требует PC-совместимого компьютера с процессором не ниже 486 и математическим сопроцессором, однако некоторые важные компоненты KPT, такие как Texture Explorer, KPT Interform и Spheroid Designer, при разработке были специально оптимизированы под Pentium, и на чем-либо другом будут ощутимо тормозить. Если все-таки у вас _НЕ_ Pentium, то остается надеяться, что оно у вас заработает, причем вместе с крутыми фичами типа real-time preview и graphical presets. Окромя хорошего процессора Kai's Power Tools v3.0 желает около 2.5Mb из пространства главной программы (например Photoshop), а учитывая, что около от 2 до 6 Mb (а может и больше ;) потребуется чисто операционке, и еще некоторое количество памяти требуется для главной программы (8Mb - голодный минимум для Photoshop'а), итого для более или менее нормальной работы надо бы иметь не менее 16 Mb. Так же для использования Kai's Power Tools требуется Windows 95 или Windows NT, и графический редактор, который _ПОЛНОСТЬЮ_ (т.е. на 100%) поддерживает стандарт на plug-in'ы для Photoshop'a с 32-битной архитектурой (имеется в виду 32-битная архитектура plug-in'ов, хотя и Photoshop'а тоже ;).
    Дистрибутив Kai's Power Tools v3.0 включает в себя следущие plug-in'ы:
  4. PNG Import/Export plug-in - свободно-распространяемый plug-in для импорта и/или экспорта файлов в формате PNG.
  5. GIF89A plug-in - свободно-распространяемый plug-in для экспорта файлов в формате GIF89A (по умолчанию Photoshop вообще не поддерживает экспорт файлов в формате GIF). Этот plug-in свободно доступен на сервере Adobe Systems, Inc.
  6. PhotoImpact GIF/JPEG Smart-Saver фирмы Ulead Systems, Inc.. Этот plug-in позволяет при записи файлов в формате GIF делать их interlaced, т.е. отображающимися через строчку, а не подряд, уменьшать размер палитры и делать цвета и/или области прозрачными. Для JPEG-файлов он позволяет производить дополнительное растрирование, что, по заявлению фирмы, "позволяет еще сильнее повысить коэффициент сжатия", а так же записывать JPEG-файл как Progressive. Этот plug-in работает с Ulead PhotoImpact, Adobe Photoshop, или любым другим редактором, который поддерживает 32-битные plug-in'ы для экспорта. Кроме всего прочего новая версия может работать как отдельное приложение. Для скачивания доступна 30 days trial version, так что скачивайте ее каждые 29 дней - и все нормально :)


Полезные советы и рецепты

Если бы эта страница была написана по-английски, то данный раздел носил бы название "Tips and tricks", но сие выражение довольно трудно переводимо на русский язык, поэтому остановимся на названии "Полезные советы и рецепты".

  1. Полезный совет для пользователей AlienSkin BlackBox v2.0. Как известно, в BlackBox есть область realtime preview, в которой отображается то, что получится после применения какого-либо фильтра с текущими установками. Так вот, разработчики, похоже, нечаянно (или умышленно) не предусмотрели того, что картинка, на которую накладывается фильтр, может целиком влезать в область preview и даже быть меньше ее по размерам. Если такая ситуация имеет место, то произойдет General Protection Fault, и ваш Photoshop будет закрыт с сообщением об ошибке. Такой глюк имеет место _ВО_ВСЕХ_ фильтрах пакета, и избежать этого можно только одним способом: всегда начинайте с большого изображения, а если далее вам понадобится маленькая картинка - воспользуйтесь Cropping Tool и обрежьте ее до нужного размера. Вот и вся хитрость. Данный глюк исправлен в версии 2.0a, поэтому узнайте версию установленных у вас фильтров (если у вас Adobe Photoshop, то в меню "Help" выберите пункт "About plug-ins...", и далее выберите, скажем, DropShadow 2.0, появится окно, в котором написана версия), и если у вас 2.0a, то можете быть спокойны - у вас этого глюка нет, и поэтому данный совет можете пропустить ;). Удачи!