Гонка за ppi: новое безумие хайтека. Выбираем смартфон с максимальным количеством пикселей на дюйм

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

Пиксельная плотность обозначает количество пикселей, которое вмещается в определенном физическом размере (обычно, это дюйм). На первом Mac-е было 72 пикселя на дюйм – число вроде кажется большим, но на самом деле это были огромные пиксели, под которые еще не каждая графика подойдет.

Технологии экранов с тех времен очень продвинулась вперед, и сейчас даже самые базовые компьютерные экраны имеют разрешение где-то между 115 и 160 пикселей на дюйм (ppi – pixel per inch). Но новая глава в этой истории началась в 2010 году, когда Apple представила iPhone с экраном Retina – суперчеткий экран, который удвоил количество пикселей на дюйм. В результате этого релиза графика стала четче, чем мы когда-либо видели.

Видите разницу в иконке конверта Mail, а также четкость текста?

Чтобы поддерживать тот же физический размер пользовательского интерфейса, пиксельные размерности удвоились. Кнопка, которая ранее занимала 44px, сейчас стала занимать 88px. Для совместимости между разными устройствами, дизайнеры должны выпускать графику (по типу иконок) в “1x” и в новом формате “2x”. Но тут возникла еще одна проблема: вы не можете больше сказать: “Привет, эта кнопка должна быть 44 пикселя в высоту”, потому что она должна быть также 88 пикселей на другом устройстве. Раньше не было единицы измерения, не зависимой от пикселя. Решением стали “точки” (points), или “pt”. 1 точка соответствует 1 пикселю на экранах до поколения retina и 2 пикселям на экране retina в 2х. Точки позволяют сказать: “привет, эта кнопка должна быть 44 точки в высоту”, и потом любое устройство может адаптировать этот размер под свой коэффициент плотности пикселей… как 1х или 2х. Или же 3х в случае с iPhone 6 Plus.

PT и DP

Конечно, это все не только актуально для устойств Apple, в эти дни каждая операционная система – будь то десктопная или мобильная версии, поддерживает экраны с высоким ppi/dpi. В Google придумали свою единицу измерения для Android, независимую от пикселей . Она не называется “точка”, она называется “DIP” – пиксель, не зависящий от плотности, сокращенно “dp”. Это не эквивалент точек в iOS, но идея похожа. Это универсальные единицы измерения, которые можно конвертировать в пиксели с помощью масштабного множителя устройства (2x, 3x и т.д.).

Возможно, вас интересует физический размер точки. На самом деле, UI-дизайнерам не особо это важно, потому что у нас нет никакого контроля над аппаратными особенностями экранов разных устройств. Дизайнерам нужно просто знать, какие плотности пикселей принял производитель для своих устройств, и позаботиться о подготовке дизайнов в 1x, 2x, 3x и прочих нужных коэффициентах. Но если вам реально любопытно, знайте, что в Apple нет постоянной конверсии между дюймами и точками. Другими словами, нет единой плотности пикселей, которая представляет 1 точку – это зависит от конкретного устройства (посмотрите раздел “Восприятие масштаба” ниже). В iOS точка варьируется от 132 точек на дюйм до 163 точек на дюйм. На Android DIP всегда равен 160 ppi.

Контролируемый хаос

А теперь приготовьтесь окунуться в реальность. На ранних порах развития мобильных устройств с высоким разрешением, плотность пикселей была просто 1х или 2х. Но сейчас все совсем сошли с катушек – есть масса пиксельных плотностей, которые должен поддерживать дизайн. В Android есть отличный пример: на момент написания этого поста разные производители поддерживают шесть разных плотностей пикселей. Это означает, что иконка, которая имеет одинаковый размер на всех экранах, на самом деле должна быть выполнена в 6 разных вариациях. Для Apple актуально два или три разных исходника.

Дизайн в векторе. Дизайн в 1х.

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

Второй урок: мы должны все рисовать в масштабе 1х . Другими словами, создавайте дизайн, используя точки для всех измерений, затем масштабируйте в различные более крупные пиксельные плотности при экспорте… вместо дизайна в конечных пиксельных разрешениях конкретных устройств (2x, 3x и т.д.) и возникновения массы проблем при экспорте. Так как масштабирование 2x-графики в 150% для генерации версии в 3х провоцирует появление размытых контуров, это не лучший вариант. А вот масштабирование графики 1х в 200% и 300% позволяет сохранить визуальную четкость.

Макеты для стандартных размеров iPhone должны быть 375×667, а не 750×1334, это как раз то разрешение, в котором оно будет отображаться. Большинство инструментов дизайна не отличают точки от пикселей (Flinto – исключение из этой тенденции), так что дизайнеры могут притвориться, что точки это и есть пиксели, а затем просто экспортировать исходники в 2х- и 3х-кратном размерах.

Притворяйся, пока это не станет правдой!

Тут уже немного сложнее, но все же стоит это упомянуть: иногда устройства лгут. Они делают вид, что их коэффициент преобразования пикселей в точку один, например, 3х, а на самом деле, оно 2.61х, а сам исходник масштабируется в 3х просто для удобства. Вот что iPhone Plus сейчас и делает. Он сжимает интерфейс, сделанный в 1242×2208 до разрешения экрана в 1080×1920 (графический чип телефона реализует это масштабирование в реальном времени).

Создавайте дизайн под iPhone Plus, как если бы он на самом деле был 3х. Телефон сам смасштабирует его в 87%.

