← Назад к статьям

Дизайн будущего — новый современный интерфейс Xeoma

С самого своего создания программа для видеонаблюдения Xeoma была инновационным решением, использующим самые современные технологии и собственные изобретения, зачастую опережающие своё время. Продолжая эту политику, в середине 2024 года в Xeoma начаты изменения дизайна программы и приложения, с целью повышения удобства пользования, реализации различных оптимизаций и, конечно, улучшения эстетики в соответствии не только с тенденциями настоящего, но и с концепциями будущего. «Интерфейс будущего» — так мы любим называть новый дизайн Xeoma. Приглашаем вас в путешествие, где мы расскажем и покажем, что и как было улучшено в новой Xeoma!

 

Запуск Xeoma, в том числе первый запуск

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

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

Также уже сразу видно новую иконку и новое расположение Главного меню программы — более эргономичное положение посередине экрана позволит пользователям быстро навести курсор с любой стороны экрана:

 

 

В большинстве случаев при запуске вы также можете успеть увидеть Диалог подключения Xeoma — например, с сообщением о том, что в данный момент происходит запуск серверной части Xeoma. В нём вы можете рассмотреть те новые элементы, которые ждут вас в новой Xeoma и в других диалогах. Так, вас ждёт новый вид редактируемых полей (подробнее рассмотрим ниже), новые переключатели по типу переключателей в мобильных интерфейсах (которые заменили устаревший элемент «пустая ячейка»/»ячейка с галочкой») и новые кнопки для управления диалогом (в данном случае — для закрытия диалога без сохранения изменений слева и для закрытия диалога с сохранением изменений справа, но в зависимости от характера диалога кнопки могут меняться, смотрите, например, здесь).

 

Интерфейс Главного окна

В новом интерфейса Xeoma при добавлении камера вписывается в ячейку так, чтобы не было чёрных полос по бокам. Поскольку Xeoma работает с различными камерами, они могут иметь различное соотношение сторон, что вкупе со свободным изменение размеров окна самой Xeoma на ваше усмотрение неизбежно ведёт к тому, что у каких-то камер появляются чёрные полосы по бокам, чтобы их полностью расположить в ячейке. Это позволяет не обрезать ни миллиметра с картинки камеры, но, несомненно, «съедает» полезное пространство: часть экрана занимают чёрные регулировочные полосы, а ведь можно было использовать это место под камеры! Теперь по умолчанию изображение с камеры «вписывается» в отведённую ей ячейку-слот, что значит 100% использование экрана под сами камеры:

 

Однако если при таком подходе теряется важная часть изображения с камер, режим вписывания можно отменить для нескольких или всех камер в меню «Режимы просмотра» (иконка «Окна» в нижней панели) -> Управление просмотром -> Растягивание. В таком случае изображение с камер будет показано полностью, без обрезания, но могут появиться регулировочные чёрные полосы сверху и снизу изображения:

 

Также обратите внимание, что при «состоянии покоя», то есть когда вы не двигаете мышкой и не нажимаете на экран, элементы управления в нижней панели и в ячейках камер не показываются. Чтобы они снова появились, достаточно произвести любое действие: подвигать мышкой, нажать на какую-либо клавишу, нажать на экран. Особенностью новых иконок станет не только их лаконичность и единый стиль, но и то, что иконки теперь масштабируются без потери качества. Это значит, что при увеличении масштаба интерфейса даже в несколько раз иконки будут так же чётко прорисованы.

 

Мы уже упоминали ранее, что теперь меню находится посередине экрана. Но это касается не только меню — в том числе и Главного меню на Главной странице интерфейса Xeoma — но и всего ряда иконок нижней панели, а также вызываемых по их нажатию диалогов с опциями. Также интересно будет отметить, что нижняя панель за ненадобностью лишилась заливки, границы и ярлычка, за который её можно было тянуть, чтобы скрыть или показать — теперь скрытие панели происходит автоматически при бездействии в течение нескольких секунд! Благодаря точечному затемнению иконки не теряются на фоне даже самых светлых камер, «паря» над изображением, постепенно растворяясь при бездействии.

 

Быстрые настройки

