바이브코딩으로 만드는 나만의 게임과 학습 도구
2차시 / 전체 6차시
게임 로직 설계하고 구현하기
내가 정한 규칙으로 만드는 내 게임
2게임 로직 설계하고 구현하기
오늘의 흐름 · 45분
00~05분지난 시간 되짚기
05~12분게임 규격과 아이디어
12~36분내 게임 만들기
36~45분올리고 서로 해 보기
시간은 안내일 뿐입니다. 막히는 사람이 많으면 실습 시간을 늘립니다.
2게임 로직 설계하고 구현하기
지난 시간 되짚기
- 말로 설명하면 AI가 코드를 써 준다
- 내 계정과 내 저장소가 생겼다
- 올리면 내 주소로 누구나 열 수 있다
오늘은 같은 방법으로 게임을 만들어 그 주소에 올립니다.
2게임 로직 설계하고 구현하기
오늘 만들 것
내가 정한 게임
주제는 자유입니다. 대신 지켜야 할 규격이 있습니다.
2게임 로직 설계하고 구현하기
게임 규격 — 이것만 지키면 됩니다
- 한 판은 3분 안에 끝난다
- 결과는 숫자 하나(점수)로 나온다
- 점수는 높을수록 잘한 것이다
- 혼자 하고, 마우스나 터치만 쓴다
- 파일 하나로 완결된다
3차시에 기록을 남기고 6차시에 전시관에 올릴 때, 이 규격 덕분에 모두가 같은 기능을 붙일 수 있습니다.
2게임 로직 설계하고 구현하기
규격이 뜻하는 것
게임 내용은 자유입니다. 끝날 때 숫자 하나가 나오기만 하면 됩니다.
2게임 로직 설계하고 구현하기
왜 3분일까
규모 제한은 규칙이 아니라 좋은 게임의 조건으로 생각하세요.
2게임 로직 설계하고 구현하기
아이디어가 없다면
워크벤치에 12가지가 더 있습니다. 골라도 되고 바꿔도 됩니다.
2게임 로직 설계하고 구현하기
시연
게임 설명 부분만 내 것으로 바꾸고, 규격 부분은 그대로 둡니다.
2게임 로직 설계하고 구현하기
이제 직접
24분, 내 게임 만들기
먼저 돌아가게 만들고, 그다음에 재미를 더하세요.
캔버스에서 바로 해 보면서 고치면 됩니다.
2게임 로직 설계하고 구현하기
막혔을 때 쓰는 말
- "버튼을 눌러도 아무 일도 안 일어나. 왜 그런지 찾아서 고쳐 줘."
- "화면이 하얗게만 나와. 고쳐 줘."
- "연속으로 성공하면 점수가 더 오르게 해 줘."
- "시간이 지날수록 조금씩 빨라지게 해 줘."
캔버스에서는 고칠 부분만 말하면 됩니다. 전체 코드를 다시 달라고 하지 않아도 됩니다.
2게임 로직 설계하고 구현하기
오늘 끝나기 전에
- 코드를 받아 game.html로 이름을 바꾼다
- 내 저장소에 업로드하고 Commit한다
- 내 주소 / game.html로 열어 본다
- 옆자리 친구에게 주소를 알려 주고 한 판 하게 한다
친구가 내 주소에서 게임을 하는 순간이 오늘의 목표입니다.
2게임 로직 설계하고 구현하기
다음 시간
점수가 사라지는 문제
오늘 올린 게임을 다시 열어 보세요. 점수가 남아 있을까요?