📱 스캔하여 접속

과학 웹앱
프롬프트 스튜디오

시뮬레이션 사양을 정밀하게 세팅하면, 완성도 높은 웹앱 제작 프롬프트를 자동으로 생성합니다.

진행도 0/9
시작

기본 정보

제작할 웹앱의 형태와 학습 맥락을 정의합니다.

웹앱 스타일 ?
여러 스타일을 함께 선택할 수 있어요. (예: 시뮬레이션 + 게임 = 게임처럼 도전하는 시뮬레이션)
웹앱 주제 ?
학년 ?
단원 ?
학습 목표 ?
실험/활동 구성 ?

기술 스택

렌더링 방식과 코드 구조를 결정합니다.

렌더링 방식 ?
물리 계산 정확도 ?
파일 구조 ?

UI / UX

시각적 디자인과 화면 구성 방식을 정합니다.

레이아웃 방식 ?
💡 화면을 어떻게 나눌지 정합니다. 모바일에서는 자동으로 세로 1열로 변환돼요.
🎨 표처럼 자유롭게 화면 분할하기
1. 카드를 드래그해서 셀에 떨어뜨리기  ·  2. 셀 클릭 → 병합·분할  ·  3. 행/열 사이 ↔ ↕ 라인을 드래그해서 크기 조절  ·  4. 도구바에서 행/열 추가
📦 영역 카드 (드래그해서 셀에 놓기)
2 × 2
선택된 셀
빠른 시작:
반응형 지원 ?
선택한 환경에서 모두 정상 작동하도록 100dvh, flex 체인, autoFitText() 패턴이 적용됩니다.
디자인 스타일 ?
색상 톤 ?
UI 보조 요소 ?

인터랙션

학생의 조작 방식과 동작 디테일을 정합니다.

조작 방식 ?
터치 지원 방식 ?
애니메이션 ?
측정/기록 기능 ?

사운드

Web Audio API로 외부 음원 없이 효과음을 합성합니다.

사운드 사용 여부 ?
필요한 효과음 ?
oscillator/noise 합성 방식이라 외부 파일 다운로드가 없습니다.

코드 규칙

코드 스타일과 추가 요청·금지사항을 명시합니다.

코드 주석 언어 ?
코드 품질 요구사항 ?
추가 요청사항 ?
금지 사항 ?

생성된 프롬프트

0자