DUOLABS
포트폴리오

자동 투자 관리 서비스

투자 성향에 맞춰 AI 가 국내외 주식 · ETF · 연금 상품으로 포트폴리오를 짜고, 자산 비중을 주기적으로 다시 맞춰 주는 자동 투자 서비스의 앱을 만들었습니다. 다른 플랫폼에 먼저 나와 있던 앱의 소스와 화면 동작을 직접 분석해 구현 범위를 정하고, 옮겨 갈 플랫폼의 화면 구조에 맞게 다시 짰습니다. 수익률과 자산 비중은 투자자가 가장 민감하게 받아들이는 숫자라, 표시가 어긋나면 곧바로 신뢰 문제가 됩니다. 작업은 투자 현황 차트, 상품 가입 흐름, 금융 정보 화면의 표시 점검까지입니다.

Launch
2022
Client
자산관리 핀테크 기업
Type
투자·자산
01 / 04

소스부터 읽고 화면 흐름에 맞춰 다시 짠 이식

자동 투자 앱은 다른 플랫폼에 먼저 나와 있었고, 작업은 그 앱의 소스와 화면 동작을 직접 분석하는 데서 시작했습니다. 분석한 기능을 정리해 구현 범위를 정하고, 기존 구현을 그대로 베끼는 대신 옮겨 갈 플랫폼의 화면 구조와 사용자 흐름에 맞춰 다시 구성했습니다. 일정이 짧아 기능 단위로 우선순위를 나눴고, 상품 가입 흐름과 투자 차트 화면을 중심에 두고 속도와 안정성을 함께 맞췄습니다.

소스부터 읽고 화면 흐름에 맞춰 다시 짠 이식
02 / 04

숫자보다 모양으로 먼저 읽히는 투자 차트

자동 투자 앱의 투자 현황 화면은 수익률, 자산 비중, 통계 데이터를 차트로 보여 줍니다. 알고리즘이 자산 비중을 주기적으로 다시 맞추는 서비스라, 투자자는 지금 돈이 어느 자산에 얼마나 들어가 있는지를 이 차트로 확인합니다. 선 · 막대 · 원 세 가지 차트를 화면 목적에 맞게 나눠 써서, 투자자가 숫자를 하나씩 읽기 전에 투자 성과와 포트폴리오 구성을 모양으로 먼저 알아보게 했습니다. 차트 종류와 표시할 데이터는 그 화면이 답해야 하는 질문에 맞춰 화면마다 따로 골랐습니다.

숫자보다 모양으로 먼저 읽히는 투자 차트
03 / 04

상품 카드를 넘기다 그대로 들어서는 가입

로보어드바이저 상품 가입은 국내외 주식 · ETF 투자부터 연금저축 · 퇴직연금까지 여러 투자 상품과 설명을 카드로 늘어놓고 옆으로 넘기며 고르는 흐름입니다. 상품을 둘러보다 자연스럽게 다음 단계로 넘어가도록 카드 모양 화면과 넘김 동작을 구성했습니다. 상품 화면은 담을 내용이 많아 구획 단위로 나눠 짰고, 구획마다 데이터 구조와 화면 칸 구성을 분리해 기능을 더하거나 고칠 때 그 구획만 손대면 되게 했습니다.

상품 카드를 넘기다 그대로 들어서는 가입
04 / 04

수익률 한 칸도 어긋나지 않게 한 금융 화면 점검

투자 정보, 상품 설명, 수익률 표시는 투자자가 가장 민감하게 받아들이는 금융 데이터입니다. 이런 화면에서 표시 오류나 화면 사이의 상태 불일치가 생기지 않도록 세부 경우를 하나씩 점검했습니다. 같은 수익률이 화면마다 다르게 보이면 투자자는 계산보다 서비스를 먼저 의심하기 때문입니다.

수익률 한 칸도 어긋나지 않게 한 금융 화면 점검

이 작업의 포인트

01

먼저 나온 앱을 소스부터 분석해 다른 플랫폼으로 옮긴 구현

02

수익률 · 자산 비중 · 통계를 선 · 막대 · 원 차트로 나눠 보여 주는 투자 현황

03

상품 카드를 넘기며 가입 단계로 이어지는 투자 상품 가입 흐름

인사이트

블로그 전체 보기