
매출채권·전자어음 유동화 플랫폼 고도화
돌아가고 있는 금융 서비스를, 멈추지 않고 갈아끼웠습니다.
NICE abc는 기업이 보유한 매출채권과 전자어음을 온라인에서 유동화하는 플랫폼입니다. 돈이 필요한 기업은 받을 돈을 미리 현금화하고, 투자자는 그 채권에 투자해 수익을 얻습니다.
새로 만드는 일이 아니었습니다. 이미 운영 중인 서비스를 전면 개편하는 일이었습니다. 그래서 첫 산출물이 디자인 시안이 아니라 AS-IS 메뉴 대응표였습니다. 기존 메뉴 하나하나를 새 구조의 어디에 넣을지 대응시키는 작업부터 시작했습니다.
그리고 금융 서비스에는 일반 웹사이트에 없는 것이 따라붙습니다. 약관 동의, 실명 인증, 계좌 인증, 서류 제출, 투자 비밀번호. 버튼 하나를 누르면 다음 화면이 아니라 분기가 열립니다. 성공했을 때, 실패했을 때, 확인이 필요할 때가 전부 다른 화면입니다.
투자자가 상품을 하나 사는 데까지 거쳐야 하는 화면입니다. 전부 따로 그렸습니다.
상품 상세 안에서만 세 종류의 정보 화면이 갈립니다. 투자 비밀번호 인증은 상태별로 세 화면을 따로 그렸습니다.
각 단계마다 입력 → 확인 → 오류 세 상태를 별도 화면으로 설계했습니다. 법인 투자회원은 사업자 확인 단계가 더 붙고, 대출회원은 또 다른 흐름입니다. 회원 유형만 세 갈래입니다.
장바구니에 담아둔 상품 중 약관에 동의하지 않은 건이 섞여 있을 때를 위한 별도 흐름입니다. 이런 예외가 금융 UX의 실제 분량입니다.
핀테크 기술을 가진 웨인과 서비스 고도화 일정을 잡으며 시작했습니다.
작업 분할 계획을 세우고 요구사항을 정의한 뒤, 기존 서비스의 메뉴를 새 구조에 하나씩 대응시켰습니다.
CI·BI 로고, 컬러 배리에이션, 타이포그래피 가이드를 정리했습니다. 화면을 그리기 전에 기준부터 세웠습니다.
그릴 화면을 전부 목록화한 뒤 디자인 일정에 붙였습니다.
사흘 간격으로 작업현황을 갱신하며 마무리 구간을 관리했습니다.
개발사에 넘길 화면 가이드를 만들고, 퍼블리싱 결과를 검수해 수정 요청을 정리했습니다.
전자어음 할인신청 매뉴얼과 회원가입 매뉴얼을 만들었습니다.
매출채권 유동화 화면을 추가하고 사용자 가이드를 만들어 마무리했습니다.
무엇을 어떻게 만들지 정하고 설계하는 일은 포엠컴퍼니가 했습니다. 화면 디자인은 레디가, 개발은 핀테크 기술을 가진 웨인이 맡았습니다.
화면이 많아질수록 흔들리기 쉽습니다. 브랜드 가이드를 먼저 세워두고 그린 이유입니다.
출처 — 폴더 내 「NICEabc서비스고도화-ASIS메뉴대응표」, 「WBS」 2판, 「화면목록 및 디자인 일정」 3판, Logo·Color·Typography 가이드
화면에 표시된 기업명·금액·계정 정보는 실제 서비스 데이터이므로 가림 처리했습니다.