Так как графика лишь немного уменьшается (87%), результат по-прежнему выглядит достойно – линия толщиной в 1px на экране почти в 3x выглядит все равно невероятно четкой. И есть шансы, хотя я не располагаю никакой инсайдерской информацией, что в будущем Apple представит настоящий 3x iPhone Plus, так как нужные аппаратные возможности вполне могут быть доступны для продукта, выпускаемого в таких огромных количествах. Текущая версия iPhone Plus попросту существует, пока это не станет возможным.

(Брюс Вонг написал об экране iPhone 6 Plus).

Приемлем ли такой подход нецелочисленного масштабирования? Все проверяется на практике. Достаточно ли незаметен результат от такого масштабирования? Многие устройства на Android также прибегают к масштабированию для подгонки под более стандартный коэффициент пиксель-в-точку, но, к сожалению, некоторые из них делают это не очень качественно. Масштабирование такого плана нежелательно, так как все, что вы хотите сделать четким и pixel-perfect в одном масштабе, станет размытым из-за интерполяции (например, линия в 1px становится 1.15 пикселей). Даже если вы не фанатичны в подгонке идеальных пикселей, как я, нет смысла отрицать, что элементы дизайна должны быть целопиксельными, чтобы на вид быть четкими, как задумано
К сожалению, по мере того, как плотность пикселей доходит до 4х и выше, размытость, вызванная нецелочисленным масштабированием, становится гораздо менее уловимой, так что я прогнозирую, что производители устройств со временем будут все больше использовать этот подход. Мы можем только надеяться на то, что недостатки в производительности их сдержат!

Восприятие масштаба вашими глазами

Давайте на минуту отложим все эти плотности пикселей и рассмотрим вопрос: должна ли кнопка быть одного и того же физического размера на разных устройствах? Конечно, мы просто используем кнопку, как пример, но мы бы могли рассматривать и иконку, и текст, и панель инструментов. Должны ли эти элементы быть одного размера на всех устройствах? Ответ зависит:

От точности метода ввода (сенсор или курсор)
От физических размеров экрана
От расстояния до экрана

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

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

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

Более низкая плотность пикселей

Более крупные экраны, которые мы используем на расстоянии, обычно располагают меньшей пиксельной плотностью. Телевизор может иметь разрешение в 40 пикселей на дюйм! Для обычного телепросмотра это вполне допустимо. Экран retina в iPad имеет разрешение около 264ppi, а экран retina на iPhone – 326ppi. Так как пиксели на iPad больше (экран менее плотный), весь интерфейс становится немного больше. Это объясняется дополнительным расстоянием между глазами пользователя и экраном iPad.

Разные размеры

Но, время от времени, использования более низкой плотности пикселей недостаточно… отдельные элементы дизайна должны быть еще больше. Это случилось и с иконками на iPad. На iPhone они 60×60 пикселей, но более крупный экран iPad дает больше пространства, так что практичнее иконки размером 76×76.

Изменение размеров под разные устройства прибавляет работы дизайнерам. Это один из нескольких сценариев, когда устройства Apple требуют больше размеров, чем устройства Android! К счастью, это не совсем типичный случай для иконок приложений.

Санитарная проверка?

Мы только что обсудили массу сложностей, с которыми придется сталкиваться. К счастью, дизайн интерфейсов касается только использования единиц, не зависимых от плотности (как pt или dp). Все усложняется с иконками приложений, но есть шаблоны, которые в этом помогут. Вот список ресурсов по данной теме:

Важные ресурсы

Google Device Metrics : Впечатляющий список спецификаций для устройств всех типов (Android, iOS, Mac, Windows и т.д.). Узнайте размеры экрана, плотность пикселей и даже примерное расстояние, на котором экран расположен от глаз пользователя. ScreenSiz.es – похожий ресурс.

: Эти шаблоны дизайна (доступные для всех главных дизайн-редакторов) очень полезны, как в практическом смысле, так и для справок по последним спецификациям для Android, iOS, macOS, tvOS, watchOS, Windows, Windows Phone и т.д.

Руководство дизайнера по DPI и PPI : Подробное руководство Себастиана Габриеля, которое покрывает еще больше деталей и практических приемов для дизайнеров Android и iOS.

PPI это сокращение от английского «pixels per inch», буквально означает количество пикселей на дюйм. Естественно, чем больше это значение, тем выше плотность пикселей, сами пиксели при этом меньше по размеру, что в результате дает более четкую картинку на экране смартфона (и экране любого другого устройства – планшета, монитора, телевизора и так далее). При маленьких значениях PPI вы можете увидеть отдельные пиксели на экране, изображение будет зернистым, что не очень комфортно для глаз. Обычно телефоны с маленьким значением PPI - это бюджетные модели.

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

Посчитаем на примере iPhone 7, его разрешение составляется 1334 на 750 пикселей, а диагональ экрана 4.7 дюйма, то есть:

1334 в квадрате = 1779556;
750 в квадрате = 562500;
Сумма квадратов, 1779556 562500 = 2342056;
Извлекаем квадратный корень из 2342056 = 1530.378;
Делим полученное значение на 4.7 = 325.6123;
Округляем значение и получаем цифру 326. Это и есть PPI для iPhone 7.

Какое значение PPI должно быть в телефоне

Не стоит гнаться за самым большим значением PPI. На рынке есть модели смартфонов со значением PPI более 400, и даже с более чем 500. Но проблема в том, что человеческий глаз не видит разницы при повышении значения PPI более 300. Конечно, при желании, вы сможете рассмотреть пиксели вблизи, но при обычном использовании, на расстоянии 20-25 см от глаз, экран будет очень комфортным. К тому же, обработка очень высоких разрешений, накладывает свой отпечаток на время работы телефона.

