Внедрение веб-клиента – взгляд изнутри программиста 1С со стороны заказчика

Меня зовут Виталий Ильинчик, я программист 1С, работаю в ИТ-отделе компании TELS, которая занимается транспортно-экспедиционным бизнесом.

С 1С работаю уже 8 лет. Хочу поделиться своим опытом успешного внедрения веб-клиента и рассказать о том, как подготовиться к внедрению, чтобы проект «взлетел».

Отступление

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

Что делать, чтобы не было скучно? Как говорил наш руководитель - надо “ввязаться в драку, а потом разберемся”, что я и сделал.

Предыстория проекта

Чтобы понять специфику проекта, немного информации о нашей компании.

• Группа компаний TELS организует комплексные международные перевозки всеми видами транспорта. Конкретно в нашем проекте было задействовано только одно направление – автомобильный транспорт.

• У бизнеса давно была цель – автоматизировать управление взаимоотношениями с поставщиками.

• Проблема была в том, что наши сотрудники, организующие перевозки, очень много времени тратят на ручные коммуникации в “ручном режиме”, решая такие вопросы как текущее местоположение груза, когда оплатите счет, почему заблокировали счет. Выяснение текущего состояния перевозки занимало у сотрудников много времени.

Почему я оказался в проекте:

• На момент, когда стартанул проект по решению этой проблемы мне посчастливилось посетить конференцию Infostart Event 2019 Inception – там мне успешно «подселили идею», что веб-портал можно успешно реализовать на платформе 1С.

• Также в это время внутри компании шёл проект «Лига новаторов» – что содействовало моему творческому порыву и самореализации.

• Идея создания веб-кабинета висела очень давно, не раз к ней пытались подходить, но дальше этапа согласования это дело не тронулось. Я воспринял это как личный вызов и «ввязался в драку».

Что нужно для успешного старта объемного проекта

Нужна хорошая идея. Мы должны понимать конкретную ценность нашего решения: какую именно проблему бизнеса мы пытаемся решить.

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

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

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

Онлайн-доска для ведения задач – она должна быть с самого начала любого проекта. Идеи и мысли появляются – мы их записываем на бумагу, в блокноты, но что-то забывается или теряется, и в итоге возвращаемся к тому, что эту задачу мы уже обсуждали. В самом начале стоит определиться с колонками, например: К выполнению / В работе / Тест / Завершено / Отклонено – все, что угодно или к чему привыкли. Нам зашла доска Asana – огромное количество возможностей, работа команды до 15 человек бесплатна, очень рекомендую.

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

В итоге я пришел к тому, что наш проект немного Agile.

Прототип – MVP

При реализации проекта мне очень помог прототип – MVP, который я реализовал с помощью внешней обработки прямо в рабочей базе.

Технология следующая: берем внешнюю обработку, пишем в модуле объекта код для подключения в справочник дополнительных отчетов и обработок. Если база без БСП – можно запускать просто через «Файл – Открыть».

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

Небольшой лайфхак – если каких-то объектов, которые должны присутствовать в продукте, у вас в базе еще нет, вы можете имитировать их работу программно. Например, нам в кабинете поставщика нужно было учитывать документы «Заявление на свободный транспорт» – это новый документ, который в базе мы еще не добавили. Поэтому мы в обработке 1С эмулируем работу этого документа – создаем новую форму, переносим ее открытие в редактирование табличной части этой обработки. Если есть возможность и желание – данные можно сохранить в кэше, а при следующем открытии выводить пользователю.

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

Отдельно стоит отметить, что продуктом будут пользоваться только в том случае, если он приносит ценность для конечного пользователя, а не для вас. Если веб-клиент бесполезный (для пользователя), им пользоваться не будут.

Мы для себя сразу определили особо ценные пользовательские функции своего веб-клиента, одна из них – оперативное получение самим перевозчиком данных об оплате счетов, с возможностью ускорить оплату этого счета.

Выбор платформы

Следующий вопрос, с которым нужно определиться – платформа.

Выбор платформы зависит от цели проекта – где-то нужна одна страница, а где-то гораздо больше.

Мы разослали предложения выполнить проект различным компаниям (в основном использующим технологии НЕ 1С), а потом сравнили предлагаемые сроки и стоимость. Разработка и внедрение веб-клиента на платформе vCan-Site по срокам и по стоимости получилось в разы быстрее и дешевле по сравнению с другими предложениями. Поэтому сомнений уже не оставалось.

