dxsworks

샬레 당번

블루 아카이브 3D 모델을 바탕화면 위에서 돌리는 데스크톱 펫

상태
진행 중
기간
2026-10 ~
형태
개인
역할
1인 개발 (기획·렌더링·행동 로직·검사 도구)
스택
Electronthree.js
링크
GitHub

최근 52주 활동

무엇을 하나요

게임 블루 아카이브의 학생 3D 모델을 바탕화면 위에 띄워 두는 Windows 데스크톱 펫이에요. 바탕화면 전체를 비스듬히 내려다본 바닥으로 보고, 캐릭터가 그 위를 앞뒤·대각선으로 걸어 다녀요. 혼자 두면 걷거나 잠깐 총을 들었다 내려놓고, 한동안 건드리지 않으면 낮잠을 자요. 클릭하면 반응하고, 끌어다 다른 자리에 내려놓을 수도 있어요.

학생 모델은 공개 저장소에 올라온 게임 리소스(.glb)를 쓰기 때문에 개인용 팬 프로젝트로만 다루고 있어요.

무엇을 만들었나요

  • 투명한 창에 three.js로 캐릭터를 그리고, 캐릭터가 없는 부분의 클릭은 아래 창으로 그대로 넘기는 펫 창
  • 평소·잠깐 무장·전투 모드·낮잠·집어 들기·퇴장으로 이어지는 행동 상태 머신. 전투 모드에서는 사격·재장전·자세 바꾸기·구르기를 무작위로 섞다가 승리 포즈로 끝내요
  • 메뉴에서 종료하면 위에서 내려온 밧줄을 잡고 화면 밖으로 끌려 올라가는 퇴장 연출
  • 학생 고르기, 크기·항상 위·클릭 효과 설정, 모델의 모든 동작을 골라 재생해 보는 애니메이션 보기 창
  • 설치 파일과 따로 받는 학생 묶음 압축. 지금까지 학생 73명을 검사해 붙였어요

기술적으로 눈여겨볼 점

  • 바탕화면을 바닥으로: 가상 원근 카메라로 바닥 좌표와 화면 좌표를 바꿔 화면 위쪽일수록 작게 보이게 했어요. 창은 화면 전체를 덮지 않고 캐릭터를 따라다녀요. 전체 화면 창도 재 봤지만 GPU 사용량이 두 배쯤 늘어서 지금 방식을 골랐어요.
  • 마우스 통과 판정: 커서 아래 픽셀을 읽어 캐릭터 위에서만 클릭을 받아요. 바로 읽으면 내장 GPU에서 프레임마다 4~7ms씩 멈춰서, 버퍼에 담아 나중에 꺼내는 방식으로 바꾸고 60fps를 지켰어요.
  • 모델마다 다른 동작 데이터: 저장소 모델 295개의 동작 목록을 조사해 지원 현황 표를 만들고, 제각각인 동작 이름(차림 번호, 오타)을 한 규칙으로 맞췄어요. 동작을 새로 만들 때는 glTF 곡선 보간이 깨지지 않게 원래 보간으로 값을 다시 뽑아요.
  • 학생 검사 자동화: 화면 밖 Electron 창에서 가상 시계로 상태 머신을 30분 빨리 돌려, 동작이 창 끝에서 잘리는지·몸이 휙 도는지·멈추는지를 재고 HTML·JSON 리포트로 남겨요. 실제 바탕화면에는 입력을 보내지 않고 시험해요.