Прямо в цель: задизайнили удобный интерфейс для тепловизора

Контекст и задача

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

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

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

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

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

Перед нами стояли такие задачи:

• спроектировать интерфейс, с которым пользователь взаимодействует через окуляр, а не плоский экран;

• выстроить навигацию под минимальное количество физических действий;

• учесть реальные сценарии использования — от настройки в тире до работы в поле;

• сделать UI современным, но без сложной графики и лишних визуальных акцентов.

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

Что определило дизайн интерфейса

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

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

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

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

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

Управление: кнопки и логика навигации

Мы выстраивали навигацию вокруг простых паттернов управления, которые поддерживают несколько ключевых сценариев. Основой навигации стал простой принцип:

🔄 вращение энкодера — перемещение по пунктам меню

▶️ нажатие — выбор действия

⏸️ удержание — возврат на уровень выше или выход

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

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

Структура меню и ключевые разделы

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

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

Вся структура делится на несколько ключевых блоков.

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

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

Настройки связи и ролей. Прицел может использоваться не только одним владельцем, но и, например, в аренде. Поэтому мы предусмотрели разные уровни доступа: владелец и гость. В этом же разделе находятся настройки сопряжения с внешними устройствами.

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

Иконки. Создали более 120 иконок, чтобы пользователи могли быстрее ориентироваться в интерфейсе.

Режим пристрелки: самый сложный сценарий

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

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

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

Мы выстраивали этот сценарий как процесс. Пользователь последовательно:

1. выбирает дистанцию;

2. стреляет;

3. видит две точки: куда целился и куда попал;

4. совмещает их с помощью управления;

5. сохраняет результат.

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

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

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

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

Итерации и адаптация под изменения устройства

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

Мы проектировали UI как систему, и это позволило:

• безболезненно масштабировать элементы под новые пропорции;

• сохранять логику навигации при изменении разрешения;

• дорабатывать отдельные экраны, не ломая всю структуру.

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

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

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

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

Мы работали с реальными условиями: маленький экран, оптические искажения, минимальное количество кнопок и высокая цена ошибки. Это потребовало другого подхода к UX — функционального и ориентированного на повторяемые действия.

В результате получился интерфейс, который:

• читается через окуляр и не перегружает изображение;

• использует единые паттерны управления во всех разделах;

• покрывает сложные сценарии, включая пристрелку и работу с баллистическими профилями;

• адаптируется под изменения параметров устройства;

• готов к дальнейшему развитию вместе с продуктом.

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