Параллельно камень в огород не-1С-платформ: если основная учетная система 1С, а все остальное – нет, то сразу встает вопрос: кто будет разрабатывать интеграцию и заниматься дальнейшим сопровождением и развитием системы. Как минимум, компания может попасть на подключение стороннего разработчика в штат. А зарплаты разработчиков на других технологиях, как известно, немного другого уровня (в основном выше).

Безопасность

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

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

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

Рекомендую ознакомиться со списком документов ниже:

• ГОСТ Р 51904-2002 – документ обширный, объемный, однако из него можно почерпнуть много нового;

• OWASP – ежегодный топ-10 угроз для веб-проектов;

• ИТС – требования по безопасности к ПО;

• внутренние регламенты – обязательно изучите их (если таковые имеются).

На что обратить внимание с технической стороны

Как будет организована интеграция. Веб-клиент отображает данные. Вопрос, откуда эти данные должны быть отображены – из основной базы или ее зеркала? Какими потоками какие данные в интеграции будут ходить, что где хранится (список конкретных таблиц) – это важный вопрос, который стоит сразу обсудить.

Организация непрерывной интеграции и доставки кода на рабочую базу – рекомендую сразу организовать контроль качества кода, если его раньше не было. SonarQube, автоматизированная проверка конфигурации от 1С, PhoenixBSL – прекрасные инструменты, позволяющие оптимизировать свой код еще на стадии написания.

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

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

Мониторинг доступности и сбор ошибок – Zabbix, чат-боты (telegram: @watch_bot), журнал регистрации, мониторинг производительности от 1С. Максимально используйте - никогда не будет лишним. Узнать о недоступности продукта лучше от системного оповещения, чем от звонков пользователей.

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

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

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

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

На что обратить внимание со стороны бизнеса

Со стороны бизнеса тоже есть нюансы.

Нужно определить, какие преимущества дает использование веб-клиента для конечного пользователя.

Кто ответственный за продукт? Обычное развитие ситуации может выглядеть так: веб-клиент сделали, запустили, а дальше программист сидит и руками заводит новых пользователей (потому что только у него есть права), создает отчеты и сбрасывает пароли. Стоит предусмотреть заранее возможность роль для администрирования продукта.

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

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

Показатели эффективности KPI. Как пользуются кабинетом: Сколько файлов загрузили? Сколько заявок отметили? Сколько заказов сделали? Как используется чат? Все это можно вынести в отдельный отчет, и в зависимости от показателей давать заказчикам какие-то скидки.

Инструкции и регламенты обязательно должны быть, даже если интерфейс очень простой и понятный. В любом удобном формате – pdf, word, powerpoint, видео – вообще замечательно. Обучайте пользователей, чтобы они вас тревожили по минимуму.

Итого

Если резюмировать:

• минимальный продукт MVP мы внедрили очень быстро и практически безболезненно, причем, с помощью стороннего разработчика.

• Внутренний заказчик и внешние пользователи довольны, все счастливы. Наш кабинет уже работает в режиме опытно-промышленной эксплуатации – всплывают некоторые недочеты, но т.к. движок веб-клиента написан полностью на 1С, мы все можем поправить сами.
  UPD: на момент публикации кабинет в эксплуатации больше года - полет нормальный. Проект живет и развивается.

• Как специалист 1С я свои знания только укрепил – добавил интересный кейс в свой портфель.

• Но при этом во фронтенд я не погружался. Если у меня были какие-то замечания по интерфейсу, я мог найти код HTML, поменять значения и посмотреть, как это будет выглядеть, но основной версткой не занимался.

• Также я получил новый опыт и профессиональное признание от коллег.

Демо

Кратко хотел бы показать, что у нас получилось.

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

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

Для табличной части присутствуют самые необходимые быстрые фильтры (Actual, Completed), можно искать по номеру, по строке.

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

Здесь показана сама форма документа – у нее тоже несколько закладок. В шапке есть гиперссылка, где можно увидеть реквизиты ответственного менеджера по этому заказу.

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

Предусмотрена возможность отметить местоположение, чтобы мы оперативно знали о текущем состоянии перевозки – именно ради этого и был реализован этот веб-клиент.

Также можно ввести сообщение по заказу (по факту простейший чат) – оно появится в нашей учетной системе, и все, кто работают с этим заказом, это сообщение увидят. Плюс уведомление о сообщении сразу уходит на почту ответственному менеджеру по заказу.

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

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

