금융계산기에서 3억을 입력받는 법, 단위 토글 대신 입력 에코

대출이자 계산기를 직접 만들어 보니 계산 공식보다 입력창에서 먼저 막혔어요. 사람들이 큰 금액을 적는 방식이 제각각이거든요. 3억이라는 집값 하나를 두고도 누군가는 300000000을 치고, 누군가는 30000을 쳐요. 뒤쪽은 머릿속에서 '만원'을 붙인 거죠.

문제는 공식이 아니라 단위였어요

3억 원은 0이 8개 붙은 9자리 숫자예요. 모바일 키패드로 치면 3 한 번에 0을 여덟 번 눌러야 하니 손가락이 먼저 지쳐요. 그래서 많은 서비스가 입력 단위를 만원으로 둡니다. 30,000만원만 치면 끝이라 편하긴 해요.

문제는 두 습관이 한 화면에서 만날 때예요. 만원 단위 창에 원 단위로 300,000,000을 넣으면 계산기는 3조 원짜리 대출로 받아들여요. 반대로 원 단위 창에 30,000을 넣으면 3만 원짜리 대출이 되죠. 둘 다 에러 없이 결과가 나와서 더 위험해요. 상환액이 터무니없는 숫자로 찍혀도 사용자는 '이 계산기 이상하네' 하고 떠날 뿐이에요.

단위 토글은 왜 안 골랐나

처음엔 원/만원 토글 버튼 2개를 두는 안을 적용해 봤더니 선택지가 하나 더 늘어난 꼴이었어요. 토글을 봐야 하고, 지금 어느 상태인지 기억해야 하고, 결과 화면에서도 단위를 다시 확인해야 하죠. 입력 실수를 막으려고 넣은 장치가 또 하나의 실수 지점이 됐어요.

입력 에코, 치는 대로 한글로 읽어 줘요

결국 고른 방법은 입력창 바로 아래에 지금 숫자를 한글 금액으로 바꿔 보여 주는 거예요. 300000000을 치면 '3억 원', 30000을 치면 '3만 원'이 즉시 떠요. 사용자가 단위를 고르는 대신 계산기가 해석을 먼저 말해 주고, 틀렸으면 사용자가 0을 더 붙이는 구조예요.

구현은 억·만 자리로 숫자를 나누는 함수 하나면 돼요.

function toKoreanWon(n: number) {
  const eok = Math.floor(n / 1e8);
  const man = Math.floor((n % 1e8) / 1e4);
  const won = n % 1e4;
  return [eok && `${eok}억`, man && `${man.toLocaleString()}만`, won && `${won}`]
    .filter(Boolean)
    .join(' ') + ' 원';
}

토글을 걷어내고 에코만 남겨 돌려 보니 사람들이 글자를 읽는 순간 손이 멈춰요. 테스트해 보면 '3만 원'이 뜨면 잠깐 보고 0을 네 개 더 치고, '3조 원'이 뜨면 지우기 시작해요. 설명 문구가 없어도 숫자와 글자 사이의 어긋남이 스스로 교정을 끌어내는 거죠.

값은 하나로, 표시는 두 번

이 방식의 핵심은 내부 값을 항상 원 단위 정수 하나로만 들고 있는 거예요. 단위 상태가 없으니 계산식에 분기가 없고, 결과 화면에서도 같은 함수를 그대로 써요. 예컨대 3억을 이자 없이 300개월로 나누면 한 달에 100만 원씩인데, 이 값도 '1,000,000 원'과 '100만 원' 두 모습으로 같이 보여 줄 수 있어요. 입력에서 한 번, 결과에서 한 번, 같은 에코가 두 번 쓰이는 셈이에요.

라이프케어로그에서 만드는 플랜씨(plan-c)는 대출이자·복리 계산기를 로그인 없이 바로 쓰는 도구라서 이 문제가 더 크게 보였어요. 가입 절차가 없으니 첫 입력창이 곧 첫인상이거든요. 금액을 받는 폼을 만들고 있다면 단위 선택지를 늘리기 전에, 치는 대로 읽어 주는 한 줄을 먼저 붙여 보셔도 좋겠어요.