← 돌아가기: 워크숍 메인 페이지

코딩 지식 없이, AI에게 명확한 요구사항을 전달하여 완전한 결과물을 얻고 실행시키는 경험을 합니다.

AI 페어 프로그래밍: - AI를 프로그래밍 파트너로 활용하는 개발 방식 - 인간: 아이디어와 요구사항 제시 - AI: 코드 작성과 기술적 구현 - 협업을 통한 빠른 프로토타입 개발

핵심 원칙: - A→B→C 프로세스: 구상(A) → AI 구현(B) → 검증(C) - 기획력이 핵심: 중요한 것은 코딩이 아니라 '무엇을 만들지' 구상하는 능력 - 명확한 소통: 원하는 결과를 구체적으로 설명 - 자괴감 극복: AI가 코드를 짜줘도 전체 프로젝트를 구상한 것은 당신 - 기술 격차 해소: 코딩을 몰라도 논리적 사고만 있으면 충분

AI에게 다음과 같이 요청해보세요:

"웹브라우저에서 실행되는 간단한 클릭 게임을 만들어주세요.

게임 규칙:
1. 화면에 버튼이 하나 있습니다
2. 버튼을 클릭하면 점수가 1점씩 올라갑니다
3. 현재 점수를 화면에 표시합니다
4. 배경은 파란색, 버튼은 빨간색으로 해주세요
5. 버튼 텍스트는 '클릭하세요!'로 해주세요

HTML, CSS, JavaScript를 모두 하나의 파일에 작성해주세요."

1. AI가 생성한 코드를 복사합니다 2. 메모장이나 텍스트 에디터를 열어서 붙여넣기 합니다 3. 파일을 `click_game.html`로 저장합니다 4. 파일을 더블클릭하여 웹브라우저에서 실행합니다

예상 결과: 클릭할 때마다 점수가 올라가는 게임

게임이 작동하는 것을 확인했다면, AI에게 다음과 같이 개선을 요청해보세요:

"게임을 더 재미있게 만들어주세요:

1. 버튼을 클릭하면 버튼 색깔이 잠깐 바뀌었다가 원래대로 돌아오게 해주세요
2. 클릭할 때마다 '딩!' 소리가 나게 해주세요 (소리는 브라우저 기본 기능 사용)
3. 점수가 10점이 되면 '축하합니다!' 메시지를 표시해주세요
4. 리셋 버튼을 추가해서 점수를 0으로 초기화할 수 있게 해주세요"

"완전히 작동하는 벽돌깨기 게임을 만들어주세요.

게임 기능:
1. 하단에 마우스로 조작하는 패들
2. 튕기는 공 (패들, 벽, 천장에 부딪히면 튕김)
3. 상단에 3줄 벽돌 (각 줄 8개씩)
4. 공이 벽돌에 닿으면 벽돌 사라지고 점수 증가
5. 공이 바닥에 떨어지면 생명 감소
6. 생명이 0이 되면 게임 오버
7. 모든 벽돌을 깨면 레벨 클리어

화면 크기: 800x600
점수 표시, 생명 표시, 레벨 표시 포함
모든 코드를 하나의 HTML 파일에 작성해주세요."

1. 코드를 `brick_breaker.html`로 저장 2. 브라우저에서 실행 3. 마우스로 패들 조작해서 게임 플레이 4. 게임이 정상 작동하는지 확인

"게임을 더 재미있게 만들어주세요:

1. 벽돌마다 다른 색깔 (빨강, 주황, 노랑)
2. 색깔별로 다른 점수 (빨강 30점, 주황 20점, 노랑 10점)
3. 게임 시작 전에 '클릭해서 시작' 메시지
4. 모든 벽돌을 깨면 '레벨 클리어!' 메시지
5. 게임 오버 시 '게임 오버' 메시지

기존 기능은 그대로 유지하면서 추가해주세요."

다음 중 하나를 선택하거나 여러분만의 아이디어를 만들어보세요:

옵션 1: 숫자 맞추기 게임 - 컴퓨터가 1-100 사이 숫자를 생각함 - 플레이어가 숫자를 입력하면 높다/낮다 힌트 제공 - 최소 시도 횟수로 맞추는 게임

