SHOWCASE / PRODUCT WALKTHROUGH
구현 화면
한 문장으로 시작해 자리를 고르고, 자금계획을 비교해 상담자료로 가져가기까지.
“서문시장 근처 카페, 예산 4천만.”
이 한 문장이 자리 선택, 자금 계산, 계획 비교, 상담 준비로 이어지는 과정을 소개합니다.
촬영일 2026.09.19 · 환경 로컬 프론트 3300 + 실백엔드 8300 · 사례 대구 대신동 / 카페
9월 19일 밤 최신 UI를 헤드리스 브라우저로 다시 촬영한 실제 화면 8장입니다. 데스크톱 1440×1000, 모바일 390×844 기준이며 이미지를 누르면 크게 볼 수 있습니다. 입력 금액은 시연용 가정입니다. 9월 20일 팀 확인 기준 운영 서비스의 배포 갱신을 완료했으며, 시연 영상은 이 구현 화면으로 대체했습니다.
01. 창업 조건 입력 — 한 문장으로 시작합니다
홈에서 지역·업종·예산을 입력합니다. 예시 문장의 서문시장은 대신동으로 연결되고 카페는 지도 탐색 조건이 되며, 예산 4천만 원은 사전상담의 자기자본 입력으로 이어집니다.
사용자가 이미 말한 조건을 다음 화면에서도 이어 받아, 같은 정보를 다시 입력하는 부담을 줄입니다.
02. 지도에서 자리 선택 — 지역의 근거를 봅니다
지도에서 행정동을 선택하면 해당 업종의 점포 수·폐업률·점포 증감률을 확인할 수 있습니다. 시연에서는 대신동을 선택하고 ‘이 자리로 창업자금 사전상담’으로 이동합니다.
상권 위험도는 지역 간 상대적인 지표이지, 내 가게의 실패 확률이 아닙니다. 데이터가 없는 경우도 0과 구분합니다.
달라진 지도 — 모바일 배치와 업종별 추가 지표
모바일에서는 지도와 정보 패널을 위아래로 배치해 지도 영역을 확보했습니다. 어린이집은 폐업률(추정)과 함께 정원 대비 현원·입소대기를 표시합니다.
03. 창업자금 계산 — 필요한 돈을 나누어 봅니다
사업자등록 여부와 창업 일정, 보증금·인테리어·설비·월세·인건비 등 비용을 입력합니다. 자기자본과 희망대출은 구분하며, 예상 월매출은 사용자가 설정한 가정으로 다룹니다.
총 준비자금, 자기자본 외 조달 필요액, 희망대출 반영 후 부족액을 분리합니다. 계산은 코드가 담당하고 AI가 숫자를 만들어 채우지 않습니다.
04. 계획 비교와 선택 — 월세를 바꾸면 무엇이 달라질까요?
위 화면의 핵심은 최초 계산을 남겨 두고 변경안을 비교하는 것입니다. 시연 대본에서 월세만 250만 원에서 100만 원으로 바꾸면 다음과 같이 달라집니다.
| 항목 | 최초안 | 현재안 |
|---|---|---|
| 월세 | 250 | 100 |
| 손익분기 월매출 | 900 | 525 |
| 총 준비자금 | 7,160 | 6,260 |
| 자기자본 외 조달 필요 | 3,160 | 2,260 |
| 희망대출 반영 후 부족액 | 660 | 0 |
두 안 모두 자기자본 4,000만 원·희망대출 2,500만 원을 가정합니다. 보증금 2,000만 원, 인테리어 2,000만 원, 설비 1,000만 원 등 나머지 조건은 동일합니다. 실제 결과는 입력 조건에 따라 달라집니다.
입력만 수정하고 다시 계산하지 않았을 때는 이전 결과라는 경고를 띄우고 선택을 막습니다. 재계산 후 상담할 안을 고르고 변경 이유를 남깁니다.
부족액 0원 ≠ 자기자본만으로 충분. 현재안도 외부에서 2,260만 원을 마련해야 합니다. 희망대출은 아직 확보된 돈이 아닙니다.
05. 금융상품 후보 — 상담할 대상을 추립니다
선택한 자금계획과 창업 조건을 바탕으로 상담 후보를 정리합니다. iM뱅크 취급 근거가 확인된 상품과 근거 미확인 후보를 구분하고, 확인이 필요한 조건은 상담 질문으로 남깁니다.
상품 후보는 카드로 비교하고, 각 카드의 ‘절차·서류’를 펼쳐 다음 준비를 확인합니다. 아래는 목록 일부를 재촬영한 화면입니다.
후보 안내는 대출 승인·한도·금리의 보장이 아닙니다. 실제 자격과 조건은 해당 기관의 공식 안내와 상담으로 확인해야 합니다.
06. 상담자료 — 계산 근거와 질문을 한 문서로
상담할 계획, 최초안과 현재안의 비교, 재무 계산표, 자금 후보, 상담에서 확인할 것, 지역 근거를 하나의 자료로 연결합니다. 화면 왼쪽에서는 지역 근거·뉴스·자금 계산 등의 진행 상태를 확인할 수 있습니다.
계산표와 비교표는 코드의 결과를 사용하고, AI는 변경 이유의 설명과 상담 질문을 보조합니다. 모르는 항목은 임의의 값으로 채우지 않고 확인할 사항으로 남깁니다.
시연 대본의 마지막 단계는 Markdown 저장과 인쇄/PDF 저장, iM뱅크 공식 상담 안내로의 이동입니다. 자료는 사용자가 저장해 상담에 지참합니다.
공식 안내 링크를 눌러도 상담자료가 은행으로 자동 전송되지 않습니다. 은행 제휴나 자동 접수를 의미하지 않습니다.
추가 질문 — 업종에 맞는 예시로 시작합니다
행정동·업종을 이름으로 선택하고, 11개 업종별 예시 질문 칩을 눌러 추가 질문을 채웁니다. 계산은 재무 엔진이 담당하며 질문 예시는 지역 지표·뉴스·자금 확인에 맞췄습니다.
자료 기준 · 2026-09-19 밤 로컬 실행 화면 재촬영. 서비스 작업 트리 bd25443 기준, 실백엔드·적재된 데이터를 사용했으며 화면 응답을 모의 데이터로 대체하지 않았습니다. 홈 입력 → 대신동 → 최초 계산 → 월세 변경·재계산 → 상담자료 생성(저장 버튼 활성) 흐름을 확인했습니다. 계산 입력은 docs/demo-script.md를 따랐습니다. 건수·AI 문장은 촬영 시점의 결과입니다.