Редизайн панели управления фасовочным оборудованием

На старте проекта провели детальный анализ текущего интерфейса, обозначили проблемы и варианты решения. Дополнительно проанализировали доступные аналоги — платформы Siemens HMI и Rovema HMI. 

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

Презентация прошла отлично, заказчик остался доволен и одобрил первые варианты концепции. Мы продолжили работу.

Некоторые особенности разработки интерфейса для офлайн продуктов

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

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

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

Ограничения

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

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

Основные UX-проблемы старой версии интерфейса

В ходе детального исследования старой версии интерфейса выявили основные проблемы:

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

Разработка нового дизайна: как работали с главным экраном

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

 

 

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

UI Kit

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

Работа с промороликом

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

Наши ощущения от работы над офлайн-проектом

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

Сроки

Май 2021 — март 2022

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

Результат

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

Со своей стороны можем описать проект тремя словами: «Полезно, жизненно, безбарьерно». Это был интересный опыт, и мы надеемся, что Сигнал-Пак в будущем еще вернуться к нам с новыми задачами.