ВХУТЕМАС
Сайт медиаплатформы, запущенный к 100-летию творческих мастерских
задача
Разработать набор сервисов для внешнеэкономической деятельности: тамо • ОС — сервис для таможенного оформления и консультаций экспертов, тамо • школа — база знаний и теоретические основы ВЭД. Поддерживать систему сервисов в дальнейшем развитии.
клиент
«Таможенная карта»
отрасль
Финтех
год запуска
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 готовы брать на себя ответственность и полностью включаться в процессы, добиваясь высоких результатов.
смотрите также
связаться