Обновленный дизайн информации об устройстве

Описание ситуации

Команда SmartPlayer обновила Ui и UX часть дизайна раздела «Информация» об устройстве. В этой статье будет описана информация о том какие данные предоставляет устройство с учетом обновленного дизайна.

Алгоритм действия

Первый шаг для пользователя - зарегистрироваться/авторизоваться в личном кабинете SmartPlayer.
Далее пользователю необходимо перейти в раздел «Устройства» и выбрать нужное устройство.

Пример отображения раздела «Устройства» и списка устройств

После клика по нужному устройству в правой части экрана откроется панель инструментов.

Пример отображения строки «Информация» в панели инструментов устройства

Пользователю необходимо кликнуть по строке «Информация» и перейти на страницу с описанием всей информации об устройстве.

Пример отображения страницы информации об устройстве с отображением нового дизайна

Страница «Информация» устройства

Обновленная страница «Информация» включает в себя следующие блоки:

1. Окно снятия скриншота.
2. Функциональные кнопки взаимодействия с устройством.
3. Информация о работе устройства.
4. Доступная информация об устройстве.

Пример отображения разделения на блоки нового дизайна страницы с информацией

Ниже будет подробнее описано о каждом блоке.

Окно снятия скриншота

Данный блок позволяет сделать скриншот проигрываемого контента в текущий момент времени. Оно состоит из двух элементов:

• окно снятия скриншота;
• кнопка снятия скриншота.

Пример отображения кнопки и окна предпросмотра скриншота

Функциональные кнопки взаимодействия с устройством

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

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

Пример отображения кнопок для взаимодействия с устройством

Информация о работе устройства

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

• температура;
• загрузка процессора;
• работа памяти;
• текущая дата и время (UTC +3);
• время старта приложения;
• часовой пояс;
• время работы приложения без выключения.

Пример отображения информации о работе устройства

Доступная информация об устройстве

Данный блок является самым большим и кнопок управления интерфейсом и пяти больших категорий:

• кнопка «развернуть все поля» — разворачивает все поля на странице;
• кнопка «Свернуть все поля» — сворачивает все поля развернутые на странице;
• кнопка «Копировать в буфер обмена» — копирует всю информацию из полей ниже (можно вставить в текстовый редактор);
• кнопка «Обновить все данные по устройству» — посылает запрос на сервер и обновляет все текущие данные об устройстве;
• категория «Устройство» — включает в себя данные об устройстве, которые отправляются в личный кабинет;
• категория «Лицензия» — включает в себя данные, связанные с лицензией устройства;
• категория «Соединение» — включает в себя информацию о работе устройства с сетью;
• категория «Внутреннее хранилище» — включает в себя информацию о внутреннем хранилище;
• категория «Параметры сборки» — включает в себя информацию связанную со сборкой клиентского приложения установленного на устройстве.

Пример отображения кнопок и категорий с данными об устройстве

Категория «Устройство»

Данная категория несет в себе следующую информацию:

• идентификатор (идентификатор устройства в базе данных);
• идентификатор устройства;
• версия клиента;
• название устройства;
• производитель;
• имя модели;
• серийный номер;
• платформа;
• наличие root доступа;
• версия прошивки;
• ориентация;
• разрешение по ширине;
• разрешение по высоте;
• дата последнего снимка (скриншота)
• последний снимок (ссылка на хранилище со скриншотом)
• громкость;
• идентификатор группы (идентификатор группы устройств в базе данных);
• идентификатор компании;
• последнее изменение;
• создан.

Пример отображения параметров категории «Устройство»

Категория «Лицензия»

Данная категория несет в себе следующую информацию:

• идентификатор лицензии;
• тип лицензии;
• дата покупки.

Пример отображения параметров категории «Лицензии»

Категория «Соединение»

Данная категория несет в себе следующую информацию:

• кнопка «Проверить соединение» (при нажатии добавляет дополнительные пункты в категорию, которые будут описаны ниже);
• IP адрес (уникальный идентификатор устройства в сети);
• DNS 1 (первый адрес DNS);
• MAC адрес (адрес в локальной сети);
• тип соединения (проводной Ethernet или беспроводной Wi-Fi);
• общая скорость между личным кабинетом, серверным и клиентским приложением. Измеряется в миллисекундах (мс). (отображается при нажатии на кнопку «Проверить соединение»);
• Скорость соединения между серверным приложением и клиентским приложением. Измеряется в миллисекундах (мс). (отображается при нажатии на кнопку «Проверить соединение»);
• Скорость соединения между серверным приложением и личным кабинетом. Измеряется в миллисекундах (мс). (отображается при нажатии на кнопку «Проверить соединение»).

Пример отображения параметров категории «Соединение»

Категория «Внутреннее хранилище»

Данная категория несет в себе следующую информацию:

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

Пример отображения параметров категории «Внутреннее хранилище»

Категория «Параметры сборки»

Данная категория несет в себе следующую информацию:

• тип дистрибутива;
• время сборки дистрибутива;
• хэш сборки дистрибутива (hash-сумма сборки дистрибутива).
• кнопка «Подробнее» (позволяет открыть дополнительные параметры связанные со сборкой дистрибутива)

Пример отображения параметров категории «Параметры сборки»

Видеоинструкция

Обновленный дизайн страницы «Информация» устройства

Дополнительная информация

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

Пример отображения вкладки "Обсуждения" на wiki-странице

Также дополнительную информацию можно узнать на странице Как взаимодействовать пользователю с разделом "Обсуждения"