AWS Q CLI를 사용해서 html 웹 게임 만들어본 후기

claude code, cursor 등을 사용해보면서 이제는 정말 코더들을 AI가 대체하는 시대가 왔다고 확신하게 되었다.

AWS의 Q CLI는 claude code처럼 cli를 통해서 디렉토리에 접근해서 파일 코드를 작성하고 관리할 수 있게 해주는 서비스이다.

이번에 Q CLI를 홍보하기 위해 게임을 직접 만들어보는 행사가 있어 참여해보게 되었다.

https://www.youtube.com/watch?v=fuaYzGFanYA&ab_channel=AWS%EA%B0%95%EC%9D%98%EC%8B%A4

 

위 영상을 참고로 했다.

WSL에 세팅한 후, 만들고 싶은 프로젝트를 프롬프트로 간단하게 작성하니 html 파일 하나로 코드를 잘 작성해줬다.

 

1. 퐁 게임

 https://gonnawooh.github.io/q-cli-test/pong.html

Pong Game

간단하지만 너무 유명한 고전 명작 게임이라 특별한 버그 없이 잘 작성해주는듯?

 

2. 컬링게임

https://gonnawooh.github.io/q-cli-test/curling.html

Curling Game

간단하게 컬링 웹게임을 만들어달라고 하는 것 치고는 디자인부터 기본적인 룰까지 전부 잘 작성해줘서 놀랐다. 다만 예상치 못한 버그, 라운드/스코어 등은 적용되지 않아 수정이 필요해보였다.

 

 

 

🎮 어떤 게임을 만들었고, 왜 이걸 선택했나?

1. 퐁(Pong) 게임

가장 먼저 선택한 게임은 고전 중의 고전, **퐁(Pong)**입니다.

• 구조가 단순하고
• 로직도 명확하며
• 누구나 알고 있어서 버그 검증도 쉬웠기 때문입니다.

 

• 충돌 처리
• 컴퓨터 AI
• 점수 관리
• 키보드 입력
  모든 부분이 단 한번의 시도로 완성. 오차 거의 없음.

2. 컬링 게임

그다음엔 도전적으로 컬링 게임을 시켜봤습니다. 이건 퐁보다 훨씬 복잡한 게임인데요:

• 드래그해서 던지기
• 턴 전환
• 라운드 관리
• 점수 계산

AI가 기본적인 UI부터 룰까지 모두 작성해주었고, 실제로 어느 정도 playable한 상태로 나와 전체 틀은 충분히 만족스러웠습니다. 오류가 많고 미구현 항목이 많아 직접 수정 필요

---

🧠 효과적인 프롬프트 작성법

제가 얻은 가장 큰 교훈은 프롬프트가 명확할수록 결과가 좋아진다는 점입니다.

하지만 Q는 간결한 문장으로 얘기해줘도 내가 원하는 게임이 무엇인지 유추하는 능력이 좋아보였다.

예시 프롬프트:

“HTML과 JavaScript로 동작하는 퐁 게임을 만들어줘. 키보드 조작, 점수 기능, 시작/재시작 기능 포함.”

또는

“컬링 게임을 만들어줘. 드래그해서 던지고, 2명이 번갈아 턴을 진행하고, 점수를 계산해줘.”

팁:

• 입력 방식 (키보드, 마우스 등)을 명시하면 정확도가 높아짐
• 게임의 룰과 UI 요소를 최대한 상세히 기술
• Claude에서는 "추가로 ~~도 넣어줘" 식의 후속 프롬프트도 매우 잘 반응

---

🤖 AI가 잘 처리한 전통적인 개발 과제들

특히 인상 깊었던 부분은 다음과 같습니다:

• 상태 관리 (점수, 라운드, 게임 시작/종료)
• 사용자 입력 처리 (키보드, 마우스 드래그 등)
• 간단한 물리 로직 (속도, 충돌, 반사)
• DOM 조작 (UI 메시지, 점수 업데이트)

컬링 게임처럼 조금 더 복잡한 상황에서는 일부 로직을 직접 다듬어야 했지만, 기본 뼈대는 AI가 완벽하게 작성해주었습니다.

---

⚙️ 시간 아껴준 개발 자동화 경험

Q CLI를 통해 정말 많은 시간을 아꼈습니다.

• 한 줄 프롬프트로 전체 프로젝트 scaffold 생성
• 터미널에서 자연어로 코드 수정 및 추가
• HTML/CSS/JS boilerplate 자동 생성