Need
Web 게임 스택
Why it's needed
브라우저 기반 게임 UI와 렌더링 레이어를 위한 실용적인 기본 선택입니다.
.md to the page URL.
Codex use case
게임 계획을 정의하고 Codex가 실제 브라우저에서 게임을 빌드하고 테스트하게 하세요.
Codex를 사용해 게임 개요를 먼저 구체적인 계획으로 발전시킨 다음 실제 브라우저 기반 게임으로 구현하세요. imagegen으로 시각 에셋을 생성하고, Codex가 실제 브라우저에서 게임을 테스트하면서 조작법과 UI를 반복 개선하게 하세요.
게임 계획을 정의하고 Codex가 실제 브라우저에서 게임을 빌드하고 테스트하게 하세요.
Codex를 사용해 게임 개요를 먼저 구체적인 계획으로 발전시킨 다음 실제 브라우저 기반 게임으로 구현하세요. imagegen으로 시각 에셋을 생성하고, Codex가 실제 브라우저에서 게임을 테스트하면서 조작법과 UI를 반복 개선하게 하세요.
Codex를 사용해 게임 개요를 먼저 구체적인 계획으로 발전시킨 다음 실제 브라우저 기반 게임으로 구현하세요. imagegen으로 시각 에셋을 생성하고, Codex가 실제 브라우저에서 게임을 테스트하면서 조작법과 UI를 반복 개선하게 하세요.
관련 링크
| Skill | Why use it |
|---|---|
| Playwright | 실제 브라우저에서 게임을 플레이하고 현재 상태를 점검하면서 실제 빌드를 기준으로 조작법, 타이밍, UI 사용감을 반복 개선하세요. |
| ImageGen | 콘셉트 아트, 스프라이트, 배경, UI 에셋을 생성하고 추후 에셋을 일괄 생성할 때 재사용할 수 있도록 프롬프트를 보관하세요. |
| OpenAI Docs | OpenAI 기반 기능을 게임에 연동하기 전에 최신 공식 가이드를 가져오세요. |
게임 개발은 Codex가 코드 생성 이상의 작업을 지원하는 방식을 가장 잘 보여 주는 사례 중 하나입니다. 실제 게임을 만들려면 대개 글로 정리한 콘셉트, 렌더링 레이어, 프런트엔드 셸 구현, 백엔드 상태 관리, 에셋 제작, 지속적인 비주얼 조정이 필요합니다
이 사용 사례에서는 Codex가 먼저 게임이 어떻게 동작해야 하는지 정확히 문서화한 다음, Playwright interactive를 사용해 실제 브라우저에서 게임을 테스트하면서 반복 개선하도록 할 때 가장 효과적입니다.
Codex가 스캐폴딩 작업에 착수하기 전에 게임을 구체적으로 정의하는 PLAN.md를 만들도록 요청하세요:
이 계획이 중요한 이유는 “게임을 만들어라”라는 지시만으로는 너무 모호하기 때문입니다. Codex는 게임의 각 부분을 어떻게 구현할지 파악할 수 있어야 하며, 빌드 과정에서 구현 세부 사항을 자주 참조해야 합니다.
/plan 슬래시 명령어를 사용하면 플랜 모드를 활성화할 수 있습니다.
출력 결과를 PLAN.md 파일로 저장하세요.
Codex가 계획을 따르고 작업 결과를 검증하며 적절한 도구를 사용하게 하려면 다음과 같은 AGENTS.md를 정의하세요:
# Game name
<Type of game>
Tech Stack:
- NextJS for frontend (hosted on Vercel)
- <insert technology> for rendering
- Fastify for backend, websockets (hosted on <hosting platform>)
- Postgres for database (hosted on <hosting platform>)
- Redis for caching and pub/sub (hosted on <hosting platform>)
- OpenAI for generative AI features
Tips:
- Use build and test commands to verify your work as soon as you complete a feature or task
- Use the PLAN.md file to guide your work when building new features
- Log your work under .logs (create new log files as you see fit) to record your thought process and decisions, and reference them when iterating on features
- Use playwright to test the visual output of your work, and iterate if it doesn't look right or fit the vibe
- Use imagegen to generate visual assets for your work, and every time you generate a collection of assets, save the prompts you used to be able to continue generating more of the same assets later (create files in .prompts)
- Use Context7 MCP to fetch <rendering framework> docs
이렇게 하면 Codex가 장시간 독립적으로 실행되며 필요에 따라 관련 스킬을 사용할 수 있습니다.
AGENTS.md 파일에 언급된 스킬을 추가하세요:
스킬을 추가하는 방법은 스킬 문서에서 자세히 알아보세요.
팁: 모든 시각 에셋의 일관성을 유지할 수 있도록 Codex에 이미지 생성 프롬프트를 파일로 저장해 달라고 요청하세요. 생성하려는 에셋의 스타일을 설명하고, Codex가 재사용 가능한 상세 프롬프트를 만들게 하세요.
Codex는 초기 계획을 바탕으로 게임의 첫 번째 버전을 생성합니다.
생성해야 할 이미지 에셋이 많다면 첫 번째 버전을 만드는 데 시간이 걸릴 수 있으며, 때로는 몇 시간이 소요되기도 합니다. Codex는 작업 결과를 테스트하고 실제 브라우저에서 게임을 직접 실행해 볼 수 있으므로 추가 입력 없이도 오랫동안 작업을 계속할 수 있습니다.
계획이 구체적일수록 첫 번째 반복 개선을 마쳤을 때 결과물의 완성도도 높아집니다.
직접 테스트하면서 만족스러운 결과가 나올 때까지 스크린샷을 제공하고 게임플레이 변경이나 시각 에셋 업데이트를 요청하는 방식으로 필요에 따라 반복 개선하세요.
Need
Default options
Why it's needed
Need
Web 게임 스택
Why it's needed
브라우저 기반 게임 UI와 렌더링 레이어를 위한 실용적인 기본 선택입니다.
Need
백엔드 스택
Why it's needed
게임에 영속성, 매치메이킹, 리더보드 또는 게시/구독이 필요할 때 유용한 기본 선택입니다.
Codex가 여러 턴에 걸쳐 검증 가능한 종료 조건을 향해 계속 작업해야 한다면 `/goal`을 사용하세요.
Codex가 어느 폴더에서나 실행하고 레포지토리 스크립트와 조합하며 파일을 다운로드하는 데 사용할 수 있고, 연계 스킬을 통해 사용법을 기억할 수 있는 조합 가능한...
스크립트와 검토 가능한 아티팩트 같은 평가 시스템을 Codex에 제공하면, 점수가 충분히 높아질 때까지 어려운 작업을 계속 개선할 수 있습니다.