Помимо выше упомянутых изменений, главным нововведением «Быстрых настроек» стало, пожалуй, то, что для камер, поддерживающих PTZ управление, теперь запоминается ваш выбор — показывать или не показывать виртуальный джойстик. Для разных камер выбор может быть разным — Xeoma запомнит, для каких камер вы хотите иметь контрол управления под рукой, а для каких — нет.
Как и раньше, в контроле будут показываться только те опции, которые поддерживает камера и ваша лицензия Xeoma (подробнее об элементах контрола здесь).

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

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

 

Управление поворотными камерами в новых версиях программы для видеонаблюдения Xeoma осуществляется всё так же, через виртуальный джойстик, который называется «PTZ контрол». На изображении ниже мы рассказываем, какие функции скрываются за новыми пиктограммами в PTZ контроле:

 

Детальные настройки

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

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

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

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

 

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

 

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

Модули в цепочке и в верхней панели подсвечиваются синим при наведении на них курсора, и становится видно контур модуля:

 

Диалог настройки модуля

Самым значимым достижением изменения диалога настройки модуля стала, на наш взгляд, возможность задавать модулю произвольное имя, которое будет показываться в цепочке. Для того, чтобы изменить название какого-либо модуля, зайдите в Диалог настройки модуля и нажмите на текущее название модуля. Название модуля окажется в редактируемом поле, где вы можете внести изменения. После завершения редактирования нажмите в любом месте внутри диалога, а потом не забудьте нажать на кнопку ОК («галочку») в самом низу окна, чтобы изменения применились.

Также стоит отметить переработку элементов настройки в диалоге и новые иконки внизу окна.
 

Отдельно хотелось бы рассмотреть новые состояния модуля — это особенно актуально для модулей-фильтров, у которых в Xeoma может быть не два, а три состояния: «Включено», «Пропускает» и «Включить». Как мы упоминали ранее, ячейки в новой Xeoma заменены на переключатель, который обычно имеет два положения — включено и выключено, — но в модулях-фильтрах переключатель трёхпозиционный, то есть помимо крайнего левого и крайнего правого положения, имеет также положение посередине, соответствующее состоянию «Пропускает».

Положение крайнее правое — «Включено»:

Положение среднее — «Пропускает»:

Положение крайнее левое — «Включить» (модуль выключен):

 

Редактируемые и нередактируемые поля

Отдельно хотим коснуться новых редактируемых и нередактируемых (информационных) полей, к которым применяется интересное цветовое решение.

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

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

Смотрите пример трёх состояний редактируемого поля и пример нередактируемого поля на изображении ниже:

 

Проигрыватель архива
Новый дизайн встроенного проигрывателя записей Xeoma также направлен на упрощение и осовременивание интерфейса.

Попав в окно Просмотрщика архива, вы прежде всего увидите, что панель с временной шкалой стала компактнее — теперь она занимает одну линию. Кнопка старта и паузы воспроизведения «переехала» влево, в иконка меню — вправо. Бегунки масштаба шкалы и скорости воспроизведения разворачиваются при наведении курсора, а в остальное время представлены в сжатом виде. Как и другие панели в новом дизайне Xeoma, нижняя панель в этом окне также постепенно «растворяется» при отсутствии действий со стороны пользователя.

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

 

 

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

 

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

 

Меню Просмотрщика архивных записей теперь открывается справа:

 

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

Выводы

«Интерфейс будущего» в новых версиях программы для видеонаблюдения Xeoma выполняет несколько функций:

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

Эти изменения интерфейса доступны в версиях Xeoma, начиная с бета-версии Xeoma 24.11.13.

Новый дизайн Xeoma доступен под все поддерживаемые операционные системы (включая Android — пока только на официальном сайте) за исключением приложения для iPhone.

Новый дизайн Xeoma стремится доказать, что видеонаблюдение может быть также и приятным глазу!

Если вы ищете программу для видеонаблюдения Xeoma, которая будет современной не только в плане функций, но и по своей визуальной составляющей, попробуйте Xeoma!

19 ноября 2024

Читайте также:
Полное руководство пользователя Xeoma
Статьи-инструкции: узнайте больше о настройке нужной функции в программе для видеонаблюдения Xeoma
Страница загрузки программы и приложения Xeoma