옵션 2: 간단한 퍼즐 게임 - 3×3 그리드에 8개 숫자 타일 - 빈 공간으로 타일을 움직여 1-8 순서로 정렬

옵션 3: 메모리 게임 - 카드를 뒤집어서 같은 그림 쌍 찾기 - 최소 시도로 모든 쌍 찾기

선택한 게임에 대해 구체적으로 요청해보세요:

템플릿:
"[게임 이름] 게임을 만들어주세요.

게임 규칙:
1. [규칙 1]
2. [규칙 2]
3. [규칙 3]

UI 요구사항:
- [디자인 요청]
- [색상 선호도]
- [레이아웃 설명]

기능 요구사항:
- [필요한 기능들]
- [점수 시스템]
- [게임 종료 조건]

모든 코드를 하나의 HTML 파일로 만들어주세요."

AI가 만든 게임 코드를 다시 보여주며 다음과 같이 질문해보세요:

"위에서 만든 게임 코드를 초보자도 이해할 수 있게 설명해주세요:

1. HTML 부분에서 각 태그가 하는 역할
2. CSS 부분에서 스타일이 어떻게 적용되는지
3. JavaScript 부분에서 주요 함수들이 하는 일
4. 게임의 전체적인 동작 흐름

코딩을 전혀 모르는 사람도 이해할 수 있게 쉽게 설명해주세요."

AI의 설명을 듣고 나서, 간단한 수정을 시도해보세요:

"위 코드에서 다음 부분들을 어떻게 수정하면 될까요?

1. 배경색을 파란색에서 검은색으로 바꾸기
2. 버튼 크기를 2배로 키우기
3. 점수 글꼴을 더 크게 만들기
4. 게임 시작 메시지 텍스트 바꾸기

각 수정사항마다 어떤 코드를 어떻게 바꿔야 하는지 알려주세요."

완성된 게임을 다른 사람들과 공유하는 방법을 배워보세요:

"만든 게임을 온라인에서 다른 사람들이 플레이할 수 있게 하려면 어떻게 해야 하나요?

1. 무료로 호스팅할 수 있는 서비스 추천
2. GitHub Pages 사용법
3. 파일 업로드하는 방법
4. 링크 공유하는 방법

초보자도 따라할 수 있게 단계별로 설명해주세요."

제공된 게임 템플릿 중 하나를 완성하고 실행해보세요. - 게임이 정상 작동하는가? - 모든 기능이 예상대로 동작하는가?

기본 게임에 여러분만의 기능을 추가해보세요: - 새로운 색상이나 디자인 - 추가적인 게임 규칙 - 사운드 효과나 애니메이션

완전히 새로운 게임 아이디어를 AI와 함께 구현해보세요: - 독창적인 게임 메커니즘 - 복합적인 기능들 - 여러 레벨이나 난이도

• 구체적인 요청: 막연한 “게임 만들어줘”보다는 상세한 설명
• 단계별 접근: 복잡한 기능을 작은 단위로 나누어 요청
• 테스트와 피드백: 각 단계마다 실행해보고 개선사항 요청
• 코드 이해: 복사-붙여넣기에서 끝나지 말고 원리 이해하기

축하합니다! 이제 AI와 함께 첫 번째 게임을 만들어봤습니다.

다음 챕터에서는 게임을 더 발전시키고 AI를 튜터로 활용하는 방법을 배워보겠습니다.

➡️ 다음: Chapter 5: AI 튜터와 함께 게임 업그레이드하기

—

💡 AI 협업의 핵심: 코딩 문법을 몰라도 괜찮습니다. 중요한 것은 '무엇을 만들지' 구상하는 기획력입니다. A(구상) → B(AI 구현) → C(검증) 프로세스에서 당신은 가장 중요한 A와 C를 담당하고 있습니다! 놀라운 사실: AI와 함께 프로젝트를 수행한 1일의 경험이 1개월간 언어를 독학하는 것보다 훨씬 빠르게 프로그래밍 언어에 대한 이해도를 높여줍니다!