Специально сделали форму в виде списка без возможности открытия формы документа.

Рассмотрим еще один документ – «Заявление на свободный транспорт», где мы можем выбрать страну. Это возможности платформы из коробки, и функционал достаточно стандартный.

Есть отдельная вкладка с неактуальными документами – архив.

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

Либо, если у него нет доступа, он может сообщить об изменениях – например, если VAT-номер поменялся.

Также разработана подсистема отчетов. Есть отчет «Поиск контактного лица по направлению» – например, если нужна перевозка из одной страны в другую, можно посмотреть список номеров, ответственных, департаментов, куда конкретно звонить по какому направлению перевозки.

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

Переключим язык интерфейса в настройках – и кабинет выводится уже на русском. Причем сами реквизиты (данные) тоже переводятся. Отдельно можно перевести и на польский.

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

Все работает достаточно быстро.

Что дальше

После того, как мы разработали веб-клиент, у нас остались вопросы:

• кто и как будет развивать продукт;

• как увеличить прибыль от продукта;

• мобильная версия – если интерфейс сложный, мобильная версия без доработок будет отображаться не очень красиво.

• мобильное приложение – кто будет его делать и как.

В целом хочу всем пожелать:

• Используйте любые возможности для роста.

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

• Генерируйте новые идеи.

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

В презентации к докладу использовались мемы из блога zhazhda.biz.

Вопросы

Вы говорили, что когда в чате добавляется сообщение, оно скоро появится в системе? Почему оно появится в системе не сразу? Теоретически это ведь веб-клиент – все должно моментально появиться.

Тут особенности выбора технической реализации. Мы решили не публиковать свою основную базу в интернет, поэтому сделали промежуточную базу, с которой наладили обмен. Поэтому появится не сразу, а через то время, когда пройдет обмен. Обмен с помощью библиотеки стандартных подсистем, конвертации данных. Работает отлично, в основной базе у нас опубликован веб-сервис, в котором живут типовые методы БСП по конвертации данных. И из непосредственно бэкенда кабинета перевозчика с периодичностью пара минут происходит обмен – пока вопросов нет. Поэтому не сразу.

Какая часто идет обмен в показанной демонстрации – 1С? Или только обмен по расписанию? Вы обращаетесь к базе 1С через 1С или через SQL?

1С представляет собой бэкенд этого сайта – в 1С хранятся все эти данные, в ней динамически генерируются все эти формы, которые мы в итоге видим на экране. Все это происходит с помощью платформы vCan-Site, которая представляет собой подсистему на 1С. К базе 1С мы обращаемся через опубликованный HTTP-сервис.

Все, что показано в демо – это 1С. Все данные, которые были показаны – это данные из реальных объектов 1С. Если мы видим список документов «Заявление на свободный транспорт», то это реальный список документов «Заявление на свободный транспорт». Когда мы открываем его форму – это реальная форма из базы. Если мы добавим новый документ в веб-интерфейсе и запишем его, он сразу окажется в 1С. Все, что вы видите на экране – это данные, взятые из базы 1С. Формы, которые сформированы, собраны на лету. Мы берем шаблоны, заполняем эти шаблоны с помощью данных и отдаем в виде готовой HTML-страницы. 1С является и СУБД и CMS-системой. А в рабочей базе не появляется сразу из-за того, что есть промежуточная база, созданная в целях безопасности и для ускорения работы самого веб-клиента.

Зачем нужна промежуточная база?

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

Вынося бэкенд веб-клиента в отдельную базу, у вас появляются как плюсы, так и минусы. Главный минус в том, что нужно организовывать обмен. Либо подключать какие-то библиотеки, которые позволяют это сделать моментально. RabbitMQ, Kafka или еще какой-то онлайн-обмен делать. При этом скорость изменения конфигурации вашего веб-клиента никак не зависит от регламента и частоты обновления рабочей базы. Вы можете обновлять конфигурацию промежуточной базы хоть каждые пять минут. При этом пользователи вообще ничего не заметят (если конечно не будет ошибок).

Промежуточная база тоже на 1С?

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

*************

Данная статья написана по итогам доклада (видео), прочитанного на онлайн-митапе "Web-клиенты для 1С". Больше статей можно прочитать здесь.

Приглашаем всех 11-12 ноября принять участие в INFOSTART EVENT 2021 в Москве: //infostart.ru/events/1451228/