При покупке компьютера часто бывает, что монитор выбирают по остаточному принципу – на какой хватит денег, оставшихся от покупки системного блока. Некоторый смысл в этом есть. На производительность компьютера характеристики монитора не влияют. Но следует понимать, что дешевый монитор низким максимальным разрешением, «смазанным» изображением и плохой цветопередачей может свести на нет преимущества топовой видеокарты. А мерцающая подсветка приведет к быстрой утомляемости и может отрицательно сказаться на зрении. Так что экономия на мониторе может «выйти боком», особенно, если компьютером предполагается пользоваться часто и помногу. Поэтому к выбору монитора лучше отнестись со всей ответственностью, подобрав его в соответствии с задачами.

Основное влияние на цену монитора оказывает его размер по диагонали. Но и среди мониторов одного размера цены могут различаться на порядок в зависимости от прочих характеристик. Следует понимать, что многие характеристики мониторов важны одним пользователям и совершенно неинтересны другим. Зная, какие характеристики требуются для выполнения конкретных задач, можно сделать правильный выбор, подобрав хороший монитор по оптимальной цене.

В зависимости от назначения принято выделять четыре группы от дешевых до дорогих моделей схожего размера: офисные, мультимедийные, игровые и профессиональные.

Офисные мониторы предназначены для работы с офисными программами. Требования к таким мониторам минимальны и направлены на то, чтобы снизить утомляемость при продолжительной работе: достаточная яркость, контрастность и качественная подсветка.

Для мультимедийных мониторов на первый план выходят характеристики, обеспечивающие эффектную «картинку». Хорошая цветопередача, большая диагональ, сверхширокий (Ultrawide) формат выделяют эти мониторы среди остальных.

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

Мониторы профессиональных дизайнеров, фотографов и художников должны обеспечивать максимальную глубину цвета и качественную цветопередачу. Желательны также большое максимальное разрешение, небольшой размер пикселя (это обеспечит четкость изображения) и расширенные настройки калибровки.

Характеристики мониторов.

Размер (диагональ) монитора является основной его характеристикой, в первую очередь определяющей его цену и привлекательность для пользователя. Измеряется размер по диагонали Чем шире монитор по соотношению сторон, тем меньше площадь видимой области при одной и той же диагонали.
Диагональ экрана варьируется от 18 дюймов до 55 и выше. В общем, чем диагональ больше, тем лучше: больше информации помещается на мониторе, выше эффект присутствия в играх и при просмотре видео.
К сожалению, с ростом диагонали цена растет в геометрической прогрессии. Поэтому в последнее время все большую популярность приобретают рабочие станции с двумя и более мониторами: многие современные видеокарты позволяют подключать несколько мониторов, что позволяет значительно увеличить площадь рабочего стола по минимальной цене.

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

Следует иметь в виду, что максимальное разрешение для каждого монитора является оптимальным – при этом разрешении каждый пиксель соответствует одному жидкокристаллическому элементу. Не стоит работать с монитором при разрешении, меньшем максимального – при этом либо уменьшится видимая область (образуется черная рамка), либо каждый пиксель будет состоять из нескольких ЖК-элементов, причем может оказаться, что одни пиксели станут больше других (изображение начнет заметно искажаться).

Максимальное разрешение должно соответствовать размеру монитора: если оно будет недостаточно, изображения будут зернистыми, если же разрешение будет слишком велико, текст и объекты станут слишком маленькими. Для определения, соответствует ли максимальное разрешение размеру, используется величина ppi - плотность пикселей . PPI (Pixels Per Inc – «пикселей на дюйм») равно количеству пикселей на дюйм монитора. Текст и объекты современных операционных систем настроены для мониторов с 96 ppi, поэтому, для сохранения четкости текста и мелких элементов желательно, чтобы ppi монитора было не менее 90-100. Если количество точек на дюйм у монитора будет намного меньше 90 (75 и меньше), изображения станут зернистыми. Для просмотра видео и некоторых игр это не так важно, а вот для работы такой монитор уже будет некомфортен.

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

