| 항목 | 내용 |
|---|---|
| 프로젝트명 | 딩코 (Dingco) |
| GitHub URL | (입력 필요) |
| 배포 URL | (입력 필요) |
| 데모 영상 링크 | (입력 필요) |
예제 화면을 보고 음성으로 AI에게 지시를 내리면, 청개구리 AI "딩코"가 지시를 반대로 해석해 엉뚱한 화면을 만들어내는 파티 게임입니다. 사용자는 색상, 레이아웃, 텍스트 등을 최대한 구체적으로 설명해야 하며, 말하지 않은 부분은 반영되지 않습니다. 완성된 결과물은 갤러리에 공유되고, 다른 사용자가 "킹받아요" 투표로 명예의 전당에 올릴 수 있습니다. AI를 활용한 바이브코딩의 재미와 한계를 게임으로 체험하고 싶은 누구나 대상입니다.
Google Gemini(gemini-3-flash-preview) 모델을 사용합니다. 시스템 프롬프트로 "사용자의 요구를 완벽히 반대로 해석하라"는 지침을 부여하여, 동일한 입력에도 일반 코딩 AI와 정반대의 HTML 결과물을 생성합니다. 추가 지시 시 이전 HTML 코드를 컨텍스트로 함께 전달하여 반복 개선이 가능합니다. 음성 입력은 Web Speech API 기반 실시간 STT로 처리하며, AI 없이는 "반대 해석 → HTML 코드 생성"이라는 핵심 게임 루프 자체가 성립할 수 없습니다.
Frontend: Next.js 16 (App Router), TypeScript, Tailwind CSS 4, shadcn/ui, Zustand
AI/STT: Google Generative AI (Gemini 3 Flash), Web Speech API
Backend/DB: Next.js API Routes, Supabase (submissions, votes 테이블)
시스템 프롬프트 탈옥 방어를 위한 프롬프트 가드 설계, 이전 생성 코드를 컨텍스트로 전달하는 반복 개선 구조, 그리고 iframe sandbox를 통한 사용자 생성 HTML의 안전한 렌더링에 중점을 두었습니다.
기존 AI 코딩 도구가 "정확한 구현"을 목표로 하는 반면, 딩코는 AI의 반대 해석을 게임 메커닉으로 활용하여 **"잘 지시할수록 더 킹받는 결과"**라는 독특한 재미를 만들어냅니다. 음성 기반 인터랙션과 갤러리 투표 시스템을 결합해 멀티플레이어 파티 게임으로 확장 가능하며, AI 프롬프트 엔지니어링의 중요성을 유쾌하게 체험할 수 있는 교육적 가치도 갖습니다.