drag

кейс

тамо

Дизайн и разработка системы сервисов для трансграничной торговли и ВЭД

gotamo.ru
задача

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

клиент

«Таможенная карта»

отрасль

Финтех

год запуска

2021

что сделали

Frontend-разработка
Backend-разработка
Аналитика и прототипирование
Дизайн-концепция
Дизайн сайта
Motion-дизайн
3D-дизайн
Брендинг
Поддержка и развитие проекта

О сервисах тамо

тамо — новое направление компании «Таможенная карта», система сервисов для автоматизации ВЭД. тамо ОС — современное решение для малого и среднего бизнеса, которое объединяет все процессы, связанные с доставкой и оформлением грузов в одном месте. тамо Школа — платформа с актуальной базой знаний и теоретическими и практическими курсами.

Сервисы тамо — новый опыт таможенного оформления.

Техническая реализация: микросервисный подход

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

Ключевой плюс этого подхода — горизонтальное масштабирование.

Стэк технологий

Система сервисов построена в соответствии с best practices в микросервисах и разработке в целом. Backend реализован на Java и SpringBoot, фронтенд — на React. В качестве load balancer (балансировщика) используется nginx.

Инфраструктура включает сервер SSO для аутентификации и авторизации, который используется всеми модулями системы. Это свободно распространяемый сервер Keycloak. В качестве Service Discovery и централизованного хранилища динамических конфигураций используется Consul.

Паттерн API Gateway позволяет создать единую точку входа для всех клиентов.

Лендинг к запуску продукта

До официального релиза мы создали промостраницу тамо • ОС для сбора заявок на early access. Лендинг включает также короткий ролик с демонстрацией преимуществ сервиса.

Анимации

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

Новый взгляд на декларирование

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

Удобство заполнения

К заполнению можно вернуться в любой момент — вся внесенная информация сохраняется.

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

О тамо • школе

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

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

технологии

React

Redux

Effector

Typescript

React-hook-form

Yup

Java 11

Maven

Spring framework

PostgreSQL

ClickHouse

Hibernate

Consul

GitlabCI

IBM MQ

Active MQ

Elasticsearch

Kibana

Docker

Next.js

JavaScript

SCSS

Webpack

отзыв

Андрей Возмилов
Андрей Возмилов
Генеральный директор
ООО «Таможенная карта»

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

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

смотрите также

ВХУТЕМАС

Сайт медиаплатформы, запущенный к 100-летию творческих мастерских

Leviev Group

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

Squilla Fund

Сайт для сервиса, помогающего инвестировать в криптоиндустрию

связаться

Расскажите о своей задаче

Мы Red Collar, а как зовут вас? Чтобы связаться, нам нужен ваш e-mail Ого, какой тяжелый файл! Больше 10 MБ ждем на hello@redcollar.ru Пожалуйста, проверьте, правильно ли написан e-mail

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