Веб-дизайн

Роль размывок в дизайне становится понятнее, если вспомнить о тех физических явлениях, которые моделируются компьютерными алгоритмами размывки. Самое очевидное и уже упоминавшееся явление такого рода — это глубина резкости в фотографии, расплывчатость объектов, расположенных ближе или дальше того расстояния, на которое настроен объектив. Возникающая из–за этого размытость фона, противопоставленная на большинстве фотографии четкости объектов переднего плана, подсказывает, как искусственную компьютерную размывку можно применять (наряду с нетекстурирующими эффектами) для построения иерархии видимости, психологической яркости, «переднеплановости» элементов. Размывка по Гауссу превращает любое изображение в фон (пример 4), отдаляет его от зрителя; с другой стороны, использование в качестве фона пусть и фотографического, но при этом совершенно лишенного естественной или искусственной размытости изображения есть серьезная и, к сожалению, часто встречающаяся ошибка дизайна (самый яркий пример — фон из «мятой бумаги», делающий чтение теста настоящим мучением).

Другой источник оптической размытости — быстро движущиеся объекты, представляющиеся человеческому глазу (и объективу фотоаппарата) размытыми вдоль направления движения. Соответственно, фильтры направленной размывки, такие как Motion Blur и Wind в Photoshop, часто применяются для придания динамики статическим объектам и для подчеркивания движения того, что само по себе уже движется (например, элементов анимированных рекламных баннеров). Так, в примере 16 горизонтальное строение страницы подчеркивается горизонтальной же размывкой заголовка «IDEO» вверху, — подразумеваемое движение которого превращается в реальное в момент прокрутки страницы (см. также стр.168).

Наконец, третий источник размытости в окружающем нас мире — это тени, которые никогда не имеют абсолютно четких очертании из–за того, что источники света не могут быть безразмерными точками. Поэтому без той же самой гауссовской размывки не обойтись при создании любого рода падающих теней и барельефной трехмерности (стр. 293). Любой объект, отбрасывающий позади себя тень, немедленно вводит в графику третье измерение и подразумеваемую на некотором расстоянии от этого объекта фоновую плоскость, на которую и падает тень. По закону контраста сам объект при этом начинает казаться более близким, ярким и отчетливым. В отличие от двух других применений размывки, обсуждавшихся выше, этот прием лучше всего смотрится с плоскоцветными объектами и текстовыми заголовками.

Эффекту размывки родственны разнообразные искажения, отражающие изображение в кривом зеркале или волнующейся поверхности воды (в Photoshop к этой категории относятся Ripple, Smear, Spherize, Pinch и др.). Иногда эти виды искажений применяются для создания трехмерных эффектов (например, развевающегося флага), а некоторые из них подразумевают и определенную размывку частей изображения. Чаще всего, однако, эти фильтры дают откровенно юмористический эффект в применении к легко узнаваемым объектам (например, к человеческому лицу) и не дают вообще никакого осмысленного эффекта в остальных случаях (если закрутить спиралью и без того бесформенное облако, ничего особенно интересного не получится).

Противоположный эффект дают фильтры, сводящие фотографические текстуры к плоским. Одни из них (фильтры Cutout, Fresco) аппроксимируют исходное изображение областями плоского цвета (похожий эффект дает сохранение картинки в формате GIF с малым количеством цветов без диффузии), другие пытаются найти в изображении и сделать видимыми контуры, т. е. достаточно резкие границы между объектами (фильтры Find Edges, Trace Contour). Дизайнерская ценность этого рода преобразований заключается именно в контрасте очевидно фотографического происхождения изображений с их абстрактным, почти геометрическим представлением. По этой же причине интересно бывает поэкспериментировать с трассировкой фотографий в векторном редакторе (стр. 100).

Все перечисленные выше эффекты независимы от разрешения в том смысле, что при сохранении одного и того же соотношения между размером изображения в пикселах и масштабом применяемого к нему эффекта (например, радиусом гауссовской размывки или размером «вспучивания») результат будет выглядеть одинаково. Существуют, однако, эффекты, завязанные на размер единичного пиксела. Так, фильтр Diffuse на изображениях с высоким разрешением (т. е. с мелкими пикселами) почти неотличим от обычной размывки, тогда как при меньшем разрешении становятся видны отдельные пикселы, которые перемешиваются этим фильтром без какого–либо усреднения и придают изображению характерную зернистую текстуру. Сюда же относятся эффект «шума» (фильтр Add Noise) и диффузия, возникающая как побочный эффект оптимизации GlF-файлов.