Соотношение сторон (формат) подразумевает соотношение ширины экрана к высоте. Старые мониторы имели соотношение 5:4 и 4:3, такие есть в продаже и сейчас и обычно используются для офисных задач – с документами «бумажных» форматов на них работать удобнее всего. Современные мониторы в большинстве имеют соотношение сторон 16:9 (широкий формат). Такой формат наиболее оптимально покрывает поле зрения человека. Мониторы сверхширокого формата (21:9, Ultrawide рекомендуются для игр и просмотра видео. Хотя края экрана таких мониторов и выпадают из области внимания, они видны периферийным зрением, что увеличивает эффект присутствия. Однако на Ultrawide мониторах заметнее проявляются искажения цветов по краям экрана, особенно если монитор находится прямо перед лицом на небольшом расстоянии. Изогнутый экран позволяет уменьшить искажение цветов на краях, кроме того такой экран еще более усиливает эффект присутствия.

Технология и тип изготовления матрицы.
Матрицей называется основа монитора – пакет прозрачных пластин, между слоями которого расположены жидкие кристаллы. На сегодняшний день существует три типа ЖК-матриц:

1. TN (TN+film) –наиболее простая технология изготовления ЖК-матриц. Преимуществами - малое время отклика (самое малое среди современных матриц) и низкая себестоимость. Но недостатков тоже хватает: малый угол обзора, плохие контрастность и цветопередача. Высочайшая скорость отклика сделала матрицы TN популярными среди киберспортсменов, но для профессиональной работы с графикой и просмотра видео такие матрицы подоходят плохо.

2. IPS (SFT)/PLS избавлены от недостатков TN: они обеспечивают полный охват цветового пространства sRGB, а следовательно, и лучшую цветопередачу. Отличаются высокой контрастностью и хорошими углами обзора: до 180º. IPS чаще всего используются в профессиональных мониторах, но относительно недавно стали захватывать и недорогой сегмент, отвоевывая изрядный кусок рынка у TN.

Недостатками IPS являются относительно высокая цена, большое время отклика и характерный для этого типа глоу-эффект – свечение углов экрана, особенно заметное под углом и при темной картинке.
На текущий день IPS объединяет целое семейство технологий, незначительно отличающихся по характеристикам, Наиболее распространенными технологиями являются:
- AD-PLS – улучшенная матрица PLS (аналог IPS от компании Samsung). От обычного PLS отличается меньшим временем отклика;
- АH-IPS – лучшая цветопередача и яркость, пониженное энергопотребление;
- AHVA – технология компании AU Optronics, обеспечивающая высокий угол обзора
- E-IPS – повышенное светопропускание пикселя позволяет использовать менее мощные лампы подсветки, что снижает цену и уменьшает энергопотребление.
- IPS-ADS – увеличенный угол обзора и снижение искажений изображения за счет электрического поля, формируемого электродами по краям экрана.

3. VA по характеристикам и стоимости находятся между TN и IPS типами. Имеют неплохую цветопередачу, лучшую, чем у IPS, контрастность, средние углы обзора и время отклика.
Также существует несколько технологий производства матриц такого типа:
MVA(PVA) – улучшенная цветопередача, глубокий черный цвет.
AMVA, AMVA+ - дальнейшее развитие технологии MVA, с улучшенной цветопередачей и уменьшенным временем отклика.
WVA+ - развитие технологии MVA от компании HP, обеспечивающее широкий угол обзора – до 178º
Время отклика пикселя.
Из-за особенностей устройства ЖК-матриц, изменение цвета каждого пикселя при подаче на него управляющего сигнала происходит довольно медленно (по меркам электронных устройств) и измеряется миллисекундами. У первых ЖК-матриц время отклика доходило до сотен миллисекунд, для просмотра динамических сцен они не годились вообще, и даже за курсором мыши при движении оставался длинный след. У современных ЖК-матриц время отклика меньше, но при величине этого показателя больше 15 мс, изображение может «смазываться» при воспроизведении высокодинамичных сцен. Поэтому этот параметр важен для любителей динамичных игр и, особенно, киберспортсменов. Насколько важен?

Для примера можно рассмотреть случай, когда небольшой «предмет» пересекает весь экран за 0,1 сек. Допустим, частота воспроизведения кадров в игре – 30 FPS, тогда предмет получит 3 изображения за время пролета, каждое будет держаться на экране 33 мс. Если время отклика более 16 мс, то в течение некоторого времени на экране будет одновременно находиться два предмета (один - "исчезающий" - от предыдущего кадра, другой - "прорисовывающийся"). Так что для обычных игроков это может быть и неважно, но для киберспортсменов время отклика становится чуть ли не главной характеристикой монитора.

Яркость монитора, измеряемая в кд/м2, определяет световой поток, излучаемый полностью белым экраном при 100% яркости ламп подсветки. Этот показатель может оказаться важным, если монитор будет установлен в хорошо освещенном помещении, в помещении с большими панорамными окнами или на улице – в этом случае потребуется яркость побольше – от 300 кд/м2. В остальных случаях яркости в 200-300 кд/м2 будет достаточно.

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

Угол обзора
Из-за особенностей строения ЖК-матрицы, чистый цвет и максимальную яркость можно увидеть, только глядя на экран под углом 90º. Если смотреть на экран сбоку, яркость свечения пикселей падает. Что еще хуже, яркость свечения пикселей разного цвета падает неравномерно, поэтому при взгляде сбоку начинают искажаться цвета. Малый угол обзора изначально был одним из худших недостатков ЖК-экранов, поэтому производители мониторов постоянно вели (и ведут) разработки новых технологий, позволяющих увеличить углы обзора. На сегодняшний день им удалось добиться заметных результатов – углы обзора современных матриц доведены до максимально возможных.

Но не все так идеально – угол обзора, например, в 176º означает лишь, что внутри угла в 176º контрастность экрана не упадет ниже 1:10. Изменение контрастности все равно будет довольно заметно и может вызвать дискомфорт, даже если зритель находится внутри угла обзора. Более того, разные мониторы (с одинаковыми углами обзора) при взгляде сбоку могут качественно отличаться. Если условия использования монитора предполагают, что на него придется часто смотреть со стороны (например, монитор на стене, мультимедийный монитор, дополнительный монитор) то руководствоваться только заявленным углом обзора не стоит, поскольку угол обзора ничего не говорит о динамике изменения контрастности внутри этого угла. Этот показатель производителями не указывается, поэтому единственный способ его оценить – посмотреть на монитор «вживую».

Лучше всего при взгляде сбоку выглядят IPS-матрицы – заметные глазу изменения контрастности начинаются у большинства моделей только при отклонении от перпендикуляра градусов на 45-50, что дает 90-100º угла обзора без заметного снижения контрастности. Хуже всего – TN: несмотря на заявленные углы обзора более 170º, изменения контрастности иногда становятся заметны при отклонении от перпендикуляра уже на 20º.

Максимальная частота обновления
Частота обновления экрана показывает, с какой скоростью обновляется изображение на экране. Большинство современных мониторов имеет частоту обновления 60 Гц и этого вполне достаточно для комфортной работы. Существует устаревшее мнение, что этой частоты недостаточно. Пользователи ПК, заставшие ЭЛТ-мониторы, помнят, что с ними на 60 Гц работать было некомфортно – экран заметно мерцал. Но устройство ЖК-экранов принципиально отличается от устройства ЭЛТ-экранов. ЖК-экраны не мерцают при любой частоте обновления (точнее, бывает, что мерцают, но это никак не связано с частотой обновления). Инерционность человеческого зрения составляет в среднем 27,5 мс, минимум 20 мс, и для плавности движения на экране достаточно частоты обновления в 50 Гц. Некоторые игровые мониторы поддерживают частоту до 240 Гц, с утверждением, что это обеспечит максимальную плавность и деталировку движений. Чтобы это утверждение имело смысл, видеокарта должна не только поддерживать такую частоту, но и обеспечивать соответствующий FPS. Для высоких разрешений редкая видеокарта сможет выдать те же 240 FPS даже на старых играх..

Поддержка динамического обновления экрана может оказаться более полезной для сглаживания движений в играх. Суть динамического обновления состоит в том, чтобы «подогнать» частоту обновления экрана под FPS, обеспечиваемый видеокартой для того, чтобы избежать ситуации, когда момент обновления экрана попадет на момент вывода очередного кадра игры и на экране прорисуется только половина нового кадра. Хоть это изображение и продержится ничтожно малое время, эффект может быть заметен в сценах с резким изменением яркости. Технологии FreeSync от AMD и G-Sync от Nvidia предотвращают подобные ситуации. Отличия технологий для пользователя выражаются в минимальном поддерживаемом FPS: для G-Sync это 30 FPS, а для FreeSync - 9.

Покрытие экрана может быть глянцевым или матовым (антибликовым). В глянцевой поверхности, как в чистом стекле, отражаются источники света, а при ярком освещении комнаты – предметы вокруг монитора и сам оператор. Считается, что глянцевые экраны обеспечивают более насыщенные цвета, но работать с ними комфортно только при настроенном освещении. Матовые поверхности лишены таких недостатков – отражений предметов на них не видно и даже блики от ярких источников света сведены к минимуму.
Цветовой охват показывает, насколько полно монитор может отобразить все цвета из того или иного цветового пространства. Цветовое пространство sRGB – стандартное цветовое пространство, в котором работает большинство бытовых фото- и видеоустройств. Если монитор не обеспечивает полный охват пространства sRGB, на нем могут быть потеряны некоторые цвета, отображаемые на других устройствах – с полным охватом sRGB. Простой пользователь этого, скорее всего, не заметит, но дизайнерам и фотографам не следует выбирать такую модель.

Цветовое пространство Adobe RGB несколько шире стандартного за счет насыщенных оттенков голубого, зеленого и желтого. Большинство бытовых устройств не смогут воспроизвести эти дополнительные цвета, зато многие попадают в пространства CMYK и могут быть напечатаны. Поэтому мониторы с полным охватом Adobe RGB нужны профессиональным полиграфистам и тем фотографам, которые работают для печатных изданий.

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

Иногда условия использования монитора требуют от него возможности изменять его положение в широких пределах – поворачивать на подставке, поднимать-опускать и менять наклон. Можно приобрести отдельный кронштейн, а можно подобрать монитор с соответствующей подставкой – регулировкой по высоте, с наклоном и поворотом, с разворотом на 90º - портретным режимом, что удобно при работе с узкими и длинными страничными документами.

Если же возможности подставки недостаточно, и требуется крепить монитор к кронштейну, то большинство мониторов оборудовано креплением VESA , нужно только подобрать соответствующий кронштейну размер.

Немаловажными характеристиками мониторов являются наличие тех или иных разъемов. Это могут быть видеоразъемы :

- VGA (D-SUB, DB15) – устаревший разъем для передачи аналогового RGB-сигнала. На текущий момент поддержка стандарта VGA прекращена, на современных мониторах этот разъем устанавливается для совместимости со старыми видеокартами. Следует использовать в крайнем случае – при отсутствии возможности соединения по цифровому стандарту. Максимальное разрешение при подключении через этот разъем будет 2048x1536 пикселей при частоте 85 Hz.

- DVI (DVI-D) – более современный разъем, использующийся при передаче видеоинформации в цифровом виде. Максимальное разрешение, допустимое при подключении через этот разъем - 2560×1600 при частоте 60 Гц в режиме Dual link. Если разрешение монитора больше 1920×1080, то для подключения его через этот разъем, видеокарта должна быть оснащена разъемом DVI-D Dual link.

- HDMI – наиболее распространенный на сегодняшний день разъем для передачи цифровых видеоданных высокой четкости. Последняя редакция HDMI поддерживает разрешения до 10К на 120 Гц, при том, что серийно производящихся таких мониторов еще не существует.

- Displayport (mini Displayport) – аналог HDMI, разработанный специально для компьютерной техники. Последняя редакция поддерживает максимальное разрешение 8К (7680 × 4320) при частоте 60 Гц.

- Thunderbolt – интерфейс компании Apple. Thunderbolt версии 1 и 2 использует свой разъем (называемый так же - Thunderbolt), Thunderbolt версии 3 использует разъем USB Type-C . Thunderbolt версии 2 поддерживает разрешения до 4К (3840 × 2160), версия 3 – до 5К (5120 × 2880). Иногда встречается в технике и других брендов.

На мониторе могут быть и дополнительные разъемы:
- 3,5 jack для наушников : интерфейсы HDMI и Displayport допускают передачу звука, то наушники можно подключать не к компьютеру, а к монитору.

USB – некоторые производители встраивают в монитор USB-концентратор

Встроенная акустическая система может сэкономить место на столе и избавиться от лишних проводов – передача звука на неё также происходит по HDMI или Displayport. Подойдет для простой озвучки нетребовательным пользователям.

Варианты выбора мониторов

Начнем с самого бюджетного сегмента. Если вы неприхотливый пользователь, то купите самый недорогой 18-21” монитор , который вполне подойдет для работы с офисными программами.

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

Самый оптимальный вариант для дома, это 23-25 дюймовые модели с разрешением FullHD . Не слишком большой и не слишком маленький - наивысший баланс четкости и затрат.

Не требовательный к видеокарте ПК, как в случае 2К или 4К моделей, размер пикселя приемлемый. Изображение, шрифты и иконки не будут такими мелкими. Тип матрицы, дизайн, набор разъемов и прочее выбирайте в зависимости от личных предпочтений и кошелька. Если необходимо максимальное качество картинки, то это будет IPS, VA и другие типы матриц, отличные от TN. Сами TN несколько дешевле и чаще всего быстрее, т.е. лучше подойдут для динамичного контента и игр.

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

Дизайнер Питер Ноуэлл в своем блоге написал о плотности пикселей в дизайне мобильных приложений - объяснил, что это такое и рассказал о проблемах, с которыми сталкиваются дизайнеры, проектируя интерфейсы для разных устройств.

Редакция рубрики «Интерфейсы» публикует перевод материала, выполненный командой Sketchapp.

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

Плотность пикселей - это количество пикселей, вмещающееся в определенном физическом размере (обычно, в дюйме). На первом компьютере Mac было 72 пикселя на дюйм, - число кажется большим, но на самом деле это были огромные пиксели, под которые подходила не каждая графика.

Иконки на компьютере Macintosh 1984 года. Дизайнер Сьюзан Каре

С тех времен технологии экранов заметно продвинулись вперед, - сейчас даже самые простые дисплеи имеют разрешение между 115 и 160 пикселей на дюйм (PPI- pixel per inch). Но новая глава в этой истории началась в 2010 году, когда Apple представила iPhone с Retina-дисплеем - суперчетким экраном, удвоившим количество пикселей на дюйм. В результате графика стала четче, чем когда-либо.

Разница особенно хорошо заметна в иконке приложения почты и в тексте

Чтобы поддерживать те же физические размеры элементов пользовательского интерфейса, пришлось увеличить количество пикселей на дюйм. Кнопка, которая раньше занимала 44px, стала занимать 88px.

Для совместимости между разными устройствами дизайнеры должны выпускать графику для обычных дисплеев и для Retina-дисплеев. Но тут возникла еще одна проблема: теперь дизайнер не может сказать, что какой-то элемент должен быть, например, 44 пикселя в высоту, потому что на другом устройстве этот же элемент должен быть в два раза выше.

Решением стали пункты (points), или pt. Один пункт соответствует одному пикселю на экранах до поколения Retina и двум пикселям на экранах с Retina. Теперь, если дизайнеру говорят, что высота какого-либо элемента - 44 пикселя, он может адаптировать этот размер под любой коэффициент плотности пикселей - 1х, 2х или 3х в случае с iPhone 6 Plus.

PT и DP

Конечно, это все актуально не только для устройств Apple. Каждая операционная система - десктопная или мобильная - поддерживает экраны с высоким ppi/dpi. В Google придумали свою независимую от пикселей единицу измерения для Android, которая называется DIP - пиксель, не зависящий от плотности, сокращенно «dp». Это не эквивалент пунктам в iOS, но идея похожа. Это универсальные единицы измерения, которые можно конвертировать в пиксели с помощью масштабного множителя устройства (2x, 3x и так далее).

Возможно, вас интересует физический размер пункта. На самом деле, дизайнеры интерфейсов не должны об этом думать, так как у них нет контроля над аппаратными особенностями экранов разных устройств. Дизайнерам нужно знать, какие плотности пикселей принял производитель для своих устройств, и позаботиться о подготовке интерфейсов в 1x, 2x, 3x и так далее.

В устройствах Apple нет единой плотности пикселей, которая представляет один пункт - это зависит от конкретного устройства (см. «Восприятие масштаба» ниже). В iOS пункт варьируется от 132 точек на дюйм до 163 точек на дюйм. На Android DIP всегда равен 160 ppi.

Контролируемый хаос

На ранних порах развития мобильных устройств с высоким разрешением плотность пикселей была просто 1х или 2х. Но сейчас все иначе - есть масса пиксельных плотностей, которые должен поддерживать интерфейс. В Android есть отличный пример: на момент написания этого поста разные производители поддерживают шесть разных плотностей пикселей. Это означает, что иконка, которая имеет одинаковый размер на всех экранах, на самом деле должна быть выполнена в шести разных вариациях. Для Apple актуально два или три разных исходника.

Дизайн в векторе

Второй урок: мы должны все рисовать в масштабе 1х. Другими словами, создавайте дизайн, используя точки для всех измерений, затем масштабируйте в различные более крупные пиксельные плотности при экспорте. Масштабирование 2x-графики на 150% для создания версии в 3х провоцирует появление размытых контуров, поэтому это не лучший вариант. А вот масштабирование графики 1х в 200% и 300% позволяет сохранить четкость.

Разрешение макетов приложений для iPhone должно быть не 750×1334, а 375×667 - это как раз то разрешение, в котором приложение будет отображаться. Большинство инструментов дизайнера не отличают пункты от пикселей, так что можно считать, что пункты и есть пиксели, а затем просто экспортировать исходники в двукратном и трехкратном размерах.

Притворяйся, пока это не станет правдой

Стоит упомянуть, что иногда устройства лгут. Они делают вид, что их коэффициент преобразования пикселей в пункты, например, 3х, а на самом деле, он 2,61х, а сам исходник масштабируется в 3х для удобства. Так поступает, например, iPhone Plus. Он сжимает интерфейс, сделанный в 1242×2208 до разрешения экрана в 1080×1920.

Создавайте дизайн под iPhone Plus так, как если бы он был 3x. Телефон сам отмасштабирует его в 87%

Так как графика лишь немного уменьшается (87%), результат по-прежнему выглядит достойно - линия толщиной в 1px на экране почти в 3x выглядит все равно невероятно четкой. И есть шанс, что в будущем Apple представит настоящий 3x iPhone Plus, так как нужные аппаратные возможности вполне могут быть доступны для продукта, выпускаемого в таких огромных количествах.

Такое масштабирование нежелательно, так как все, что вы хотите сделать четким, станет размытым из-за интерполяции. К сожалению, по мере того, как плотность пикселей доходит до 4x и выше, размытость, вызванная нецелочисленным масштабированием, становится гораздо менее уловимой, так что я прогнозирую, что производители устройств со временем будут все больше использовать этот подход. Мы можем только надеяться на то, что недостатки в производительности их сдержат.

Восприятие масштаба

Должна ли кнопка быть одинакового размера на разных устройствах? Ответ зависит от

точности метода ввода (сенсор или курсор);
физических размеров экрана;
расстояния до экрана.

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

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

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

Низкая плотность пикселей

Крупные экраны, на которые мы смотрим на расстоянии, обычно располагают меньшей пиксельной плотностью. У телевизора может быть 40 пикселей на дюйм - и, как правило, этого хватает. Плотность пикселей Retina-дисплеев на iPad составляет около 264 ppi; на iPhone - 326 ppi. Так как пиксели на iPad больше (а плотность меньше), весь интерфейс становится немного больше. Это объясняется дополнительным расстоянием между глазами пользователя и экраном iPad.

Буквально везде можно услышать о DPI и PPI, какие они все такие важные и нужные, даже использовать нужно умудряться все и сразу. О, да, и в веб-дизайне обязательно, а иначе, ну, какой же ты веб-мастер?! Но что на самом деле означают спецификации размера и как веб-дизайнер может их использовать? Нужно ли вообще обращать внимание на это или достаточно только использовать настройки по умолчанию?

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

В этом материале мы поговорим о DPI и PPI более подробно и на примерах, чтобы разобраться, когда и в каких случаях веб-дизайнеру стоит обращать на них внимание. Сразу оговоримся, что статья может показаться «сухой» и скучной, но мы уверены, интересные моменты вы в ней найдете. Как ни странно, но значения PPI могут и не могут влиять на дизайн и на изображения , даже на сторонние файлы PSD и копируемые данные. А еще ведь существует PPI монитора. И представьте, что все это связано. В конце мы подведем итог и обобщим все умозаключения.

Пиксели и PPI

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

PPI является мерой качества изображений и используется в Photoshop по умолчанию. При работе с фотографиями можно изменить дискретизацию изображения или ресамплинг (изменить количество пикселей) или изменить размер изображения (размер каждого пикселя, но не их количество). В Photoshop в окне изменения размера необходимо следить за соотношением значений количества пикселей и ресамплингом (детализация и увеличение количества пикселей).

Веб-стандарт для изображений составляет 72 пикселя на дюйм. При таком значении изображения выглядят красиво, если они изначально имеют хорошее качество (не искажены, четкие). Имейте в виду, что ваша фотография всегда должна иметь полный размер и быть широкой, чтобы полностью заполнять рамки и границы размещения. Например, большое изображение в шапке страницы Facebook. Изображение должно обладать шириной 851 пикселей. Чтобы предотвратить пикселезацию при разрешении в 72 пикселя на дюйм ширина вашей готовой картинки должны быть почти на 12 дюймов шире.

Сравните разницу.

Удивительно, но на текст PPI тоже имеет свое влияние. Аналогично тому, как большое количество пикселей на дюйм делает фотографию более четкой, текст тоже становится удобочитаемым. Шрифты с высоким PPI легче воспринимать, они разборчивее, даже если буквы созданы маленьким размером. Иными словами, текст может четким и нечетким, точно также как и фотографии.

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

Одновременно с важностью PPI для интернета, для печати данные значения мало что могут сделать полезного. Для спецификаций печати более уместно использовать точки на дюйм или DPI.

Точки и DPI

Термин DPI или количество точек на дюйм был разработан для возможности работы с качеством изображения для печати. Когда фотография печатается, она состоит из сотен тысяч крошечных точек, которые накладываются друг на друга и рядом друг с другом разными по цветности чернилами. Также в этих точках происходит смешивание чернил, сформировывая тем самым больший спектр цветов и оттенков. Значение DPI - количество печатных точек на дюйм. Чем это значение выше, тем изображение выглядит плавнее и качественнее, а градиентные переходы становятся реалистичными.

Но в обыденности, зачастую, люди используют DPI для обозначения любого разрешения и путают с PPI. Если же вы работаете с проектом, непредназначенным для печати, то путаницы и проблем с DPI быть не должно. Если же создаете логотип, который будет использоваться и в печати (визитки, бланки и пр.) и на сайте, то необходимо создавать качественные изображения изначально. Создавайте копию изображения с высоким DPI, которое будет предназначаться исключительно для печати.

Когда же мы смотрим на экран, то маловероятно, что кто-то способен увидеть разницу между двумя одинаковыми изображениями, созданными в 100 DPI и 300 DPI. Причина в том, что мониторы не отображают графику в точках. Для них значения DPI не имеют никакого значения.

Для печати же стандартом принято считать значение 300 DPI. Это важно, чтобы сам принтер не смог изменять это значение в случае его отсутствия в свойствах рабочего файла. В противном случае, изображение будет искажено, даже цветовые оттенки могут измениться.

DPI также вступает в работу, чтобы преобразовать печатный элемент в цифровой формат. Чем выше значение, тем выше качество сканируемого документа. В целом, качественные фотографии имеют DPI 200 при реальном размере. Но всегда стоит попробовать сканировать и при высоких параметрах, тогда будет удобнее редактировать данные, увеличивать и распечатывать повторно.

Мегапиксели

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

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

Цифры в веб-дизайне

У пикселя нет размера, значения, смысла вне его представления в математике. Он только связующее звено между физическим размером экрана (дюймы), экранным разрешением (пиксель на дюйм) и пиксельным размером экрана (пиксели). Обычные десктопные экраны (не Retina) обычно имеют PPI от 72 до 120. Дизайн с PPI между 72 и 120 дает уверенность в том, что ваша работа будет иметь примерно одинаковые пропорции в размере.

Общая формула расчета и вычисления изменения размеров в зависимости от разрешения и размеров выглядит так:

Вот вам пример: экран монитора LG w2253tq 22 дюйма располагает PPI = 102, что означает, что он отображает 102 пикселя на дюйм экранной площади. Ширина самого экрана примерно 18,8 дюймов, так что 18,8*102 приблизительно 1920, что и формирует родное разрешение экрана в 1920х1080 рх.

Нашли удобный калькулятор PPI мониторов, думаем, пригодится вам.

Например, вы нарисовали синий квадрат размером 102х102px на экране с PPI 102.

Этот квадрат будет иметь физический размер 1х1 дюйм. Но если экран пользователя имеет PPI = 72, ваш синий квадрат будет крупнее по своим физическим размерам. Так как PPI = 72, понадобится примерно полтора дюйма (грубо округлили) экранного пространства, чтобы отобразить квадрат со стороной в 100 пикселей. По формуле выше это рассчитывается легко и быстро.

Именно поэтому веб-дизайн сайта каждый пользователь видит по-разному. Цель же веб-мастера - поиск лучшего компромисса, который будет удобен большинству, поскольку не все обладают тем экраном, что у вас.

Интересен еще один момент

Что будет, если менять значение PPI в Photoshop и создавать проекты под PPI 100 или 120. Дело в том, что цифровой контент изначально измеряется в пикселях вне зависимости от значения PPI. На дизайн PPI не имеет влияние, как таковое. Именно поэтому при необходимости увеличения изображений используются множители.

В Photoshop создаем новый документ и выбираем PPI 72. Создаем квадрат 102х102 пикселя и текст 14 пунктов.

Затем аналогично создаем квадрат и текст в документе с PPI 102.

Сравниваем, что получилось. Текст во втором случае (родном для монитора) стал крупнее, а квадрат остался тем же самым, он не изменился. Дело в том, что Photoshop автоматически масштабирует значение пунктов в соответствии с PPI документа. Вот и получилось увеличение размера текста при рендеринге.

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

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

Есть еще вариант, если у вас несколько разных PSD с разными настройками в файлах PPI . Что произойдет в Photoshop? Приложение автоматически настроит размеры элементов пропорционально вашему экрану и значениям PPI. То же самое будет, если вы работаете с макетом сайта в разрешении 72 PPI, а логотип вставляете из документа 100 PPI. Изображение будет изменено автоматически и это может вызвать проблемы.

Решение, впрочем, есть. Изначально работайте в общепринятом разрешении 72 PPI. Это настройка по умолчанию в Photoshop. Но если вам говорят клиенты или знакомые/друзья, что с макетом как-то не так всё, подумайте, а как они открывают его и какие у них настройки приложения.

Кроме того стоит помнить о векторных изображениях , которые хорошо масштабируются и предотвращают необходимость создания нескольких пиксельных картинок с разным PPI. Векторное автоматически будет изменяться в зависимости от множителя, монитора, разрешения и прочего. Но использование вектора имеет свои ограничения. Например, сложную графику не создашь: тени, градиенты и прочее. Вектор может быть очень тяжеловесным, а потому система пользователя может попросту «зависать» на тех сайтах, где приходится обработать много векторных данных.

Выводы

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

PPI играет важную роль в веб-дизайне, поскольку влияет на изображения и на соотношение элементов. С одной стороны, фотографии могут быть размытыми или четкими, с другой, размерность может изменяться, если она изначально не выражалась в пикселях. Если вы хотите, чтобы весь дизайн выглядел превосходно, то используйте только значения вашего родного монитора или значения по умолчанию. Пиксели не любят полумер. Не существует полпикселя или полтора пикселя. Есть один или два, поэтому точность важна, прежде всего. А добиться её можно только при работе с родными для вас параметрами.

Другой момент в том, что многие пользователи сами изменяют разрешение страницы сайта, чтобы было комфортнее читать/смотреть. Тут уже дизайн сайта может выглядеть удручающе плохо и неказисто. Но сделать навряд ли что-то можно, поскольку посетителям важно удобство. Поэтому помните, что разрешение файлов принято использовать в 72 PPI. Это сэкономит больше места на сервере. Файлы изображений будут небольшими и загружаться быстрее станут. И хотя они будут меньше оригинальных фотографий, в большинстве же случаев, на экране пользователей они будут больше, поскольку PPI мониторов у всех разный и преимущественно 100+ PPI.