생키 다이어그램 생성기

돈, 에너지, 사용자가 어디로 가는지 흐름을 입력하세요. PNG나 SVG로 저장할 수 있는 생키 다이어그램이 바로 만들어집니다.

100% 비공개 — 전적으로 브라우저에서 실행됩니다. 데이터는 사용자의 기기에서 처리되며 인터넷으로 전송되지 않습니다.

출발 [값] 도착 형식으로 쓰거나, 스프레드시트에서 세 열(출발, 도착, 값)을 붙여 넣으세요. :저축 #22c55e 같은 줄로 상자에 원하는 색을 줄 수 있습니다.

스타일

생키 다이어그램이란

생키 다이어그램은 무언가가 한 곳에서 다른 곳으로 어떻게 흘러가는지 보여 주는 그림입니다. 각 흐름은 띠로 표시되고, 띠의 너비가 양을 나타냅니다. 대부분이 어디로 가는지 한눈에 알 수 있습니다.

이런 곳에 씁니다:

  • 개인 예산 — 월급이 월세, 식비, 저축, 여가로 어떻게 나뉘는지
  • 회사 재무 — 매출에서 비용, 세금, 이익으로. 연차 보고서처럼
  • 에너지 — 연료에서 전기, 가정까지. 도중에 얼마나 손실되는지도
  • 웹사이트와 앱 — 방문자가 어디서 오고 어디서 떠나는지
  • 영업 퍼널 — 잠재 고객에서 상담, 제안, 고객까지
  • 구직 활동 — 지원에서 면접, 합격까지. Reddit에서 인기 있는 활용법

이 생성기는 입력하는 즉시 다이어그램을 그립니다. 계정도 워터마크도 없고, 숫자가 컴퓨터 밖으로 나가지 않습니다.

사용 방법

  • 한 줄에 흐름 하나를 입력합니다. 시작, 대괄호 안의 값, 그리고 끝 순서입니다. 예: 월급 [4200] 예산
  • 또는 Excel이나 Google Sheets에서 세 열(출발, 도착, 값)을 붙여 넣습니다
  • 다이어그램이 바로 그려집니다. 원하면 제목을 추가하세요
  • 스타일(클래식, 미니멀, 볼드, 소프트, 아웃라인, 다크, 네온, 에디토리얼)을 고른 뒤 색상과 이미지 크기를 고릅니다
  • 숫자 앞이나 뒤에 ₩나 kWh 같은 통화나 단위를 붙일 수 있습니다
  • PNG 다운로드 또는 SVG 다운로드를 클릭합니다

흐름 쓰는 법

  • 한 줄에 흐름 하나: 예산 [1500] 월세는 예산에서 월세로 1,500이 간다는 뜻입니다.
  • 상자는 이름으로 연결됩니다. 월급 [4200] 예산과 예산 [1500] 월세를 쓰면 예산은 돈이 거쳐 가는 중간 상자가 됩니다. 이름은 매번 똑같이 써야 합니다.
  • 여러 단계도 됩니다: 월급 → 예산 → 저축 → 투자
  • 같은 흐름을 두 번 쓰면 합쳐집니다.
  • 상자에 원하는 색 주기: :저축 #22c55e 같은 줄을 씁니다.
  • 주석: //로 시작하는 줄은 무시됩니다.
  • 숫자는 4200, 4,200, 4200.50 중 어느 형식이든 됩니다.

상자로 들어오는 돈이 나가는 돈보다 많으면(또는 그 반대면) 상자 높이는 더 큰 쪽에 맞춰집니다. 그래서 남는 양을 볼 수 있습니다.

8가지 스타일

  • 클래식 — 깔끔하고 명확해서 보고서와 문서에 적합
  • 미니멀 — 얇은 막대와 옅은 흐름. 색보다 숫자가 중요할 때
  • 볼드 — 두꺼운 막대와 진한 색. 회의실 뒤쪽에서도 잘 보입니다
  • 소프트 — 따뜻한 미색 배경에 둥근 막대. 게시물과 뉴스레터용
  • 아웃라인 — 속이 빈 막대와 아주 옅은 흐름. 잉크를 아끼는 인쇄용
  • 다크 — 남색 배경. 어두운 슬라이드와 대시보드용
  • 네온 — 검은 바탕에 빛나는 흐름. SNS와 표지 슬라이드용
  • 에디토리얼 — 경제 뉴스와 리서치 보고서 같은 느낌. 가지별로 색칠한 부드러운 흐름, 얇고 진한 막대, 가장 작은 항목은 작은 점, 굵은 두 줄 라벨, 그리고 가운데에 큰 헤드라인 숫자로 보여 주는 합계

