캔버스마다 한 종류의 형태만 다룹니다
아이콘, 지도 마커, 장식 선처럼 성격이 다른 스케치를 한 파일에 섞기보다 분리하는 편이 후처리 속도가 더 빠릅니다.
SVG 스케치패드
아름다운 벡터 경로를 만들고 SVG 코드로 바로 내보내세요.
이 도구는 PC 환경에 최적화되어 있습니다.
• 그리기 / 이동: 클릭하여 점 추가. 드래그하여 점 이동.
• 새 선: Command/Ctrl + 클릭으로 끊어진 선 시작.
• 선택: 점 클릭 (빨강), Shift + 클릭 (다중), 또는 Option + 드래그 (박스 선택).
• 편집: 선택된 점들을 함께 이동. Delete/Backspace로 삭제.
• 단축키: 실행 취소 (Cmd+Z), 다시 실행 (Cmd+Shift+Z).
작업 가이드
이 도구는 러프 스케치를 재사용 가능한 자산으로 바꿀 때 가장 가치가 큽니다.
단순히 SVG 하나를 내보내는 것보다, 수정 가능하고 네이밍 가능한 자산으로 남기는 쪽이 더 중요합니다. 다시 그리지 않고도 후속 수정과 전달이 가능한 상태를 만드는 것이 핵심입니다.
파일 이름 붙이기 전에 노드를 먼저 정리합니다
빠르게 내보내고 싶어도 제어점과 불필요한 꺾임을 먼저 줄여두는 편이 나중 수정 비용을 크게 줄여줍니다.
최종본을 고른 이유를 함께 남깁니다
시안이 여러 개라면 어떤 선형을 채택했는지 짧게 적어두세요. 다음 수정 때 예전 패스로 되돌아가는 일을 줄일 수 있습니다.
선 처리, 패스 내보내기, SVG 구조가 기대와 다르게 보이면 contact@1daytools.com로 알려주세요.
SVG 스케치 작업 가이드
SVG Sketchpad는 러프 스케치를 웹에서 바로 벡터 패스로 바꾸고 싶을 때 유용합니다. 아이콘 초안, 별자리 스타일 그래픽, UI 라인 아트처럼 경량 벡터 자산 제작에 적합합니다.
실무에서는 불필요한 노드를 줄이고, 급격한 곡선 구간을 정리한 뒤 밝은/어두운 배경에서 모두 확인하는 것이 좋습니다. SVG는 텍스트 기반이라 최적화와 버전 관리가 쉽습니다.
협업 환경에서는 내보내기 전에 그룹 이름, 경로 ID, 레이어 규칙을 먼저 정리해두면 수정 이력이 명확해집니다. 디자인 전달 이후 프론트엔드 반영 과정에서도 재작업과 커뮤니케이션 비용을 줄일 수 있습니다.
여러 서비스에 같은 자산을 배포한다면 선 두께, viewBox, 네이밍 순서를 프리셋으로 통일해두세요. 출력 기준이 고정되면 QA 확인 속도가 빨라지고 자산 교체 시 오류가 줄어듭니다.
내보내기 체크리스트
- 최종 내보내기 전 불필요한 노드 정리
- 밝은/어두운 배경 모두에서 렌더링 확인
- 후속 수정용으로 그룹/레이어 이름 정리
자주 묻는 질문
그림 데이터가 서버에 저장되나요?
아니요. 드로잉과 SVG 내보내기는 브라우저에서 처리됩니다.
내보낸 SVG 코드를 다시 수정할 수 있나요?
네. 표준 SVG path 데이터이므로 코드 편집기나 벡터 툴에서 수정 가능합니다.
패스가 너무 복잡해지면 어떻게 하나요?
제어점을 줄이고 형태를 여러 개의 단순 경로로 분리해 관리하세요.