KB캐피탈 임대상품자산관리시스템 디자인

Overview

2017년 7월부터 9월까지 약 3개월간 KB캐피탈 임대상품자산관리시스템 개발 프로젝트에 참여하였습니다.
KB캐피탈에서 제공하는 중고차 관련서비스를 지원하기 위한 정비업체 관리 시스템으로 업무화면 공통 UI 디자인을 담당하였습니다. PC, TABLET, MOBILE에 모두 대응가능한 반응형 디자인 제공하였습니다.


My Roll

KB캐피탈 임대상품자산관리시스템 관련 총괄 디자인 - 기여도 100%

  • 시스템 UI 디자인 - 반응형 (PC first, TABLET, MOBILE)
  • 디자인시안 3종
  • 임원PT 그래픽
  • 디자인 스타일가이드 작성 (PPT산출물)

Goals

기존의 정형화 된 시스템 UI를 벗어나면서도 UX는 기존 사용자들의 학습에서 벗어나지 않도록 구성되어야 한다는 점이 가장 중요한 목표였습니다. 실제 시스템을 사용하는 사용자는 정비업체 관리자로 연령대가 다양하며 남성 위주의 사용자라는 점이 중요했습니다. 최대한 정리된 화면이면서도 기존에 개발되었던 시스템 화면의 UI/UX와 같이 정형화된 레이아웃, 컬러, 그리드를 원하지 않았으며, PC first의 화면이면서도 table/mobile 화면에서도 기본적인 기능은 수행할 수 있도록 디자인되어야 했습니다.


Communication

기획 및 개발팀은 내부에 파견되어 프로젝트를 진행하였으며, UI/UX 디자인을 담당했던 저는 시행사인 트라이핀즈 본사에서 근무하면서 디자인을 진행하였습니다. 프로젝트 참여 시작 시 시스템의 대시보드와 작업화면의 샘플화면만 기획서만 제작된 상태였으며, 기획서만으로는 궁금한 점이나 확인해야 할 사항들을 바로바로 확인할 수 없어 최대한 디자인 작업시 요청되어야 할 사항을 정리하여 커뮤니케이션 하였습니다.

첫 작업시 요청사항

  1. 상시노출 컨텐츠 내용 정리 (GNB, header, footer)
  2. 작업화면 기준화면 정리 - 가장 많은 기본기능 및 UX가 포함된 화면 기준으로 작성된 기획서
    - 가장 복잡한 화면에서의 화면구성이 간결하고 기능이 혼재되지 않아야 하므로 요청한 바입니다.
  3. 레퍼런스 화면
  4. 클라이언트/사용자정보
  5. 반응형 화면 기준

Cyan & Presentation

시안

시안은 총 3가지로 작업되었습니다.

  • 시안1 - KB그룹의 고유 컬러와 무게감을 표현
  • 시안2 - 고유 컬러를 가볍고 산뜻하게 표현
  • 시안3 - 간결한 컬러시스템으로 대시보드에 초점을 두어 표현

시안 작업 후 실제 시스템의 기능구현 및 개발의도와 맞지 않거나 동떨어져 샘플링된 UI/UX는 클라이언트 및 기획/개발팀의 회의를 거쳐 수정되어 기획서로 전달되었고 1차 수정작업 및 모바일시안 구현으로 이어졌습니다.

KB 임대상품자산관리시스템 시안

프레젠테이션

시안 수정 작업 후 임원 회의를 위한 ppt 작업을 진행하였습니다. Image Alt 텍스트


Device View

device view
KB캐피탈 임대상품자산관리시스템 반응형 Device View

Features

LNB

LNB


quick link


Toast message

toast


Logistics Calendar

calendar


Design system

font & color

color


icon

교환주기부품
부품쿠폰
첨부파일


Grid

grid


Final Output

KB캐피탈 임대상품자산관리시스템 Final Output
KB캐피탈 임대상품자산관리시스템 Final Output