에디토리얼은 나비넥타이 모양에서 가장 잘 어울립니다. 여러 출처가 가운데의 합계 하나로 모이고, 거기서 다시 그룹과 작은 항목으로 퍼지는 형태입니다. 예: 회사 → *총지출* → 분류 → 공급업체. 가운데 상자는 도구가 알아서 찾습니다.

스타일은 겉모습만 바꿉니다. 흐름, 색상, 크기는 그대로이므로 몇 번의 클릭으로 모든 스타일을 시험해 볼 수 있습니다.

설정

  • 흐름 모양 — 부드러운 곡선 또는 곧은 띠
  • 방향 — 왼쪽에서 오른쪽, 또는 위에서 아래(세로형 휴대폰 이미지와 퍼널에 좋음)
  • 값 표시 — 숫자, 각 상자의 전체 대비 비율, 둘 다, 또는 표시 안 함
  • 색상 — 상자용 색상 세트 5가지
  • 흐름 색 — 시작 상자와 같게, 끝 상자와 같게, 가지별(가운데 이후의 각 그룹이 끝까지 한 가지 색 유지), 둘 사이의 그라데이션, 또는 단색 회색
  • 숫자 앞 / 뒤 — 모든 값에 표시되는 통화 기호나 단위
  • 이미지 크기 — 슬라이드에는 와이드, SNS 게시물에는 정사각형, 휴대폰 화면에는 세로형
  • 상자 너비, 상자 간격, 글자 크기 — 모양을 세밀하게 조정
  • 투명 배경 — 흰 배경이 없는 PNG. 색이 있는 디자인의 슬라이드용

모든 작업은 내 기기에서

다이어그램은 브라우저 안의 작은 스크립트가 그립니다. 흐름 데이터는 업로드되지 않고 온라인에 아무것도 저장되지 않습니다. 마지막 목록은 이 기기에만 기억되므로 다시 와도 그대로 남아 있습니다.

자주 묻는 질문

생키 다이어그램은 어떻게 만드나요?

각 흐름을 한 줄에 하나씩 “출발 [값] 도착” 형식으로 입력하세요. 예: “월급 [4200] 예산”. 입력하는 대로 다이어그램이 나타납니다. 그다음 PNG 다운로드 또는 SVG 다운로드를 클릭하세요.

엑셀로 생키 다이어그램을 만들 수 있나요?

네. 데이터를 세 열(출발, 도착, 값)에 넣고, 행을 복사해서 입력란에 붙여 넣으세요. 머리글 행은 건너뜁니다.

SankeyMATIC과 비슷한가요?

똑같이 간단한 “출발 [값] 도착” 줄을 쓰므로, 거기서 만든 목록을 여기서도 그대로 쓸 수 있습니다. 모든 것이 브라우저에서 실행되고 가입도 필요 없습니다.

흐름 하나가 그려지지 않는 이유는 무엇인가요?

생키 다이어그램은 한 방향으로만 흐르므로 순환(A → B → A)은 그릴 수 없습니다. 도구는 순환을 만드는 흐름을 빼고, 어떤 흐름인지 알려 줍니다.

PNG와 SVG는 어떻게 다른가요?

PNG는 슬라이드, 문서, SNS에 쓰는 일반 이미지입니다. SVG는 벡터 파일이라 어떤 크기에서도 선명하고, Illustrator, Inkscape, Figma, PowerPoint에서 편집할 수 있습니다.

내 데이터가 업로드되나요?

아니요. 다이어그램은 내 기기의 브라우저에서 만들어집니다.

알아 두면 좋은 점

  • 흐름이나 상자 위에 마우스를 올리면 정확한 값이 보입니다
  • PNG는 선택한 크기의 두 배로 저장되어 슬라이드와 큰 화면에서도 선명합니다
  • 막대, 꺾은선, 원형 차트는 차트 만들기를 사용하세요

관련 도구

새로운 도구를 꾸준히 추가하고 있습니다 — 공개될 때 알림을 받으려면 YouTube에서 구독하세요.

다른 도구

전체 보기

추천 앱

전체 보기