10 сентября Microsoft представила обновления Expression Studio и Silverlight. Оба продукта «доросли» до третьей версии. Любопытно, что пакет Expression Studio и технологию Silverlight корпорация обновляет гораздо быстрее, чем, например, Windows или Office: первые версии Expression Studio и Silverlight вышли всего около двух лет назад и с тех пор пережили два серьезных обновления. Причем, информация об Expression Studio 3 и Silverlight 3 была озвучена еще весной, на конференции ReMIX 09, и теперь оба приложения доступны для использования. Чем интересны Expression 3 и Silverlight 3? Каковы отличия новых версий от старых? На эти вопросы мы обязательно ответим, но прежде, скажем пару слов о предназначении этих приложений.
Expression Studio — это профессиональный набор инструментов для веб-дизайна. В пакет Expression Studio входят приложения: Expression Web, Expression Encoder, Expression Blend, SketchFlow и Expression Design. Ориентировочная розничная цена на Expression Studio — $600, стоимость перехода с предыдущей версии — $350. Тот же комплект, но без Expression Blend и SketchFlow можно купить за $150, а обновление будет стоить $80.
Что касается Silverlight 3, то это технология для создания мультимедийных интернет-приложений (если смотреть со стороны разработчика) и плагин для браузера, позволяющий работать с сайтами, созданными на базе Silverlight (если смотреть со стороны пользователя). Первоначально Silverlight был просто аналогом Flash, но к третьей версии функционал технологии Microsoft стал существенно более богатым, чем у разработки Adobe (без которой, впрочем, по-прежнему немыслим современный Интернет).
Что нового появилось в Silverlight 3? И какую эволюцию прошла эта технология с момента своего появления и до настоящего времени? Этому будет посвящена первая часть нашей статьи.
Silverlight 3
Для начала — несколько фактов, приведенных Microsoft: на данный момент Silverlight был установлен более чем 300 миллионов раз (Silverlight есть примерно на каждом третьем компьютере в мире), более 400 тысяч разработчиков и дизайнеров работают с этой технологией.
Разумеется, это не значит, что конкурент в лице Adobe Flash побежден — об этом даже речи идти не может, однако Silverlight смог занять свое место, довольно быстро стал привычным и теперь на равных сосуществует с Flash. Microsoft не сидит, сложа руки, а предпринимает активные шаги для развития и продвижения своей технологии. Развитие в данном случае — это расширение функциональных возможностей. И в Silverlight 3 был сделан, пожалуй, самый большой шаг вперед. Ключевые преимущества третьей версии следующие:
- Поддержка видео высокого разрешения (кодек H.264 — в дополнение к встроенному VC-1)
- Адаптивное вещание Smooth Streaming (подробнее об этом речь пойдет ниже)
- Возможность работы вне браузера
- Функция «гипер-видео»
- Новый стандарт просмотра и создания изображений со сверхвысоким разрешением Deep Zoom
- Поддержка аудиоформата AAC и DRM-защиты аудиоконтента
Из них заслуживают отдельного рассмотрения технологии Smooth Streaming и Deep Zoom. Об остальных возможностях поговорим на примерах конкретных веб-сайтов.
Smooth Streaming
Думаем, каждый, кто смотрел потоковое видео (например, на YouTube), сталкивался с тем, что качественные ролики зачастую подтормаживают. Либо скорость интернета недостаточная, либо процессор не справляется. А возможно, и то, и другое. Самое обидное, что порой, даже обладая отличным компьютером и хорошим интернет-сигналом, вы не знаете наверняка: удастся ли вам без проблем посмотреть высококачественный видеопоток или нет. Например, вы пришли в кафе, где есть Wi-Fi, включили ноутбук и, будучи уверены в достаточной силе сигнала, запустили онлайн-трансляцию футбольного матча в хорошем качестве. Но через несколько минут в кафе еще несколько человек подсоединились к сети, и вот, уже вам не хватает ширины канала. Что делать?
Именно для решения этой проблемы программистами Microsoft была разработана технология Smooth Streaming, позволяющая в прямом времени адаптировать качество/объем видеопотока к возможностям конкретного пользователя. То есть пока у вас хороший сигнал, видео будет передаваться в максимальном качестве. Как только сигнал станет более слабым, изображение автоматически приспособится к новым условиям. Технически, это реализовано следующим образом: используется гибридный метод доставки медиа, который работает как потоковое вещание, но базируется на существующем HTTP-кэшировании и, по сути, является серией прогрессивных загрузок.
Таким образом, для поставщиков контента (создателей сайтов с потоковым видео) преимущества следующие:
- Меньше затрат на развертывание
- Лучшее масштабирование и больший охват
- Нет необходимости жестко задавать качество
Пользователи получают не меньше:
- Быстрая загрузка и перемотка
- Нет буферизации, обрывов и ожиданий
Для создания и размещения потокового видео с использованием технологии Smooth Streaming вам понадобится приложение Microsoft Expression Encoder, входящее в пакеты Expression Studio и Expression Web. В Expression Encoder поддержка Smooth Streaming реализована, начиная с версии 2 SP1.
Приведем несколько примеров российских сайтов, где применена технология Smooth Streaming. Прежде всего, это спортивный онлайн-канал Sportbox. В случае со спортивными трансляциями необходимость адаптивного вещания особо хорошо видна: во-первых, хочется получить картинку в максимальном качестве (например, чтобы увидеть летящий мячик в теннисе или рассмотреть, какой именно хоккеист забил гол), во-вторых, совершенно нежелательны подтормаживания — как будет обидно пропустить решающий момент в матче из-за того, что у вас затормозил интернет!
Еще один пример внедрения Smooth Streaming — интернет-портал Российского Государственного Гуманитарного Университета (РГГУ). Там эта технология используется для онлайн-трансляций лекций, которые могут смотреть студенты, обучающиеся дистанционно. Третий пример — официальный сайт Мариинского театра. Здесь доступны и интервью с музыкантами, и записи спектаклей. На первый взгляд, Мариинскому театру все эти новомодные технологии нужны в меньшей степени, чем спортивному каналу и онлайн-лекциям РГГУ – например, разве есть разница, в каком качестве смотреть интервью Гергиева? Но Мариинка в данном случае ориентируется на западных коллег — прежде всего, на Metropolitan, где каждая премьера транслируется в прямом времени и в HD-качестве. Когда такое будет и у нас — большой вопрос. Но если прямые трансляции все-таки появятся, то технология Smooth Streaming будет как нельзя кстати: далеко не все отечественные меломаны имеют дома широкий интернет-канал, а попасть на оперную премьеру едва ли не сложнее, чем на футбольный матч какого-нибудь чемпионата.
Deep Zoom
Еще одна важнейшая технология, реализованная в Silverlight, — это Deep Zoom. Зачем она нужна? Сейчас существует очень много сайтов с фотогалереями. Как правило, все они организованы по одному принципу. Пользователь видит ряд небольших превью, сгруппированных по разделам или по авторам. Если пользователю понравится какая-либо картинка, он может кликнуть по превьюшке, и тогда откроется исходная фотография. Сценарий привычный и, казалось бы, безальтернативный. Но у него есть несколько недостатков. Во-первых, превью зачастую бывают слишком маленькими, чтобы понять, действительно ли вам хочется увидеть эту фотографию крупнее. Во-вторых, размер исходной фотографии может быть, наоборот, слишком велик. И тогда вы, кликнув на превью, вынуждены несколько секунд смотреть, как фотография постепенно загружается (а потом браузер ее еще и «схлопывает» до размера экрана).
Совсем иной принцип работы с фотогалереями предлагает Silverlight 3. Вы видите такие же превьюшки, но наведя мышку на любую из них, вы можете ее плавно увеличить (с помощью колесика мышки), причем не только целиком, но и какой-то один выбранный фрагмент. При этом, никаких «тормозов» вы не ощущаете, потому что разрешение регулируется динамически, и именно в том месте фотографии, которое вам интересно. Мало того, что это очень красиво (плавно увеличение или уменьшение фотографии; ощущения сродни тем, которые бывают при работе с фотографиями на iPhone), так еще и польза для некоторых типов сайтов очевидна. Самый яркий пример — VOGUE.ru, интернет-портал самого авторитетного журнала о моде.
Фотогалереи с показов мод — главный контент этого сайта (хотя там есть и интервью, и блоги известных людей моды, и прочие интересные вещи). И большинство посетителей приходят на VOGUE.ru именно для того, чтобы посмотреть новые модные коллекции. И, листая фотографии моделей, мы периодически останавливаемся, чтобы рассмотреть интересующее нас платье или костюм в деталях. Именно здесь и требуется Deep Zoom. Вы можете увеличить любой фрагмент платья, не изменяя размер окна и даже не разворачивая браузер на весь экран.
Еще один пример удачного применения технологии Deep Zoom — сайт президентской библиотеки имени Ельцина. Здесь можно ознакомиться с историческими документами, которые отсканированы с высочайшим разрешением, достаточным для того, чтобы рассмотреть самые мелкие пометки. И Deep Zoom как раз позволяет удобно и без потери времени работать с подобными изображениями. Кроме того, реализацию Deep Zoom можно увидеть на только что открывшемся русскоязычном сайте Silverlight: на главной странице мы видим «облако» миниатюр, каждая из которых — скриншот с сайта, сделанного на Silverlight.
Другие возможности Silverlight 3
Выше, мы говорили о технологиях Silverlight 3 для работы с визуальным контентом. Что касается сайтов, продающих музыкальные треки, то их создателей наверняка заинтересует поддержка цифровой защиты аудиоконтента (DRM) и формата AAC. Первое — это необходимое условие для работы с крупными западными лейблами (Universal, Warner, EMI и др.). Второе — облегчает работу с iTunes / iPod. Пример российского сайта, где это реализовано — http://etracks.ru/.
Правда, не совсем понятно, зачем это понадобилось именно этому интернет-магазину. А как можно реализовать функцию «гипер-видео», демонстрирует портал Actio.tv, предлагая пользователям интерактивный сериал, в котором зритель может сам влиять на развитие сюжета. Допустим, герой входит в дом, там за ним гонится убийца с топором, и герой должен от него убежать. От действий зрителя зависит, спасется герой или нет. Причем, все это снимается на любительскую камеру в реальных московских зданиях и улицах. Правда, не совсем понятно, чем это отличается от обычной компьютерной игры, и, соответственно, кому может быть полезна функция «гипер-видео«, за исключением таких специфических проектов.
Silverlight демонстрирует впечатляющий набор функций, а если к этому добавить появление российского сайта Silverlight и первого подробного руководства по этой технологии (в PDF-формате оно доступно для бесплатного скачивания), а также новой версии пакета Expression Studio 3 (о котором пойдет речь во второй части статьи), будущее Silverlight покажется совсем радужным. Но пока есть несколько серьезных недостатков, мешающих распространению этой технологии. Во-первых, даже на быстром компьютере с хорошим интернет-каналом сайты на Silverlight грузятся достаточно долго. Проверьте хотя бы на официальном русскоязычном сайте Silverlight. Во-вторых, не со всеми браузерами Silverlight корректно работает. Например, тот же сайт (точнее, его графическая часть) у меня так и не открылся на Safari 4 for Windows (тогда как Safari на MacOS X все же смогла справиться с задачей, хоть и не так быстро, как хотелось бы). В-третьих, Flash пока еще слишком серьезный конкурент, и по распространенности Silverlight ему все еще существенно уступает… То есть вариант «не ставить Flash и использовать только Silverlight» пока не рассматривается. А раз так, то для разработчика сайтов Silverlight выглядит гораздо менее привлекательно, чем Flash — разумеется, если нет острой необходимости в тех функциях, которые пока есть только в Silverlight.
Во второй части статьи мы рассмотрим новшества Microsoft Expression Studio 3 и подведем итоги.
