Абсолютно все во всем мире уже знают, что Apple прокачали экран iPad’а до плотности Retina, учетверив число пикселей до чудовищной величины в 3,1 миллиона. Замечательный новости для всех владельцев iPad — ведь дисплей будет выглядеть потрясающе — однако это же означает и большую головную боль для дизайнеров, а также тяжкий удар по счетам за трафик и скорости загрузки.
С точки зрения трафика, пиксели имеют вес, и четырехкратное увеличение разрешения означает неизбежность вчетверо более тяжелых растровых изображений. Если вам захочется воспользоваться всеми преимуществами этого шикарного экрана, каждое изображение, которое вы собираетесь протолкнуть, должно весить тонну. То же касается и всего остального.
По совершенно понятным причинам рабочего и делового характера, огромное количество издательств давно используют платформы наподобие Woodwing и Adobe Digital Publishing Suite.1 Проблема здесь в том, что эти инструменты публикуют картинки страниц, а не раскладку из текста и изображений. Они являются гигантскими растровыми иллюстрациями.
Эти горы пикселей компонуются в файлы, каждый из которых размером с мамонта, и их загрузка может занимать продолжительное время. (Apple Newsstand реализует это наилучшим образом, осуществляя дозагрузку в фоновом режиме). Издательствам, желающим извлечь преимущества из нового дисплея iPad — то есть всем — придется увеличивать эти и без того огромные файлы в четыре раза. Как недавно заметил Дэвид Слейт:
Теперь, применив это увеличившееся разрешение к нам, мы легко поймем, почему размер среднего номера журнала для iPad грозит проломить крышу. Грубо говоря, одна страница текста, сохраненная с легким JPG-сжатием, весит порядка
И весь вопрос даже не в том, сколько трафика будет пожирать загрузка такого файла, а в том, найдется ли у пользователя достаточно свободного места для его хранения. Характеристики экрана изменились, однако iPad по-прежнему поставляется в прежних трех вариантах с памятью на 16, 32 и 64 ГБ. Как я уже писал в Twitter’е: темпы роста потенциальной полезной нагрузки начинают в геометрической прогрессии перерастать темпы роста возможностей хранилища.
Очевидно, что такое положение вещей неприемлемо, а значит, либо издательствам нужно начинать думать (и быстро) об использовании новых инструментов и рабочих сред, либо разработчикам следует подумать над совершенствованием генерирования файлов журналов в более компактном формате. Недавний обзор от CondeNast намекает, что Adobe начинает переходить к использованию HTML5 в своих программах. Если они доведут дело до конца, это, несомненно, благотворно скажется как на размерах файлов, так и на качестве материала. Читатели наконец-то получат возможность выделять текст, копировать его, масштабировать и так далее.
Но из леса нас это по-прежнему не выведет. Веб-технологиям, таким как HTML5, еще только предстоит учиться работать с новым дисплеем iPad.
Создание единого веб-сайта для всех устройств и платформ является идеалом для каждого веб-дизайнера и главной задачей любого проекта. Спросите себя: можем ли мы создать единый базовый HTML блок, а затем использовать «резиновый» дизайн и прогрессивное увеличение для того, чтобы изящно адаптировать этот HTML под любой экран? (Данный единообразный подход не всегда является практичным, он всегда зависим от проекта).
Как индустрия, мы всё еще находимся в поиске верных путей создания восприимчивого дизайна, и главной проблемой здесь является работа с изображениями. Хотя очень просто заставить браузер масштабировать большое изображение так, чтобы оно помещалось на крошечный экран, вопрос траффика призывает нас избегать отправки больших файлов устройствам с ограниченными способностями к визуализации. Новый iPad делает проблему еще заметнее. Отправка полноформатной картинки для iPad (1536×2048) в браузер iPod Toch (320×240) приведет к загрузке файла в 25 раз превышающего необходимый и достаточный объем. В беспроводной сети это будет болезненно.
Проблема не нова. Парни, работающие на передовой мобильного веб-дизайна борются с проблемой масштабируемых изображений уже не один год. Как заставить сервер посылать картинку нужного размера вместо одной-гигантской-которая-всем-подойдет?
У нас пока нет достойного ответа. Джейсон Григсби перечисляет множество методов (и еще, и еще больше), хотя ни один из них не совершенен, а Мэтт «Wilto» Маркус предлагает сделать шаг вперед, усовершенствовав сам HTML. Каким бы ни стало окончательное решение, оно будет означать, что редакторам придется добавлять всё больше и больше картинок разных размеров для серверного арсенала. И да, это ведет нас к следующему пункту:
Недавно я выполнял кое-какую работу для веб-сайта журнала. За долгие годы их контекстные изображения различного рода разрослись настолько, что им приходилось создавать по десять вариантов размера для каждой фотографии. Изображения для миниатюр, для галереи, для основной статьи и превью — ну, вы идею поняли. Множество изображений для различных макетов. И всё это было создано для одной единственной платформы — настольного PC — при это даже не были учтены различия в развертке всех мониторов последних лет.
А теперь самое главное: размеры большинства из этих изображений были слишком малы для мобильных устройств. Вы не ослышались. До недавнего времени считалось, что изображения 600×600 достаточно велики для веб-сайта. На мониторе компьютера такая картинка хорошо смотрится, даже будучи развернута на весь экран. Но на Retina iPhone она его даже не заполнит. Физические габариты современных телефонов могут быть не велики, но экранное разрешение некоторых из них выше, чем иных полноформатных компьютеров. Размер изображений придется подгонять под их разрешение.
Дабы соответствовать iPhone и iPad, журнал создал новый формат 768×1024. Теперь же им придется добавить, по меньшей мере, еще одно разрешение, а может и больше. Конечно же, часть этой работы может быть автоматизирована, но, во многих случаях, новое разрешение будет означать другое соотношение сторон, что означает необходимость работы вручную. Большее разнообразие экранных размеров означает больше работы с изображениями, дисковым пространством и базами данных.
И конечно же, теперь у iOS дизайнеров появится больше работы. Как и в случаях с iPhone 4 и 4S, разработчикам придется тратить еще больше времени на создание иконок, графику приложений и прочее. Большой уже сейчас, универсальный перечень иконок различных размеров разрастется еще больше. Луи Мантиа с радостью поделился с нами своим макетом-шпаргалкой для Photoshop, который поможет вам контролировать свою работу над иконками.
Не хмурьтесь — это же здорово
Послушайте, это тяжелая работа. Есть тонны устройств, поддержку которых мы должны обеспечить, и мы обязаны создавать дизайн-наборы, которые не просто будут соответствовать размерам новых экранов, но и согласовываться с моделью взаимодействия каждого из них. Наша работа становится всё более трудной, и это лишь начало.
Но, чёрт возьми, это ведет к чему-то невероятному. Распространение этих устройств ведет к созданию технологий, адаптирующихся к нашей действительности. Прекрасные экраны планшетных компьютеров, голосовые интерфейсы, поддержка сенсорных жестов — на нас, как на дизайнеров и создателей контента, эти вещи накладывают всё новые обязательства. Но, бог мой, что за возможности они предоставляют для творчества! Как пользователь и дизайнер, от имени всех, я приветствую нашего нового
Оригинал статьи: http://globalmoxie.com/blog/new-ipad-image-sizes.shtml
1 Инструменты Woodwing и Digital Publishing Suite по сути являются плагинами Adobe inDesign. Они позволяют конвертировать печатные материалы в интерактивные версии для iPad. Это позволяет издателям, используя тот же дизайн, рабочее пространство и персонал, портировать свой контент на платформу iPad. Процесс имеет множество недостатков с точки зрения пользовательского взаимодействия, однако я считаю это оправданным. Эти инструменты представляют собой промежуточное звено, благодаря которому издатели получают возможность доступа к клиентуре iPad (относительно) быстро и (относительно) дешево. Следующей фазой будет поиск способа создания более естественного способа взаимодействия для «планшетников» или любой другой платформы, которую издатели выберут своей целью. Инструменты первого поколения вроде Woodwing и Digital Publishing Suite являются необходимым злом.
Абсолютно согласен с резюме в конце статьи. Жизнь изо дня в день действительно становится сложней, но цель, стоящая за всеми этими усложнениями, безусловно, стоит потраченных усилий. Ощущения от взаимодействия с новым Retina-экраном потрясающие. А, ведь, ещё вчера казалось, что у iPad 2 прекрасный экран и куда, спрашивается, больше?
Автор статьи утверждает, что из-за очень высокого разрешения нового экрана iPad медиа-контент станет более «тяжелым». Спорить тут не с чем, это «медицинский факт». Но нельзя забывать о том, что каналы связи тоже не стоят на месте. Стремительно увеличивается количество точек доступа Wi-Fi. Сейчас они есть не только в большинстве ресторанов и кафе, но и даже в метро, в учебных заведениях. Быстрыми темпами развиваются мобильные сети — в Москве уже введен формат 4G, а Санкт-Петербург практически на 100% покрыт сетью 3G. Да и с точки зрения денег мобильный интернет становится всё более доступным. Поэтому, на мой взгляд, баланс практически не нарушается. Технологии связи в России, конечно, отстают от того, что необходимо для комфортной работы с современными мобильными устройствами, но, надо признать, что не очень сильно.
Проведите конкурс среди участников CMS Magazine
Узнайте цены и сроки уже завтра. Это бесплатно и займет ≈5 минут.
Director of Product Design в Acronis
Проблема преувеличена
В статье сильно преувеличены проблемы, которые принесут экраны с большим разрешением. Изначально у издательств все исходные файлы существуют в виде вектора. Нужно только правильно переделать конверторы, чтобы они делали, например, векторные PDF или набирающий популярность ePub.
Дизайнеры тоже не пострадают. Большинство используют в работе векторные файлы и растеризовать картинку под нужное разрешение не составит большого труда. Верстальщики — вот у кого будет много работы.
Apple x2
Компания Apple поступила очень умно и гуманно по отношению к разработчикам. Они увеличили разрешение ровно в два раза. То есть, старые программы работают точно так же, просто графика более зернистая. Все пиксели на месте. А ведь могли увеличить разрешение, например, в 1,75 раз. Или, хуже того, изменить соотношение сторон. Всё, что мы сейчас во всей красе видим на платформе Android.
Retina Display в iMac и MacBook
Меня очень волнуют перспективы использования экранов большого разрешения на ноутбуках и настольных компьютерах. С одной стороны, не имеет смысла делать супер-большое разрешение, так как обычно глаза довольно далеко от экрана. С другой стороны, если поступить как с iPhone и iPad и увеличить в два раза разрешение iMac с диагональю 27″, то получится разрешение 5 120×2 800 или 14,7 миллионов пикселей. Мама родная.