О дизайне в интерактивном телевидении

а также в телерекламе и мультипликации

Самый красивый дизайн, самые удачные цветовые комбинации и самые приятные формы я видел только в работах самой природы или Господа Бога (подчеркнуть соответствующее вашим убеждениям). Причем абсолютно все картинки анимированы и снабжены звуковым сопровождением завидного качества. Обратите внимание на детализацию, продуманность, качество изображения наконец! Абсолютная кросс-платформенность: устройство для просмотра - здоровые человеческие глаза и уши.

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

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

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

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

Игры с полупрозрачностью
Поверх живой картинки накладывается полупрозрачная панель, по которой бежит текст или располагаются элементы интерфейса. Прием очень опасен, так как живая картинка под полупрозрачной панелью сильно теряет в качестве, а текст на панели трудно читаем. С другой стороны, очень прилично выглядят абсолютно прозрачные мини-панели, на которых помещается всего один-единственный маленький объект, например, знаменитое "Press RED" в правом верхнем углу на каналах SKY.

Комбинации цветов
У многих провайдеров интерактивного ТВ принято цветовое кодирование: кнопки красного, зеленого, желтого и синего цвета получают определенные назначения, например, красный у SKY - переход в интерактивный раздел или активация выбранной функции. Поэтому логично использовать эти 4 цвета для маркировки соответствующих функций.

Практически все каналы определяют свои собственные палитры, каждая состоит из 5-6 цветов - именно их и рекомендуется использовать в оформлении интерактивной аппликации, причем не смешивая палитры. 5-6 цветов обычно бывает более чем достаточно для создания удобного интерфейса. Если канал не предъявляет четких требований к выбору палитры, все равно лучше ограничиться 4-5 цветами, не забывая о "безопасных" цветах и их сочетаниях для телевидения (несколько разные для PAL и NTSC).

Посмотрим на заставки SKY News, они используют всего 4 цвета - красный, синий, белый и черный - три первые из них являются цветами их логотипа. Просто, красиво, разборчиво.

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

Эффекты со шрифтами
Разрешение телевизионного экрана значительно уступает разрешению компьютерного монитора, поэтому подбор шрифтов требует особого внимания. На практике часто получается, что жирные шрифты выглядят четче. Как же выделить в тексте отдельное слово? С помощью цвета, регистра (все буквы заглавные), окантовки или мигания.

Анимации
Самый проблемный прием, требующий высокого качества исполнения. В отличие от транслируемого мультипликационного ролика, анимация реализуется на уровне интерактивной аппликации, скорость выполнения которой зависит от характеристик цифрового декодера (set-top box). По состоянию на сегодня (2005 г) далеко не все декодеры позволяют "крутить" приличные анимации, так что приходится подгонять анимации под возможности "железа", и если последних не хватает, лучше отказаться от анимации вообще, чем изображать позорное ломано-дерганное движение.

Альтернативы есть - даже слабенькие декодеры отлично справляются с "мигалками", то есть анимациями, в которых сменяются цвета объекта, а не его положение на экране. Кроме того, технически возможно вместо анимации прокручивать видео ролик.

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

Жидкокристаллические и плазменные мониторы окончательно решили проблему "дрожания" тонких линий и соединений проблемных цветов добившись невозможной для кинескопов четкости изображения. Понятное дело, эти технологии допускают значительно большее разрешение чем 640x480 или 760x576, для чего они, собственно, и создавались. Графика, оптимизированная "под телевизор", на жк-мониторе будет выглядеть убого, поэтому создание универсальных изображений, одинаково прилично смотрящихся на разных типах экранов, - настоящий вызов дизайнерам.



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



Если вам понравилась эта статья, возможно, будут интересны и другие, а также моя книга и мой видео-блог. За рекламным баннером ниже тоже может быть что-то полезное.


Я.Б.