Scratch 벡터 변환: 여전히 픽셀이 보이는 이유
Scratch의 Convert to Vector는 비트맵을 추적하지 않고 편집 모드만 바꿉니다. 모양의 점을 확인해 해결 방법을 선택하고 가져온 SVG를 사용 전에 살펴보세요.
목차
Scratch의 Convert to Vector 버튼은 비트맵 모양의 윤곽을 추적하지 않습니다. 래스터 도안을 벡터 편집 모드로 옮기지만 하나의 이미지 객체로 남을 수 있습니다. 그래서 버튼을 눌러도 PNG 모양에서 픽셀이 계속 보일 수 있습니다. 현재 Scratch 그림 편집기 소스는 이 작업에서 래스터 객체를 유지하며 색상 영역을 경로로 재구성하지 않습니다.
모양을 부분별로 바꾸거나 색을 바꾸려면 새로 그리거나 추적한 벡터 도형이 필요합니다. 의도적인 픽셀 아트라면 비트맵을 유지하는 것이 맞을 수 있습니다. 선택한 모양을 먼저 확인한 뒤 프로젝트에 필요한 재구성 범위를 정하세요.
버튼이 바꾸는 것
스프라이트의 Costumes 탭을 열고 확인할 모양을 선택하세요. 변환 버튼은 전환할 대상 모드를 표시합니다. 비트맵 모드에는 Convert to Vector, 벡터 모드에는 Convert to Bitmap이 나타납니다.
모드를 바꾸면 다른 편집 도구를 사용할 수 있습니다. 캔버스의 모든 객체에 편집 가능한 윤곽이 생겼다는 뜻은 아닙니다. 벡터 모양에는 직접 그린 도형과 래스터 이미지가 함께 들어 있을 수 있습니다. 기본적인 차이는 래스터 이미지가 포함된 SVG 안내에서 설명하는 것과 같습니다.
실험 전에 원본 모양 사본을 보관하세요. 특히 그린 벡터 도안을 비트맵으로 바꾸면 형상이 픽셀로 평면화됩니다. 이후 다시 전환해도 예전 점은 복원되지 않습니다. 도형이 다시 필요하다면 실행 취소나 보존한 원본을 사용하세요.
세 가지 방법으로 모양 확인하기
경계 상자만으로는 알 수 있는 것이 적습니다. 그림에도 벡터 도형 그룹에도 있을 수 있습니다. 실제로 편집할 부분을 확인하세요. 다음 진단은 로켓을 예로 들지만 동물, 배지나 수업용 아이콘에도 적용할 수 있습니다.
- 윤곽 확인: 복제한 모양에서 Reshape를 선택하고 로켓 날개의 가장자리를 클릭하세요. 사각형 주위의 핸들이 아닌 해당 가장자리를 따르는 점이 있는지 보세요. 도안이 그룹이라면 선택하고 가능할 때 Ungroup을 사용한 후 부분을 확인하세요. Reshape를 올바르게 쓰는지 모르겠다면 도안 옆에 임시 원을 그리고 도구의 선택 방식을 비교하세요.
- 색상 하나 확인: 로켓 머리 부분을 선택하고 Fill을 바꿔 보세요. 몸통이나 다른 부분을 바꾸지 않고 해당 영역의 색을 바꿀 수 있나요? 시험 편집을 되돌리세요. 그림에 여러 색이 보여도 이미지 전체 선택은 독립적으로 편집 가능한 머리 부분을 제공하지 않습니다.
- 표시할 위치에서 확인: 편집기의 모양과 프로젝트에서 사용할 크기로 Stage에 표시된 모습을 비교하세요. 윤곽 편집 가능성과 화면 선명도는 별도 확인입니다. Stage 미리보기가 거칠다는 이유만으로 이미 유용한 경로가 있는 도안을 추적할 필요는 없습니다.
| 확인 결과 | 다음 확인 사항 | 유용한 다음 단계 |
|---|---|---|
| PNG에서 만든 모양이며 색상 가장자리에 점이 없음 | 이미지 위에 새로 그린 도형이 아닌 이미지를 확인하는지 | 비트맵 유지, 다시 그리기 또는 원본 이미지 추적 |
| 도안이 그룹으로 선택됨 | 가능하다면 그룹을 해제하고 구성 요소 확인 | 다른 변환 전에 기존 도형 편집 |
| 일부에는 점이 있고 일부는 그림으로 남음 | 편집해야 하는 특정 영역 식별 | 나머지가 적절하다면 해당 래스터 영역만 재구성 |
| 도형에 점이 있지만 Stage에서만 거칠게 보임 | 목표 표시 크기와 원본 SVG 비교 | 도안을 교체하기 전에 표시 방식 조사 |
마지막 경우에는 SVG 픽셀화 진단이 파일 내용과 애플리케이션의 표시 방식을 구분하는 데 도움을 줍니다.
도안에 맞는 해결 방법 선택하기
픽셀이 디자인의 일부라면 비트맵 유지하기
작은 픽셀 캐릭터는 벡터 파일이라는 이유만으로 더 좋은 모양이 되지 않습니다. 계단형 가장자리, 작은 눈과 제한된 팔레트가 의도된 것이라면 사용할 크기에서 판단하세요. 원본 이미지를 보관하고 실험 중 반복적인 크기 조정을 피하세요.
개별 윤곽 편집보다 질감이 중요한 사진이나 그린 배경도 마찬가지입니다. 세부 요소를 도형으로 추적하면 도안이 달라집니다. SVG 안에서 네모난 픽셀을 보존하는 것은 실루엣을 매끄럽게 하는 것과 다른 작업입니다. 픽셀 아트 변환 안내가 선택을 설명합니다.
Scratch 벡터 도구로 단순한 모양 다시 그리기
몸통, 머리, 창과 날개로 된 로켓은 각 부분을 따로 그리면 구조를 직접 제어할 수 있습니다. 벡터 모드에서 새 모양을 그리기 시작하세요. 원, 사각형, 선과 브러시 도구로 주요 부분을 만들고 Reshape로 윤곽을 조정하세요.
가장 큰 실루엣에서 안쪽으로 작업하세요. 목표 크기에서 몸통을 명확히 알아볼 수 있게 된 뒤 작은 창을 추가하세요. 날개를 독립적으로 이동해야 한다면 별도 객체로 두세요. 이는 디자인 선택입니다. 자동 추적은 이후 편집에 어떤 조각이 필요한지 결정할 수 없습니다.
외부 벡터 편집기로 도형을 만들 수도 있습니다. Pinnguaq의 원본 Scratch 벡터 아트 튜토리얼은 SVG 가져오기, 구성 요소 선택, 채우기 변경과 요소 배치를 보여 줍니다. 이런 편집 가능한 구조를 목표로 하세요.
원본이 래스터뿐이라면 적절한 클립아트 추적하기
보존할 평면 일러스트가 이미 있지만 모든 윤곽을 다시 그리는 것은 불필요할 때 추적이 유용합니다. 가진 것 중 가장 선명한 PNG나 JPG 원본을 사용하세요. PerfectVector는 적절한 클립아트를 SVG 경로로 재구성해 Scratch로 가져오기 전에 확인할 수 있게 합니다. 목적은 원본 그림에서 편집 가능한 도형을 복원하는 것입니다. 이후에도 모양의 편집 가능성을 확인해야 합니다.
추적은 보이는 영역을 따릅니다. 날개를 여러 조각으로 나누거나 따로 움직이려던 서로 맞닿은 영역을 합칠 수 있습니다. 작은 눈, 좁은 틈과 글자는 특히 주의하세요. 재구성 원리를 이해하고 싶다면 이미지 벡터화 설명부터 참고하세요.
SVG 가져오기와 모양 중심 확인하기
Scratch의 모양 업로더는 SVG를 벡터 도안으로 허용합니다. 스크린샷이나 PNG 미리보기 대신 다운로드한 SVG 자체를 가져오세요.
- 기존 스프라이트를 선택하고 Costumes를 여세요. 모양 선택기의 Upload Costume으로 원본 옆에 SVG를 추가하세요. 별도 스프라이트가 필요하다면 Upload Sprite를 사용하세요.
- 가져온 도안을 원본과 비교하세요. 외곽선, 부분 사이의 틈, 눈과 배경을 확인하세요. 원본에 이미 벡터 도형이 있다면 래스터 미리보기를 추적하지 말고 SVG를 수정하거나 다시 내보내세요.
- 윤곽과 단일 색상 확인을 반복하세요. 필요한 부분을 편집할 수 있는지 확인한 뒤 시험 편집을 되돌리세요. 작업 사본에서 임시 비교 도형을 제거하세요.
- 모양 편집기의 중심 십자선을 기준으로 배치를 확인하세요. 관련 모양에서 같은 시각적 기준점을 유지하세요. 로켓에는 몸통 중앙을 쓸 수 있습니다. 필요에 따라 도안을 조정하고 Stage에서 원본 모양과 비교하세요.
- 스프라이트를 움직이지 않고 원본과 대체 모양을 전환하세요. 원치 않는 위치 이동, 겉보기 크기 변화나 배경 사각형을 찾으세요. 대체 모양에 만족할 때까지 원본을 보관하세요.
Scratch는 각 모양의 회전 중심을 저장합니다. 모양 불러오기 코드는 중심이 제공되지 않으면 렌더러에서 얻습니다. 따라서 보이는 그림이 일치하는 것은 가져오기 확인의 일부입니다. 모양 중심에 대한 위치도 프로젝트에 맞아야 합니다.
FAQ
Convert to Vector를 사용하면 Scratch 모양의 픽셀화가 줄어드나요? 비트맵 윤곽을 추적하거나 매끄럽게 하지 않습니다. 모양의 편집 모드는 바뀌지만 래스터 도안은 이미지 객체로 남을 수 있습니다. 편집 가능한 외곽선을 만들려면 다시 그리거나 추적 경로가 있는 SVG를 가져오세요.
모양을 이동할 수 있지만 가장자리를 바꿀 수 없는 이유는 무엇인가요? 이미지 객체 이동에는 보이는 윤곽의 점이 필요하지 않습니다. 그룹을 선택했는지 확인한 뒤 Reshape로 구성 요소를 살펴보세요. 벡터 모드에 남은 비트맵에는 모드 전환으로 윤곽 점이 생기지 않습니다.
스프라이트를 추적하면 별도 팔, 다리나 다른 움직일 부분이 생기나요? 그렇다고 생각하지 마세요. 추적은 보이는 영역을 재구성하며 움직일 부분과 다를 수 있습니다. 가져온 도형을 확인하고 필요에 따라 구성 요소를 분리하거나 다시 그리세요.
Sources
- Scratch Foundation: 비트맵 변환 구현 — 래스터를 유지하는 벡터 편집 모드 전환.
- Scratch Foundation: 모양 파일 업로더 — SVG 모양 업로드가 벡터 자산 형식을 사용함을 확인.
- Scratch Foundation: 벡터 모양 불러오기 — 가져온 모양에 회전 중심을 지정하는 방법.
- Pinnguaq: Scratch에서 벡터 그래픽 아트 작업 — SVG 가져오기와 개별 도형, 채우기 및 배치 편집.
모양이 평면 래스터 클립아트에서 시작했고 편집 가능한 윤곽이 필요하다면 PerfectVector로 원본 이미지를 SVG로 변환하세요. 결과를 새 모양으로 가져온 뒤 원본을 교체하기 전에 외곽선 하나, 색상 하나와 모양 중심을 확인하세요.
