← 갤러리로 돌아가기

🎯 빙고판 생성기

항목 목록을 넣으면 무작위로 섞인 빙고판이 만들어져요 — 자기소개 빙고, 수업 아이스브레이킹에 활용하기 좋아요
💡 크기를 고르고 항목을 편집한 뒤 "빙고판 만들기"를 누르세요. 셀을 클릭하면 체크되고, 가로·세로·대각선이 채워지면 빙고 줄 수가 올라가요.
한 줄에 항목 하나씩 입력하세요. 빙고판 크기(칸 수)보다 항목이 많아도 괜찮아요 — 무작위로 골라 채워요.
빙고판
0줄 완성

🧾 이 도구, 이런 프롬프트로 만들었어요

아래 프롬프트를 복사해서 Claude·ChatGPT(GPT)·Gemini 어디에든 붙여넣고 직접 시도해보세요. 참고로 이건 예시 없이 지시만 담은 제로샷(zero-shot) 프롬프트예요 — 원하는 결과물의 예시를 1개 넣으면 원샷(one-shot), 여러 개 넣으면 퓨샷(few-shot) 프롬프팅이 되는데, 예시를 더할수록 결과가 원하는 스타일에 더 가까워지는 경우가 많아요.

"빙고판 생성기" 웹앱을 단일 HTML 파일로 만들어줘.

- 3x3 / 4x4 / 5x5 크기를 버튼으로 선택할 수 있게 하고
- 텍스트박스에 항목들을 한 줄에 하나씩 입력받아서 (기본값으로 예시 항목 30개 정도 미리 채워둬)
- "빙고판 만들기"를 누르면 입력한 항목 중에서 무작위로 골라 섞은 뒤 grid 형태의 빙고판으로 렌더링
- 각 칸을 클릭하면 체크(색칠) 표시가 토글되고,
  가로/세로/대각선이 전부 체크되면 자동으로 감지해서 "N줄 완성" 카운터가 올라가게 해줘
- "같은 항목으로 다시 섞기" 버튼도 추가해서 새 배치로 다시 만들 수 있게 해줘
- CSS·JS 전부 인라인으로 넣은 단일 HTML 파일로, 한국어 UI로 출력해줘
이 페이지는 AI(Claude)가 만든 예시 도구입니다 — 강의 데모용