인터랙티브 3D 구미 시트러스 슬라이스

WebGPU를 사용해 아름답고 인터랙티브한 3D 구미 시트러스 슬라이스를 제작하세요. JavaScript와 WGSL 셰이더를 포함한 완전한 경험을 하나의 독립 실행형 HTML 파일로 제공하세요. 동영상, 이미지 또는 반복 애니메이션이 아닌 실시간 3D 시뮬레이션이어야 합니다. APPEARANCE 반투명하고 과즙감 있는 과육, 뚜렷한 8개 조각, 섬세한 내부 막, 작은 기포, 옅은 알베도층, 부드러운 오렌지색 껍질을 갖춘 두꺼운 반원형 오렌지 슬라이스를 만드세요. 고급 구미 캔디처럼 보이게 하세요. 채도 높은 색상, 윤기 나는 하이라이트, 과육을 통과하는 빛, 설득력 있는 굴절, 부드러운 접촉 그림자를 표현하세요. 과도한 블룸, 바랜 색상, 딱딱한 플라스틱 같은 외관은 피하세요. 따뜻하고 밝은 스튜디오 배경과 여백을 넉넉히 둔 깔끔한 에디토리얼 인터페이스를 사용하세요. 크고 이탤릭체인 세리프 제목 “Citrus Jelly”를 추가하세요. 컨트롤은 간결하게 유지하고 슬라이스가 잘 보이도록 하세요. 소프트 바디 물리 젤리 같은 촉감이 가장 중요합니다. - 마우스나 손가락으로 슬라이스의 어느 부분이든 잡을 수 있어야 합니다. - 당기고, 들어 올리고, 늘리고, 비틀었다가 놓을 수 있어야 합니다. - 변형은 국소적으로 적용하세요. 한쪽 가장자리를 당기면 주변 과육이 늘어나고 나머지 부분은 자연스럽게 따라와야 합니다. - 놓은 뒤에는 슬라이스가 흔들리고, 원래 위치를 지나쳐 반응한 다음, 점차 원래 형태로 돌아와야 합니다. - 중력, 관성, 감쇠, 지면 충돌, 부드러운 바운스를 포함하세요. - 부피를 대략적으로 유지하고 메시가 무너지거나 뒤집히지 않도록 하세요. - 껍질은 과육보다 약간 단단하게 설정하세요. - 내부 조각, 막, 기포는 변형을 따라 움직여야 하며 바디 바깥으로 떠다니면 안 됩니다. XPBD 제약 조건을 적용한 사면체 메시처럼 안정적인 볼류메트릭 소프트 바디 솔버를 사용하세요. 전체 오브젝트를 단순히 스케일링하거나 회전해 부드러운 느낌을 흉내 내지 마세요. CONTROLS 색상 프리셋 3가지를 포함하세요: 오렌지, 레몬, 루비. 다음 기능을 추가하세요: - 탄성 슬라이더. - 내부 감쇠 슬라이더. - “살짝 건드리기” 버튼. - 초기화 버튼. - 1/4배속 체크박스. - 메시 표시 체크박스. - 일시정지/재생 버튼. 질량, 초기 부피 대비 비율, 운동 에너지를 작은 실시간 수치로 표시하세요. 기술 요구 사항 WGSL 셰이더를 사용해 진정한 WebGPU 렌더링을 구현하세요. 외부 모델이나 이미지 파일을 가져오지 말고 모든 지오메트리와 시각적 디테일을 프로시저럴 방식으로 생성하세요. 시뮬레이션 업데이트는 렌더링 프레임 레이트와 독립적으로 동작해야 합니다. 데스크톱과 터치 디바이스를 지원하세요. WebGPU를 사용할 수 없는 경우 명확한 대체 안내 메시지를 표시하세요. 강하게 드래그하는 동작, 반복해서 놓는 동작, 모든 컨트롤, 좁은 화면을 테스트하세요. 완성된 HTML을 제공하기 전에 불안정한 물리, 깨진 지오메트리, 시각적 아티팩트를 수정하세요. 완성된 결과물은 직접 만지고 놀 때 진정으로 만족감을 주는 작고 촉감적인 캔디 실험처럼 느껴져야 합니다.