| 현재까지 작업 내용과 목표 📋
현재 간단하게 혼자 작업하고 있는 게임이 하나 있습니다.
게임의 내용은 단순하게 랜덤 한 색깔과 일치하는 슬롯을 찾아 무한히 찾는 스코어 경쟁 모드와 Topic별로 흑백의 픽셀아트들을 위와 비슷한 방법으로 일치할 때마다 원래 색을 복원할 수 있는 카운트가 주어지고, 해당 카운트를 이용해서 픽셀아트의 모든 색을 복원하는 갤러리 모드를 구현하고 있습니다.
스코어 경쟁 모드와 갤러리 모드의 구현은 크게 난도가 있는 부분이 아니어서 간단하게 우선 구현해 놓았습니다.
경쟁모드는 한 가지 정도의 개선을 하면 될 듯하고, 갤러리 모드는 좀 더 신경을 써야 할 거 같네요
오늘 작업할 내용도 갤러리 모드 중 픽셀 아트 데이터(json)를 좀 더 개선하는 게 목표입니다.
| 고민 중인 부분 및 아이디어 💡
현재 픽셀 아트 데이터는 크게 토픽, 제목, 난이도, 크기, 썸네일 데이터, 각 픽셀별 원본 컬러, 흑백 컬러에 대한 데이터를 기록하고 있습니다. 픽셀 아트의 데이터를 추출하는 과정에서 위 내용들이 추출을 하게 됩니다.
처음에 구현할 때는 모든 픽셀의 원본, 흑백 데이터를 가지고 있다 보니 json파일의 길이가 거의 천 줄이 넘어가더라고요;;
그래서 알파값이 0인경우는 저장할 필요가 없으니 알파값 0 데이터는 제외하는 대신 각 컬러의 X, Y값을 저장하는 방식으로 수정하여 아래와 같이 데이터 길이를 줄였습니다.
보시는 것처럼 줄어들기는 했지만(?) 아직 데이터를 더 줄일 수 있을 거 같습니다.
현재 생각해 본 아이디어는 각 컬러 값들 중 동일한 컬러값들을 모두 추가하는 것이 아닌, 해당 컬러와 일치하는 좌표 값만 기록하는 방식으로 수정해 볼 생각입니다. 이런 식으로 한다면 중복 컬러들을 모두 기록하는 것이 아닌 좌표 값만 기록하는 것이기 때문에 지금보다 json길이를 줄일 수 있을 거 같습니다.
| 작업 과정 🖥️
1. 브랜치 분기시키기
작업하기 전 별도로 브랜치를 분기를 시켜서 전체 코드에 영향을 주지 않도록 합시다.
develop브랜치에서 modify-gallerymode-datas를 분기시켰습니다.
2. 기존 데이터 클래스들의 네이밍 수정
지금 까지 간단하게 네이밍을 하고 구현을 해두어서, 네이밍이 좀 어지러운감이 있습니다. 우선 이 부분을 먼저 수정해야 할거 같습니다. (분명 이렇게 수정해도 추후에 한 번 더 수정해야 할 일이 분명히 있을 겁니다)
- PixelArtData 클래스
잊지 않고 커밋도 해두었습니다.
위처럼 관련 클래스들의 네이밍을 모두 수정하고 커밋하는 작업 해야 합니다.
- PixelColorData 클래스
- CustomPixel, ColorMatchColor(ColorValue) 클래스
3. 데이터 구조 수정
| PixelCoord 클래스 추가 및 기존 클래스 분리
우선 아이디어 대로 적용을 하기 위해서 기존 X, Y변수를 별도의 PixelCoord 클래스를 추가하고, 기존 클래스에서 동일한 부분을 분리하였습니다.
| 데이터 추출 함수 ExtractPixelData 함수 수정
이제 관련 코드 중. 우선 픽셀 아트 데이터를 추출하는 코드를 수정해 보아야겠네요.
아래는 기존 픽셀 아트 데이터를 추출하는 코드와 수정 후 모습입니다.
| 기존 FillRandomPixel 함수 수정
이제 마지막으로 픽셀 아트의 색을 채우는 로직 부분만 수정 후 일부 버그 난 부분들을 수정하면 완료입니다.
| 작업 결과 ✅
- 수정하기 전 Json 데이터 (파란색 줄이 한 개 픽셀 아트 데이터입니다)
- 수정 후 Json 데이터 (파란색 줄이 한 개 픽셀 아트 데이터입니다)
중복된 컬러값은 픽셀의 좌표만 추가하는 아이디어로 한번 코드를 수정해 보았는데요 다행히 잘 마무리된 거 같습니다.
수정된 데이터 구조를 Firestore에 업로드 후 로드하는 과정까지 모두 테스트가 완료되었습니다.
추가로 픽셀의 원래 색을 채울 때마다 해당하는 데이터가 제거하는 식으로 구현해 두어서 픽셀 아트의 완성도가 높아질수록 Json 데이터의 크기는 더 작아집니다!
| 테스트 플레이!
위에서부터 처음 플레이 시 모습, 어느 정도 진행한 모습, 진행 후 json데이터의 모습입니다
| 다음에 작업할 내용 🕟︎
지금까지 기존 무지성으로 모든 데이터를 저장한 Json을 다이어트시키는 작업을 해보았습니다!
다행히 정상적인 작동을 하는 것을 확인했으니, 다음번엔 갤러리 모드에서 플레이 시 픽셀 아트의 컬러값이 제시되는 것이 아니라 랜덤 한 컬러값들을 제시하는데 이 부분을 수정해 보겠습니다.