45 lines
4.7 KiB
Markdown
45 lines
4.7 KiB
Markdown
# 색면·경계 단순화 작업
|
||
|
||
사용자 요청: 유리를 통과하면서 단순히 해상도가 낮아지거나 흐려지는 대신, 셀 내부의 비슷한 색을 묶고 작은 경계를 정리하여 Ref1~2의 색면 느낌을 시험한다.
|
||
|
||
기존의 일관된 굴절 좌표, 셀 곡면, 시점 반응과 Ref1 | Ref2 비교 영역을 유지한다. 단색 셀이나 다른 사진 조각을 무작위로 배치하는 방식으로 대체하지 않는다.
|
||
|
||
검증 기준:
|
||
- 잔디·털의 작은 무늬가 줄고 큰 색면으로 정리되는지 원본 설정과 같은 구도에서 비교.
|
||
- 눈·코의 어두운 형태와 얼굴 윤곽을 보존.
|
||
- 처리 강도 0에서 기존 결과 복원, Distortion 0과 No Glass 경로 유지.
|
||
- 드래그와 원위치 복귀, 셀 수 변경, 모바일 레이아웃 및 다른 유리 효과 확인.
|
||
- 빌드 성공과 시각적 완성도를 구분하여 기록.
|
||
|
||
수정 전 캡처: dog1-before.png, dog2-before.png, sample-before.png. 테스트 사진은 로컬 검증용이며 게시 허가를 의미하지 않는다.
|
||
|
||
## 구현 결과
|
||
|
||
수정 파일: `src/main.ts`, `src/shaders/mosaic.frag`, `src/shaders/region-palette.frag`, `index.html`.
|
||
|
||
- 기본 조각 유리에 `색면 단순화` 0~1 조절을 추가했다. 기본값 0.65. 촘촘 유리/Reeded/Frosted에는 적용하지 않는다.
|
||
- 같은 굴절 셰이더로 유리 좌표의 셀별 8×8 색상 표본을 만든다. 셀마다 네 대표 색을 결정적으로 초기화하고 두 번 군집 갱신한다.
|
||
- 실제 화면은 원래 해상도로 샘플한다. 가장 가까운 대표 색으로 분류한 뒤, 주변 3×3 표본의 색상 분류 투표로 작은 고립 영역을 정리한다. RGB 공간 평균 블러나 저해상도 이미지 확대가 아니다. 전체 연결 요소를 추적하는 완전한 영역 분할 알고리즘은 아니다.
|
||
- 원래 색과 대표 색을 강도에 따라 혼합하고, 눈·코의 어두운 특징이 크게 밝아지는 경우는 보호한다. 기존 표면 광택은 그 뒤에 적용한다.
|
||
- 정지 사진의 같은 상태에서는 표본과 팔레트를 재사용한다. 시점·사진·depth·구도 등의 상태 변화에는 갱신한다. 영상은 갱신 경로를 유지하되 이번 QA에서 실제 영상은 재생하지 않았다.
|
||
- 장치 최대 텍스처 크기를 넘는 극단적 종횡비는 색면 처리만 건너뛰고 기존 굴절을 출력한다.
|
||
|
||
## 검증 결과
|
||
|
||
- 최종 빌드와 타입 검사 통과. 기존 번들 크기 안내는 남는다.
|
||
- Chrome 실제 WebGL 실행으로 셰이더 오류를 확인하고 수정했다. 최종 실행에서 페이지/셰이더 오류 없음. favicon 404는 기능 오류와 별개로 기존에 남아 있다.
|
||
- dog1/dog2/sample의 강도 0·0.65·1을 같은 구도로 비교했다. 색면이 드러나고 털·잔디의 작은 무늬가 줄며 눈·코는 식별 가능하다. 1은 회화적 느낌이 강해 기본값 0.65를 유지했다.
|
||
- 세 사진 모두 강도0 화면과 수정 전 화면이 모든 픽셀에서 일치했다.
|
||
- 8단계 시점 이동과 원위치 복귀를 캡처했다. 복귀 차이는 RGB 채널 하나에서 값1뿐이었다. 캡처에서 장면 조각의 큰 점프는 보이지 않았지만 모든 연속 프레임의 깜빡임 부재를 보장하는 검증은 아니다.
|
||
- Distortion0/No Glass 중앙150×150 비교는 3개 채널에서 값1 차이. 다른 유리 효과의 강도0/1 비교는 완전히 같거나 값1 이하 반올림 차이뿐이었다.
|
||
- Grid96 출력과 390px 모바일 화면 확인. 가로 넘침 없음, Ref1/Ref2 모두 로드됨. PC 정지 화면의 30개 프레임 간격은 대체로16.7ms였으나 실기기 모바일/동영상/움직이는 고밀도 격자 성능 측정은 아니다.
|
||
- 최종 소스 재빌드 후 세 사진의 기본값을 다시 캡처하고 극단적인 2×2048 사진 입력도 오류 없이 처리했다.
|
||
|
||
최종 화면: `dog1-final.png`, `dog2-final.png`, `sample-final.png`. 기타 근거: `runtime.json`, `pixel-checks.json`, `final-smoke.json`, `motion-*.png`.
|
||
|
||
## 한계와 다음 판단
|
||
|
||
이번 결과는 사용자가 요청한 색면·경계 단순화 실험이다. Ref2의 강한 조각 확대와 동일한 광학적 질감을 달성했다고 판단하지 않는다. 8×8 표본과 셀별 네 색 때문에 고강도에서 색면 경계가 거칠거나 포스터화되어 보일 수 있다. 다음 개선은 사용자가 선호하는 강도에서 색면 크기와 경계 보존 정도를 조정하는 것이다. AI 추론과 실제 모바일 GPU/영상은 이번 변경에서 재검증하지 않았다.
|
||
|
||
실행: 현재 `http://127.0.0.1:5175/`를 새로고침하고 기본 Mosaic의 `색면 단순화`를 조절한다. 개발 실행은 `npm run dev`, 배포 빌드는 `npm run build`.
|