OUTPUT SPECS

한 이미지로 만드는
4종 JPG의 차이

“SNS용” 같은 이름만으로는 결과를 판단하기 어렵습니다. DrowPack이 ZIP 안에 넣는 실제 파일명, 긴 변 제한, 워터마크 여부와 JPG 품질 계산을 현재 구현값에 맞춰 정리했습니다.

작성 2026-07-19현재 app.js 구현 기준예상 읽기 6분
먼저 알아둘 점

네 결과물은 고정된 가로×세로 틀로 강제 자르지 않습니다. 원본 비율을 유지한 채 긴 변이 각 한도를 넘는 경우에만 축소합니다. 원본이 한도보다 작으면 임의로 확대하지 않습니다.

네 파일의 실제 규격

ZIP 생성 버튼을 누르면 현재 미리보기 canvas를 기준으로 아래 네 작업을 각각 실행합니다. 모두 JPG이지만 목적에 따라 긴 변, 품질 보정, 워터마크가 다릅니다.

ZIP 내부 파일명긴 변 상한품질 계산워터마크권장 용도
artwork_social.jpg1600px슬라이더 값, 최대 98없음일반 SNS 게시와 빠른 공유
artwork_portfolio.jpg2200px슬라이더 +2, 최대 99없음세부 묘사를 보여주는 포트폴리오
artwork_sample_watermark.jpg1600px슬라이더 −4, 최소 82DrowPack SAMPLE커미션·작업 샘플 미리보기
artwork_thumbnail.jpg600px슬라이더 −6, 최소 80없음목록, 카드, 작은 미리보기

예를 들어 기본 품질 94를 사용하면 브라우저 JPG 인코더에 전달되는 값은 SNS 0.94, 포트폴리오 0.96, 샘플 0.90, 썸네일 0.88입니다. 이는 “파일 용량이 정확히 몇 MB가 된다”는 뜻이 아닙니다. 실제 용량은 색 변화, 노이즈, 투명 배경 합성 결과와 브라우저 인코더에 따라 달라집니다.

긴 변 기준으로 축소하는 이유

세로 그림과 가로 그림을 같은 고정 해상도로 만들면 한쪽 방향이 찌그러지거나 강제로 잘릴 수 있습니다. DrowPack은 현재 canvas의 가로·세로 중 큰 값을 기준으로 비율을 계산합니다.

  1. 현재 canvas 크기를 읽습니다. 사용자가 리사이즈를 적용했다면 변경된 canvas가 기준입니다.
  2. 가로와 세로 중 긴 변을 찾습니다. 이 값이 출력 상한보다 작거나 같으면 원본 크기를 유지합니다.
  3. 상한을 넘을 때만 축소 비율을 계산합니다. 가로와 세로에 같은 비율을 적용해 종횡비를 보존합니다.
  4. 고품질 리샘플링 옵션에 따라 그립니다. 큰 폭으로 줄일 때는 중간 크기를 거치는 단계 축소가 경계 손실을 줄이는 데 유리합니다.
ZIP을 만들기 전 canvas를 확인하세요

패키지는 처음 업로드한 원본 파일을 다시 읽는 것이 아니라 화면의 현재 미리보기 canvas를 출발점으로 사용합니다. AI 편집이나 직접 리사이즈를 적용했다면 그 결과가 네 JPG에도 반영됩니다.

품질 슬라이더를 고르는 실용 기준

JPG 품질을 무조건 100으로 올리면 파일은 커지지만 모든 그림이 눈에 띄게 좋아지는 것은 아닙니다. 평평한 색면과 굵은 선은 높은 압축에서도 비교적 안정적이고, 작은 글자·가는 선·질감이 많은 그림은 블록이나 링잉이 먼저 보일 수 있습니다.

원본 특성시작 권장값확인할 부분조정 방향
굵은 선, 단순 색면88–92외곽선 주변 얼룩문제가 없으면 낮춰 용량 절약
일반 일러스트92–95눈, 머리카락, 작은 장식세부가 무너지면 1–2씩 올림
텍스트 포함 포스터94–97작은 글자의 획과 대비 경계글자가 흐리면 PNG 저장도 비교
사진·그라데이션90–94하늘·피부 같은 부드러운 변화밴딩이 보이면 조금씩 올림

품질 수치는 절대 점수가 아니라 인코더 입력값입니다. 최종 선택은 실제 사용 크기에서 보고 결정해야 합니다. 특히 600px 썸네일은 원본 확대 화면보다 목록에서 읽히는 실루엣과 대비가 더 중요합니다.

패키지를 만들기 전 5단계

  1. 권리와 최종본을 확인합니다. 본인이 만들었거나 사용할 권한이 있는 이미지만 선택합니다.
  2. 투명 배경을 미리 확인합니다. JPG는 투명을 보존하지 못하므로 최종 배경색이 의도와 맞는지 살핍니다.
  3. canvas 크기를 확인합니다. 지나치게 큰 원본은 먼저 비율 유지 리사이즈로 작업 크기를 정합니다.
  4. 품질을 정하고 ZIP을 생성합니다. 기본값부터 시작해 대표적인 작은 디테일 한두 곳을 비교합니다.
  5. ZIP 안의 네 파일을 각각 엽니다. 파일명, 픽셀 크기, 샘플 워터마크, 썸네일 가독성을 확인합니다.

다운로드 후 검수 체크리스트

  • 네 파일의 종횡비가 원본과 같은가
  • 포트폴리오 파일이 필요 이상으로 확대되지 않았는가
  • 샘플 파일에 워터마크가 보이되 작품의 핵심을 완전히 가리지 않는가
  • 썸네일을 100% 크기로 봤을 때 주제가 바로 읽히는가
  • 가는 선과 작은 글자 주변에 JPG 압축 얼룩이 과하지 않은가
  • 공개해서는 안 되는 레이어·개인정보·서명이 남아 있지 않은가

특정 플랫폼의 권장 해상도는 바뀔 수 있습니다. DrowPack의 네 출력은 반복 저장을 줄이는 일반 목적 프리셋이며, 제출처가 별도 픽셀 규격을 요구한다면 해당 규격을 우선해야 합니다.

다음에 읽을 가이드

이미지 패키지와 SVG는 목적이 다릅니다. 편집 가능한 선과 면이 필요한지부터 구분해 보세요.