현대글로비스 오토벨
수출플랫폼 고도화
- UI / UX
- System Intergration
Overview
User Flow, Website Design, Mobile Design, Style Guide
Java, OAuth2, Tibero, Vuejs, Axios, Swagger-Ui, Rest API, Chartjs, Qrcode, sass
‘현대글로비스’는 세계화 시대에 새로운 비전을 제시하는 글로벌 종합물류유통기업입니다.
오토벨 수출플랫폼 고도화를 통해 전 세계 바이어들이 시공간 제약 없이 차량들을 만나보고
손쉽게 주문할 수 있는 서비스를 운영하고 있으며 안전하게 운송까지 책임집니다.
이에 보다 완벽한 서비스를 제공하기 위해 수출 플랫폼 고도화를 진행하였으며 영업, 인천수출센터 등
각 부서의 니즈 파악을 통해 각 업무에 필요한 화면들을 제작 및 개편하였습니다.
Approach
Digital Transformation
with ADCAPSULE DX
Strategy
애드캡슐은 업무 시스템 이용 고객의 업무향상을 위해 데이터 기반의 맞춤형 UI를 적용했습니다.
실제 업무 프로세스를 효율적으로 적용할 수 있도록 UI/UX, 디자인 가이드 등을 바탕으로 로드맵을 수립했습니다.
Digital Transformation
-
Information
- structure System
- Dashboard Time
QR코드를 활용한 차량 입출고 및 재고 관리 시스템을 도입하여 인천수출센터의 오프라인 작업을 온라인으로 전환했습니다. 또한, 선적 전 검수 및 성능 점검, 상품화 등의 협력사 업무 관리 화면을 구축하여 타사와의 연계를 강화했습니다.
통관, 선적, 중고차 업무 시스템을 통합하여 사용자 편의성을 극대화하였고, 인터페이스를 통해 비효율적이었던 업무 시간을 감축시켰습니다.
업무 프로세스를 기반으로 IA를 재구성하여 복잡한 사이트 구조를 쉽게 이해할 수 있도록 설계했습니다. 주문과 선적을 하나의 시스템으로 통합하여 거래 관리 대시보드를 통해 업무 처리 시간을 단축하고 고객에게 최고의 가치를 제공합니다.
국내 오토벨 매물 및 매입 시스템을 연동하여 수출 플랫폼에서 직접 주문 및 판매가 가능하도록 설계함으로써 시장 경쟁력을 확보했습니다.
경매 및 매집 네트워크와의 연계를 통해 중·장기 사업 모델의 확장성을 확보하고, 새로운 판매 루트 기회를 창출할 수 있도록 대비했습니다.
-
Digital
Transformation 1 업무 시스템 개선업무 프로세스를 기반으로 IA를 재구성하여 복잡한 사이트 구조를 쉽게 이해할 수 있도록 설계했습니다. 주문과 선적을 하나의 시스템으로 통합하여 거래 관리 대시보드를 통해 업무 처리 시간을 단축하고 고객에게 최고의 가치를 제공합니다.
-
Digital
Transformation 2 인천수출센터 전산화QR코드를 활용한 차량 입출고 및 재고 관리 시스템을 도입하여 인천수출센터의 오프라인 작업을 온라인으로 전환했습니다. 또한, 선적 전 검수 및 성능 점검, 상품화 등의 협력사 업무 관리 화면을 구축하여 타사와의 연계를 강화했습니다.
-
Digital
Transformation 3 국내 오토벨 플랫폼 매물 연동국내 오토벨 매물 및 매입 시스템을 연동하여 수출 플랫폼에서 직접 주문 및 판매가 가능하도록 설계함으로써 시장 경쟁력을 확보했습니다.
-
Digital
Transformation 4 내부 기간계 인터페이스 연계통관, 선적, 중고차 업무 시스템을 통합하여 사용자 편의성을 극대화하였고, 인터페이스를 통해 비효율적이었던 업무 시간을 감축시켰습니다.
-
Digital
Transformation 5 사업 모델 확장 대비경매 및 매집 네트워크와의 연계를 통해 중·장기 사업 모델의 확장성을 확보하고, 새로운 판매 루트 기회를 창출할 수 있도록 대비했습니다.
업무 시스템 화면
해당 샘플은 현대글로비스 내부 업무 시스템으로 시스템 보안준수 및 위변조 방지를 위해 블러 처리하였습니다.
해당 샘플은 현대글로비스 내부 업무 시스템으로 시스템 보안준수 및 위변조 방지를 위해 블러 처리하였습니다.
Design
디자인적으로도 현대글로비스 수출 플랫폼의 사용성을 높이는 데 집중했습니다. 업무환경에 따른 눈부심, 눈의 피로도를 낮추기 위해 다크 모드를 적용하였습니다. 다크 모드의 장점을 극대화하기 위해 수출 플랫폼에 적합한 다크 모드 컬러 시스템을 구축했습니다.
레이어 계층에 따라 배경 컬러에 보라색 컬러를 조색해 쉬운 정보의 위계 파악을 돕습니다. 또한 다크 모드에 최적화된 채도 가이드를 반영해 가독성을 높였습니다.
Style Guide
