가상실험실 리소스 시연

태블릿·PC 교실 화면 기준 순수 HTML/CSS/JS 외부 리소스 없음

상태 변화 컷 미리보기

기본 상태
유리 비커 레이어
액체 상태 컷
열원 오브젝트

리소스 제어

개발 핸드오프용 레이어명 표시
비커 유리lab_beaker_glass_01
액체 기본lab_liquid_state_a
액체 가열lab_liquid_state_b
증기 효과lab_steam_loop_01
가열 장치lab_burner_base_01

실험 오브젝트는 UI와 분리된 구성 요소로 다루며, 재질과 상태 변화가 개별 파일로 전달되는 흐름을 보여준다.

교육용 보드게임 화면

차례: 하늘

플레이 조작

1

테마 시안

자원 현황

4단계 레이어 구조

1 배경테마별 학습 공간, 조명 방향, 컬러 팔레트 기준
2 프레임게임판 뼈대, 정보 패널, 공통 인터페이스
3 타일일반 칸, 특수 칸, 퀴즈 칸, 거점 카드 연결
4 모션말 이동, 주사위, 코인 획득·차감, 이벤트 반응

레이어를 분리하면 배경 테마 확장, 타일 교체, 애니메이션 구현, 개발 전달 파일 관리가 명확해진다.

모션 가이드 미리보기

10

시작점, 상승 곡선, 도착점, 회전, 스케일 변화를 명세하는 애니메이션 대상 예시다.