После разработки корпоративного сайта, клиент обратился к нам с новой задачей – разработать удобный веб-интерфейс для их существующего продукта по автоматизации логистики.
Солво.ТОС — справочная система для управления терминалами (ж/д, сухопутный, морской либо многопрофильный комплекс), которая доступна из коробки: работает из облака или устанавливается на серверах клиента.
Система постоянно развивается, появляется новый функционал. Внешний вид и практичность интерфейса не успевали за разработкой и напоминал 1С-Бухгалтерию многолетней давности.
Solvo — один из лидеров российского рынка разработки программного обеспечения для автоматизации работы склада и порта. Компания существует более 20 лет и реализовала более 200 успешных внедрений.
Перед знакомством с системой мы в подробностях изучили документацию по работе текущей программы и наметили план работ по изменению и актуализации интерфейса. Был сформирован список первоначальных вопросов по продукту и отрасли в целом.
Чтобы не пропустить ни единой детали команда ARTW прошла обучение по работе с системой в офисе клиента и вживую познакомилась с Солво.ТОС. В процессе обучения была составлена структура проекта, создан список уникальных и подобных экранов для проведения работ по дизайну.
После обучения команда посетила терминалы (КТСП, МПК ЮГ2, УЛКТ ) и проанализировала работу реальных пользователей с системой. Мы провели интервью и аналитику контекста, сравнили различные роли пользователей, продемонстрировали бизнес-процессы различных предприятий. В итоге комплексной аналитики мы смогли составить четкую картину о том, насколько гибкой должна быть система и сколько разнообразных настроек требуется конечным пользователям.
Собраны входные и выходные данные: какие процессы происходят в системе, что отображается на экране у пользователя, что он делает вне программы.
Выстроен процесс обработки судозахода: как судно прибывает, на какой стадии подключается программа, какие роли пользователей участвуют в процессе, как распределены зоны ответственности.
Сформированы наиболее оптимальные и типичные пользовательские сценарии, по которым будет проходить проектирование и дальнейшее тестирование интерфейса.
Разработка проходила в несколько итераций. Вначале разрабатывался сценарий, затем собирался прототип. Он тестировался, правился, вносились изменения в текущие бизнес-процессы как с нашей стороны (оптимизация и добавление нового функционала, которого не было в системе, но компания могла его реализовать), так и со стороны клиента. После создания и согласования прототипа мы перешли к дизайну.
Мы разработали экран входа в систему. Он представляет собой двухэтапную авторизацию с возможностью восстановления пароля. У сервиса есть возможность работать из облака, поэтому система доступна как для сотрудников терминалов, так и для их контрагентов (владельцев судов и экспедиторов), которые могут самостоятельно входить в систему под своим логином-паролем и заносить информацию о прибытии каждого определенного суда к терминалу.
При работе пользователи создавали себе определенный набор часто используемых вкладок в системе, однако она не сохраняла их по завершению рабочего дня. Каждый день сотрудникам приходилось проходить один и тот же процесс по открытию вкладок, тем самым замедляя работу.
Мы реализовали возможность создания и сохранения набора вкладок для будущего использования. Более того, пользователи могут сохранить несколько разных наборов вкладок. Это удобно, если человек выполняет несколько ролей, как одновременно за 1 смену, так и поочередно, – сегодня работая в сервисном центре, а завтра будучи диспетчером. Войдя в систему пользователь легко может открыть необходимый набор разделов в виде виджетов и продолжить работу.
Изначально работа с визитами проводилась мануально: приходил e-mail на терминал, сотрудник заводил все данные в систему, приезд судна подтверждался звонком, после утверждался план для выхода человека на смену в зависимости от загруженности. Мы предложили уменьшить человеческий фактор и автоматизировать процесс визитов: клиент терминала будет сам заносить данные в систему.
Был разработан интерфейс создания и обработки автовизита: когда транспортное средство заезжает на терминал, забирает или привозит контейнеры и уезжает обратно пустым или с грузом. Например, 1 тягач не может забрать 50 контейнеров. Он может забрать максимум 4 контейнера по 20 футов. ТЕУ (единица измерения контейнеров).
У каждого бизнес-процесса есть свои ограничения: с человеческой, транспортной и инструментальной стороны. Все эти факторы учитывались при разработке сценариев и интерфейса.
Табличный вид проектировали на примере судозаходов и коносаментов, но реализованные решения затем ложились на все таблицы системы.
В предыдущем интерфейсе на экран было выведено сразу 3 таблицы, каждая со своим набором действий. При среднем размере экрана пользователей 1280×1024, процент полезных данных на экране был крайне мал.
Мы выяснили, что каждая нижняя таблица зависит от предыдущей верхней (например, внутрь коносамента вложены контейнеры). Тем не менее, в момент работы с контейнерами, по коносаментам пользователям нужен только определенный набор данных, а не целая таблица.
Поэтому мы создали решение, которое позволяет проваливаться из одной таблицы в другую, а нужные данные выводить в верхней строке. При такой работе сразу возникает понимание, с каким коносаментом происходит работа и где находится вся детальная информация. При это мы в полной мере можем работать с вложенной таблицей. А затем, сделать из нее переход ниже и работать уже на третьем уровне таблицы.
В любой момент пользователь может вернуться на предыдущую таблицу, либо изменить коносамент с которым сейчас работает.
Первоначально система использовала свой набор фильтров, к которому пользователи привыкли. Часто требовалось фильтровать информацию сразу по нескольким параметрам, однако выборка по фильтрации происходила только по одной колонке за раз.
Мы оставили все привычные пользователям значения, доработали систему фильтрации и предложили 2 решения.
Значения фильтров прописываются прямо в строке, которая помогает и подставляет ответы постоянными всплывающими подсказками. Например, по запросу «дата» система предлагает различные варианты: «дата начала», «дата окончания» и т.д. Затем, пользователь выбирает нужный вариант и система автоматически предлагает логику фильтрации (больше, меньше, равно или неравно).
Значения фильтров прописываются прямо в строке, которая помогает и подставляет ответы постоянными всплывающими подсказками. Например, по запросу «дата» система предлагает различные варианты: «дата начала», «дата окончания» и т.д. Затем, пользователь выбирает нужный вариант и система автоматически предлагает логику фильтрации (больше, меньше, равно или неравно).
В системе существуют разные роли пользователей. Из основных можно выделить тех, кто работает с оперативными данными и тех, кто работает с документами. Проблема предыдущей системы заключалась в том, что эти данные были представлены в виде таблиц или сухого текста. Их сложно было считывать визуально. Требовалось разработать единую визуально привлекательную карточку данных для всех ролей одновременно с одним ограничением – каждый пользователь должен видеть только свой набор данных.
Мы разработали несколько видов виджетов, используя визуализацию данных для более комфортного и быстрого считывания и выполнения команд. Из этих виджетов администратор может собрать индивидуальный набор данных для каждой роли.
Например, пользователю важно понимать какие работы и когда должны производиться, есть ли отставание по срокам. Когда груз обрабатывается, он должен видеть, что запланировано, что в итоге пришло и что обработано в текущий момент.
«Мы разработали дизайн и передали его клиенту. Разрабатываем не мы, потому что не работаем с теми технологиями, которые подходят клиенту. На пресейле мы посчитали, что нарисовать весь дизайн со всеми вариантами отображения всех состояний элементов либо сверстать готовый вариант на html-шаблонах — это примерно одно и то же по трудозатратам и времени. Но результат в виде html-шаблонов клиенту не был нужен, потому что клиент использует технологию (шаблонизатор) jsf: верстку на java с фреймворком primefaces.
Создали интерактивный прототип с изображениями для invision. Интерактив сделан с помощью события и подмены изображений: мы отрисовали по несколько состояний и при клике или наведении показывалась картинка с этим состоянием. Это удобно на этапе тестирования, когда ты полностью прогоняешь весь процесс».
Во время проекта постоянно проводилось тестирование. Было разработано несколько вариаций со сценариями работы, с помощью сервиса invision небольшие цепочки действий можно было протестировать уже на этапе дизайна. После тестирования группой человек и получения фидбека мы выбрали лучший вариант, который не конфликтовал с системой и был удобен для пользователей. Система представляет собой удобный набор справочников и таблиц.
В них подтягиваются все контрагенты, вся текущая составляющая по операционной деятельности (история судозаходов, автотранспорта, ж/д транспорта, текущее состояние работы оборудования на терминале). Система автоматизирует некоторые бизнес-процессы и уберегает пользователей с разным уровнем доступа от совершения ошибок в работе. Работа с данными ведется в разработанном нами веб-интерфейсе, что значительно сокращает время, необходимое для обработки и ввода информации.
«Компания ARTW является нашим хорошим давним партнером. После запуска проекта по обновлению корпоративного сайта компании «СОЛВО», мы заказали в ARTW проект по проектированию новых пользовательских интерфейсов системы управления контейнерными и грузовыми терминалами SOLVO.TOS.
Благодаря профессиональному подходу к ведению проектов, а также квалифицированному персоналу исполнителя, нам удалось выполнить этот проект в кратчайшие сроки. Командой ARTW были проанализирован текущий пользовательский интерфейс решения, выявлены его недостатки и особенности. В рамках проекта была предложена новая концепция построения пользовательского интерфейса, спроектированы и отрисованы в цвете удобные, современные, эстетичные интерфейсы, разработаны гайдлайны. Проведен их анализ на тестовых сценариях. В настоящее время мы ведем работу по переводу программного продукта на новые интерфейсы.
Благодарю компанию ARTW за проделанную работу и желаю всей команде ARTW успехов в работе! Уверен, что в будущем нас ждут новые и интересные совместные проекты».
Оставьте заявку и наш менеджер свяжется с вами для уточнения подробностей.
Координационный
совет
SPECIA
Санкт-Петербург,
8-я Красноармейская ул., д.10
Посещая данный сайт, вы понимаете и соглашаетесь с тем, что ваши персональные данные обрабатываются на сайте с целью его функционирования и предоставления вам имеющихся на нём сервисов. В случае несогласия с обработкой ваших персональных данных на сайте вам следует незамедлительно покинуть его