Что значит «вариативный»? Объясняем простыми словами

Термин «вариативный» встречается и в дизайне, и в айти. Он означает одно и то же? Или в каждой области подразумевается своё значение?

Простыми словами объясняют, что такое «вариативный», эксперт в шрифтовом дизайне Родион Илюхин и эксперт в разработке Зуфар Сунагатов.

Родион Илюхин

Дизайнер интерфейсов днём, шрифтовой дизайнер вечером и по выходным. Убеждён, что шрифт — ДНК проекта.

Что такое вариативность?

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

Вариативный шрифт — это шрифтовой файл, содержащий несколько начертаний. Перед набором статичных шрифтов у вариативного есть несколько преимуществ:

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

Как работает вариативный шрифт

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

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

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

История формата

Несмотря на то что вариативные шрифты появились относительно недавно, концепцию «много начертаний — один файл» ещё в 1991 году представила компания Adobe под названием Multiple Master. Но концепция так и не стала востребованной из-за сложности работы: пользователю предлагалось настроить необходимое начертание в отдельной программе Adobe Type Manager, выгрузить статичный файл и установить его в систему.

В 1997 году Adobe и Microsoft представили формат OpenType с расширенным знаковым составом — их количество выросло с 256 до 65 000. Это позволило одному шрифтовому файлу содержать множество альтернативных глифов: минускульные цифры, капители, дроби, росчерки, символы верхнего и нижнего индекса, заглавные буквы, контекстуальные и стилистические альтернативы, а также полный набор лигатур.

Спустя 19 лет, в 2016 году, на шрифтовой конференции AtypI была представлена новая версия формата — OpenType Font Variables, которой мы сейчас и пользуемся. По сути, это и был тот же самый Multiple Master, только встроенный в редакторы и браузеры, без необходимости генерировать выбранное начертание. В 2021 году добавили поддержку цвета в шрифтах.

Буквально на днях представили спецификацию AVAR2, которая добавляет очень важные фичи:

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

• Сокращение количества мастеров — это облегчает создание развитых семейств со множеством начертаний.
• Критичное сокращение размеров шрифта (около 80%).
• Нелинейную интерполяцию.

Как используют вариативные шрифты

Полезные ресурсы для дизайнера

• Variable Fonts — каталог всех существующих вариативных шрифтов.
• TypeTrials — инструмент проверки вариативных шрифтов.
• vartype beta — песочница для проверки и анимации.

Зуфар Сунагатов

Ведущий бэкенд-разработчик проекта Lloyd’s of London.

Ведёт телеграм-канал для айтишников, проводит менторинг-сессии со всеми желающими на ADPList, пишет айтишные статьи.

Вариативность — это прекрасно.

В общем смысле слова «вариативный», «вариативность» подразумевают наличие нескольких или многих вариантов чего-либо — различного поведения или разных результатов при выполнении определённых действий.

Вариативность в разработке — ещё лучше

В разработке вариативными могут быть множество вещей.

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

Для практики давайте представим ситуацию. Вы сидите с друзьями в ресторане, и у вас есть такая традиция: раз в месяц кто-то из вашей компании оплачивает весь чек. Но вот незадача: как честно определить того, кто платит на этот раз? Тянуть соломинку? Слишком старомодно!

Мы напишем программу, функцию chooseLuckyOne (*names), на языке Python*,* которая принимает на вход произвольное количество имён друзей на встрече, а возвращает произвольное имя того, кто и оплатит весь чек.

Так, в прошлом месяце вы собрались втроём.

А в этом месяце вас уже четверо.

И так вышло, что оба раза выпала Оля 😁

Прости, Оль, это всё ради примера 🙃

Усвоили? Отлично!

Давайте теперь разберём пример вариативности посложнее.

Вариативность в веб-разработке

Представьте, что вам нужно разработать веб-сайт, причём вы хотите, чтобы он работал и выглядел одинаково во всех браузерах. То есть он должен быть адаптирован ко всем вариантам веб-браузеров Safari, Google Chrome, Mozilla Firefox, Internet Explorer. В каждом есть уникальные особенности, и это может привести к тому, что некоторые элементы веб-страниц будут отображаться по-разному.

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

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

Читайте также:

Что значит «адаптивный»? Объясняем простыми словами

Вариантность типов данных

Пример с браузерами был довольно простым?

Давайте победим финального босса 😁

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

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

Кстати, а вы любите фрукты? Надеюсь, что да, так как дальше они помогут нам разобраться с вариантностью.

Рассмотрим следующую иерархию типов:

Здесь Fruit (Фрукт) является базовым типом данных, а Apple (Яблоко) и Orange (Апельсин) наследуются от него.

В коде на языке Java эта иерархия будет выглядеть именно так:

На основе этой иерархии типов данных рассмотрим три типа вариантности: ковариантность, контравариантность и инвариантность.

Ковариантность

Ковариантность — это свойство типов данных, которое сохраняет иерархию наследования исходных типов в производных типах в том же порядке.

Так, если тип данных Apple (Яблоко) и Orange (Апельсин) наследуются от типа данных Fruit (Фрукт), тогда благодаря свойству ковариантности коллекция с типом данных Apple и коллекция с типом данных Orange будут потомками коллекции с типом данных Fruit. То есть, например, «список из пяти яблок или апельсинов» — это частный случай «списка из пяти фруктов».

В коде это будет выглядеть так:

В таком случае говорят, что тип (в данном случае обобщённый интерфейс) Collесtion<T> ковариантен своему параметру-типу T.

Некоторые преимущества ковариантности:

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

Контравариантность

Контравариантность — это противоположное ковариантности свойство типов данных, которое обращает иерархию наследования исходных типов данных на противоположную в производных типах, если производный тип ведёт себя как общий.

Так, если типы данных Apple (Яблоко) и Orange (Апельсин) наследуются от типа данных Fruit (Фрукт), тогда благодаря свойству контравариантности мы можем добавлять обьекты типа данных Apple (Яблоко) и Orange (Апельсин) в коллекцию с типом данных Fruit (Фрукт). Таким образом, мы можем использовать коллекцию с более общим типом данных вместо коллекции с более специфичным типом данных.

В коде это будет выглядеть так:

Некоторые преимущества контравариантности:

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

Инвариантность

Инвариантность — это случай, когда у типов данных отсутствуют свойства как ковариативности, так и контравариативности.

Так, несмотря на то что тип данных Apple (Яблоко) и Orange (Апельсин) наследуются от типа данных Fruit (Фрукт), коллекция с типом данных Apple и коллекция с типом данных Orange не будут подтипом коллекции с типом данных Fruit.

В коде это будет выглядеть так:

Некоторые преимущества инвариантности:

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

Что в итоге?

Вариативность в разработке может быть, как ни странно, вариативной, местами сложной и довольно запутанной. Но это точно полезная особенность, которая даёт программисту больше возможностей делать работу хорошо, а плохо не делать. Главное — использовать её с умом!

Удачи вам в изучении мира айти и разработки в частности 🤝