🎮 자막 감지 기반 미니게임 만들기¶
“선생님” 자막이 나오면 5초 안에 버튼을 눌러라!¶
이 튜토리얼에서는 음성을 영상처럼 만들고 자막 달기
에서 만든 프로젝트를 그대로 이어서 사용합니다.
이전 챕터에서는 다음을 완성했습니다:
- UI 배경 이미지 설정
- 오디오 불러오기
- Whisper로 자막 생성
- 번역 자막 생성
이번에는 그 자막을 실제 게임 요소로 활용해
"특정 단어 등장 → 반응 시간 제한 → 성공/실패 분기"
구조를 가진 작은 미니게임 시스템을 만듭니다.
예제로 사용할 작업은 아래 체험판입니다:
https://www.dlsite.com/home/work/=/product_id/RJ01323001.html
(블루아카이브 카즈사 / 체험판)
블루아카이브에서는 주인공을 “선생님”이라고 부르기 때문에
자막 감지 예제로 아주 적합합니다.
🧭 전체 구조 미리보기¶
자막에 “선생님” 이라는 단어가 나오면:
- 전역 변수 SenseiFlag ← 1
- 버튼 UI 표시
- 5초 동안 기다림
- 버튼을 누르면 성공
- 누르지 않으면 트랙 종료(실패)
1️⃣ 자막 타입 먼저 수정하기 (중요!)¶
이번 미니게임은 자막에서 특정 단어(“선생님”)가 등장한 순간을 감지해야 합니다.
그런데 이전 챕터에서 만들어둔 자막은 기본적으로 전체 문장이 한 번에 표시되는 타입입니다.
이 방식은 “앞으로 어떤 단어가 나올지”를 미리 알 수 있기 때문에
실제 감지 타이밍이 부정확해지는 문제가 생깁니다.
그래서 반드시 자막 타입을 TypeWriter 방식으로 변경해야 합니다.
✔ TypeWriter 자막의 특징¶
- 자막이 전체 시간에 맞춰 한 글자씩 출력됨
- 아직 표시되지 않은 글자는 감지할 수 없음
- 따라서 “선생님”이라는 단어가 등장하는 정확한 순간을 잡아내기 좋음
- 미니게임·단어 감지·호흡 싱크 등에서 가장 적합한 자막 타입
📌 TypeWriter 타입으로 변경하는 법¶
- 타임라인에서 오디오를 더블클릭하여 음성 편집 화면으로 이동
- 자막 목록으로 이동
- Ctrl + A 눌러 모든 자막 선택
- 우측 하단의 Animation → TypeWriter 를 클릭해 타입 변경
이제 모든 자막이 “한 글자씩 보여주는 방식”으로 바뀌었고
특정 단어가 등장하는 순서를 정확하게 감지할 수 있습니다.
1️⃣ UI 만들기 (반응 버튼)¶
- UI 탭 → 새 UI
- Button 컨트롤을 가운데 배치
- 버튼 Text = "선생님!" 또는 "PRESS!"
이전 챕터에서 배운 UI 제작 방식과 동일합니다.
TIP
버튼은 화면 중앙 정렬로 두면 미니게임 UI처럼 자연스럽습니다.
2️⃣ 전역 변수 만들기¶
- 좌측의 리소스관리 탭의 변수
- 십자 버튼
- 이름: SenseiFlag
- 초기값: 0
이 변수는 입력 대기 상태인지 판단하는 핵심 역할을 합니다.
값 의미:
0 = 대기 중 아님
1 = "선생님" 감지됨 → 5초 안에 누르기 모드
3️⃣ 자막 감지 스크립트 만들기¶
이번 단계에서는
자막에 “선생님” 이라는 단어가 등장했을 때 자동으로 실행되는
감지 스크립트를 구성합니다.
이 스크립트는 다음과 같은 흐름으로 작동합니다:
- 자막에 “선생님”이 포함되었는지 확인
- 포함되었다면 글로벌 변수 SenseiFlag ← 1
- 5초 동안 대기
- 5초 동안 버튼을 누르지 않았다면 실패 처리(트랙 종료계열로 이동)
📌 스크립트 구성 방법¶
- Script 탭 → 새 스크립트(New Script)
- 스크립트 이름: SenseiTrigger
- 아래 구조대로 스크립트를 구성합니다.
✔ 1단계: 자막에 “선생님”이 포함되었는지 검사¶
조건문을 추가하고 다음과 같이 설정합니다:
조건
- 자막에 [선생님]이 포함된 경우입니다.
만족
- 변수 [SenseiFlag] 를 [1] 만큼 [대입]합니다. [0초 동안 진행됩니다.]
- 시간 [5]초 만큼 대기합니다.
이렇게 하면 “선생님”이 등장한 순간에만 SenseiFlag 값이 1이 됩니다.
✔ 2단계: 5초 후에도 SenseiFlag가 여전히 1인지 확인 (실패 판정)¶
첫 번째 조건문 아래에 또 하나의 조건문을 추가합니다.
조건
- 변수 [SenseiFlag] 이 [1] 보다 [같음]일 경우입니다.
만족
- 현재 트랙의 시간을 [420]초로 변경합니다.
(트랙 맨 끝으로 이동하는 효과)
즉, 플레이어가 버튼을 누르지 않으면
SenseiFlag가 1 그대로이기 때문에 실패 처리됩니다.
📌 전체 구조 예시¶
아래는 완성된 구조의 모습입니다:
(이미지 예시)
위와 동일하게 구성하면
자막에 “선생님”이 등장 → 5초 카운트 → 무반응이면 엔딩으로 이동
이라는 흐름이 완성됩니다.
5️⃣ 버튼 Click 스크립트 만들기¶
UI 화면에서 버튼을 선택하고:
오른쪽 패널 → Script → Click → 편집
아래 스크립트를 구성합니다.
✔ 성공 조건: SenseiFlag == 1 일 때¶
조건: SenseiFlag == 1
SenseiFlag ← 0
Play Sound (성공 효과음)
사용자가 제때 눌렀음을 의미합니다.
✔ 늦게 누른 경우: SenseiFlag == 0 일 때¶
조건: SenseiFlag == 0
Jump Track(실패 지점)
사용자가 너무 늦게 눌렀거나,
이미 실패 판정이 난 후에 눌렀다는 의미입니다.
🧪 전체 흐름 정리 (요약)¶
🔷 자막 감지 스크립트 (SenseiTrigger)¶
SenseiFlag ← 1
UI Show
특정 시간만큼 5초 대기
If SenseiFlag == 1:
Jump Track(end)
🔷 버튼 클릭 스크립트¶
If SenseiFlag == 1:
SenseiFlag ← 0
Play Sound(success)
Else:
Jump Track(end)
🎉 최종 결과¶
이제 프로젝트는 다음처럼 동작합니다:
- “선생님” 자막 등장 → 버튼 팝업
- 사용자는 5초 안에 눌러야 함
- 제때 누르면 성공
- 늦으면 실패
- beginner-audio-to-video 에서 만든
“오디오 + 자막 + UI 배경” 프로젝트 기반으로 자연스럽게 확장됨
이 예제는 VSP의 모든 기능이 결합된
미니 게임형 인터랙티브 시스템의 기본 골격이 됩니다.