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

Главное о кейсе

Отзыв клиента: Red Collar показали себя как наши полноправные партнеры в создании информационной системы тамо • ОС: специалисты агентства глубоко погрузились в специфику отрасли и взяли на себя проектирование, дизайн, фронтенд и бэкенд-разработку. Команда Red Collar консультирует нас при выборе архитектурных решений и отладке процессов разработки, разрабатывает все ключевые визуальные решения и постоянно работает над повышением качества сервиса в целом. Современные языки, оптимизация процессов, полный цикл тестирования.

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

Бизнес-задача и ее решение

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

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

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

Для оптимизации процессов мы собрали дизайн-библиотеку: она организована согласно принципам атомарного дизайна. Использовали готовые компоненты — это позволило нам быстро собирать большое количество экранов: в системе сервисов их более 300.

Кроме того, взяли на себя дизайн коммуникаций: айдентику, разработку лендинга о продукте, моушн- и 3D-дизайн, а также печатную продукцию для офлайн-мероприятий компании.

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

Решили пойти дальше и создали отдельный справочный ресурс с необходимой информацией для работы с системой. Так появилась тамо • школа. Пользователь попадёт в неё по клику «подробная справка» с подсказки — сразу на нужную страницу. Здесь он найдёт значение встретившегося термина, примеры оформления нормативных документов и подробности о деталях процесса.

Task

To develop a system of services to automate foreign economic activity, open for scaling. To provide high quality and security, reliability, and fail-safety.

Solution

We chose a microservices approach to building the architecture for technical implementation. This is an excellent option for developing complex systems: it has undeniable advantages over monolithic architectures. The key benefit of the microservice approach is horizontal scalability; it is tied to key business processes and allows you to scale the system in stages.

UI interfaces are divided into workspaces built according to a predefined hierarchy. We created ones for the company, user, documents, and delivery, and added auxiliary elements, such as pop-ups with information on how to fill each column of the customs declaration. This facilitates the interaction process and does not overload the user.

To optimize processes, we assembled a design library: it is organized according to the principles of atomic design. We used ready-made components, which allowed us to quickly build many screens: the service system has more than 300 of them.
In addition, we undertook the design of communications: the identity, the development of a product page, motion and 3D design, and printed products for the company's offline events.

During the development process, we realized that the amount of data needed to work was growing exponentially. We placed cues in the interface to make the service convenient for everyone. When pointing at one or another element, the user will see a pop-up with brief help and can correctly specify the data in the column.

We decided to go further and created a separate reference resource with the necessary information for working with the system.

That's how the tamo • school came into being. The user enters it by clicking "detailed help" from the tooltip - immediately to the right page. Here they will find the meaning of the term encountered, examples of regulatory documents, and details about the process.

Прочая информация о кейсе

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

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

tamo is a comprehensive solution for international trade. The system of services will help to declare a shipment independently, get expert advice and undergo training on customs clearance. It includes two services:

- tamo • OS, which unites all the processes related to delivery and clearance in one place;
- tamo • school, a knowledge base for doing FEA (Foreign Economic Activity), created to support tamo • OS.

Скриншоты