Шрифтовое оформление

Typography example in HoloLens

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

Когда мы говорим о типе в трехмерном формате, мы, как правило, думаем, экструдированный объемный трехмерный текст. За исключением некоторых конструкций логотипов и нескольких других ограниченных приложений, экструдированный текст, как правило, снижает удобочитаемость текста. Несмотря на то, что мы разрабатываем интерфейсы для трехмерного типа, мы используем 2D для типа, так как это более разборчиво и проще читать.

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

Типография в смешанной реальности

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

Создание четкой иерархии

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

Type ramp examples
Определите типы и следуйте инструкциям на протяжении всего процесса приложения.

Ограничение шрифтов

Избегайте использования нескольких разных семейств шрифтов в одном контексте. Слишком много шрифтов нарушает гармонию и согласованность вашего опыта и затрудняет использование информации. В HoloLens, так как информация накладывается на физическую среду, использование слишком большого количества стилей шрифтов приведет к снижению производительности. Segoe UI — это шрифт для всех цифровых макетов Майкрософт. Он используется последовательно в оболочке Windows Mixed Reality. Файл шрифта Segoe UI можно скачать на странице набора средств разработки Windows.

Дополнительные сведения о шрифте Segoe UI

Избегайте толщины тонких шрифтов

Избегайте использования светлого или полусветного шрифта для размеров типов менее 42 пт, так как тонкие вертикальные росчерки будут вибрировать и снизить удобочитаемость. Современные шрифты с достаточной толщиной росчерка хорошо работают. Например, Helvetica и Arial являются разборчивыми в HoloLens с использованием обычных или полужирных весов.

Color

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


We recommend using white text on a dark or colored back plate.Примеры белого текста на темной или цветной задней пластине.

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

Examples of white on black and black on white text
Примеры белого на черном и черном белом тексте

Examples of black text in the system apps - Store and Settings
Примеры черного текста в системных приложениях — Магазин и Параметры



Как можно ожидать, размеры типов, которые мы используем на пк или планшетном устройстве (обычно от 12 до 32 пт), выглядят небольшими на расстоянии 2 метра. Это зависит от характеристик каждого шрифта, но в целом рекомендуемый минимальный угол просмотра и высота шрифта для удобочитаемости составляет около 0,35°-0,4°/12,21-13,97 мм на основе наших исследований пользователей. Это около 35–40 пт с коэффициентом масштабирования, представленным на странице "Текст" на странице Unity .

Для близкого взаимодействия в 0,45 м(45 см) минимальный угол просмотра читаемого шрифта и высота составляет 0,4°-0,5° / 3,14–3,9 мм. Это около 9–12 пт с коэффициентом масштабирования, представленным в Text в Unity.

Near and far interaction rangeСодержимое в ближайшем и дальнем диапазоне взаимодействия

Минимальный размер читаемого шрифта

Расстояние Угол просмотра Высота текста Размер шрифта**
45 см (расстояние прямой манипуляции) 0.4°-0.5° 3.14–3.9mm 8.9–11.13pt
2 м 0.35°-0.4° 12.21–13.97mm 34.63-39.58 пт

Удобный размер шрифта для разборчивого текста

Расстояние Угол просмотра Высота текста Размер шрифта**
45 см (расстояние прямой манипуляции) 0.65°-0.8° 5.1-6.3 мм 14.47-17.8 пт
2 м 0.6°-0.75° 20.9-26.2 мм 59.4-74.2 pt

Пользовательский интерфейс Segoe (шрифт по умолчанию для Windows) хорошо работает в большинстве случаев. Избегайте использования легких или полулегких семейств шрифтов небольшого размера, так как тонкие вертикальные росчерки будут вибрировать, и это снизит удобочитаемость. Современные шрифты с достаточной толщиной росчерка хорошо работают. Например, Helvetica и Arial выглядят великолепно и являются разборчивыми в HoloLens с регулярными или смелыми весами.

Дополнительные сведения о вычислении размера текста в Unity см. в разделе "Текст" в Unity

Viewing AngleРасстояние просмотра, угол и высота текста



Ресурсы

Шрифты Segoe

(ZIP-файл)

шрифт HoloLens

(ZIP-файл)

Изображение. Шрифт HoloLens предоставляет глифы символов, используемые в Windows Mixed Reality.

The HoloLens font gives you the symbol glyphs used in Windows Mixed Reality



См. также