고블린 모드: 자연 스캐빈저 빙고 — 오프라인 우선 AI 자연 탐험
요약
이 앱은 사용자가 스마트폰 화면 대신 실제 주변 환경 탐험에 집중하도록 유도하는 AI 기반 야외 자연 스캐빈저 헌트입니다. 인터랙티브 미션과 컴퓨터 비전, 위치 인식 기능을 결합하여 공원이나 정원에서 발견물을 사진 찍고 AI로 검증하며 재미있는 학습 경험을 제공합니다.
핵심 포인트
- 화면 사용 시간을 줄이고 실제 탐험에 집중하도록 유도함.
- 컴퓨터 비전 및 분류학 지식을 활용한 자연물 식별 기능 구현.
- 오프라인 지원과 인터랙티브 필드 저널 디자인이 특징임.
이 글은 Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass에 제출하는 내용입니다.
제가 만든 것 (What I Built)
AI가 우리가 화면을 보는 시간을 줄이고 주변 세계를 탐험하는 데 더 많은 시간을 보내도록 장려할 수 있다면 어떨까요?
이 질문은 저에게 Goblin Mode: Nature Scavenger Bingo를 만들 영감을 주었습니다. 이 앱은 평범한 공원, 정원 또는 캠퍼스 산책을 인터랙티브한 발견 경험으로 바꾸기 위해 설계된 AI 기반 야외 자연 스캐빈저 헌트입니다.
사용자들은 앱을 끝없이 스크롤하는 대신, 자연 기반 미션을 받고 주변 환경을 탐험하며 실제 표본을 사진 찍고 AI를 사용하여 발견물을 검증합니다.
이 프로젝트는 두 가지 중요한 과제를 해결합니다: 사용자들을 화면 대신 실제 세계에 집중하게 하는 것과 불완전한 사진에서 자연물 객체를 정확하게 식별하는 것입니다.
Goblin Mode는 삽화된 필드 저널 인터페이스와 컴퓨터 비전(computer vision), 분류학적 지식 검색(taxonomic knowledge retrieval), 위치 인식 퀘스트 생성(location-aware quest generation), 그리고 오프라인 기능(offline functionality)을 결합합니다.
그 중심 캐릭터는 Grimble입니다. 그는 독특한 고블린 자연주의자로, 음성 내레이션과 필드 노트에서 영감을 받은 인터페이스—가죽으로 꿰맨 테두리, 찢어진 데콜 모양의 양피지 페이지, 황동 모서리 브래킷, 와시 마스킹 테이프, 그리고 수작업 수채화 및 잉크 SVG 식물 스케치로 가득합니다—를 통해 사용자들의 발견을 안내합니다.
작동 방식 (How It Works)
1. 인터랙티브 미션을 통해 자연 발견하기
이 애플리케이션은 나뭇잎, 곤충, 꽃 및 기타 자연물에서 영감을 받은 미션들로 채워진 3×3 자연 스캐빈저 빙고 보드를 제시합니다.
사용자가 미션을 선택하면 인터페이스가 **포커스 모드(Focus Mode)**로 진입하며 하나의 활성 챌린지를 표시합니다. 이는 사용자들이 탐험하는 동안 휴대폰을 치우고, 발견한 것을 사진 찍어야 할 때만 다시 가져오도록 장려합니다.
사용자가 미션을 새로 고치기 위해 **"새 보드 생성(Generate New Board)"**을 클릭하면, 3×3 그리드가 깔끔하게 언마운트되고, 강제적으로 >= 850ms의 최소 전환 시간 창을 가진 이중 동심원 에메랄드-앰버 로딩 나선형이 표시됩니다. 이는 갑작스러운 서브초(sub-second) 시각적 깜빡임을 방지하는 동시에, 새로운 보드가 합성되고 있다는 명확한 피드백을 제공합니다.
2. AI 기반 자연 검증 (AI-Powered Nature Verification)
사용자는 표본 사진을 찍어 검증을 위해 제출할 수 있습니다. 이미지가 비전 모델에 도달하기 전에, 백엔드는 이미지를 향상시키고(enhance), 시각적 세부 사항을 평가하며, 전체 사진과 확대된 영역을 모두 포함하는 이중 스케일 검사 이미지를 생성합니다.
검증 파이프라인은 이미지 분석, 분류학적 지식(taxonomic knowledge), 그리고 멀티모달 AI를 결합하여 진정한 발견물과 잘못된 유사품 또는 특징 없는 이미지를 구별합니다:
- Stage 1 — 컴퓨터 비전 전처리 (
image_enhancer.py): 원본 카메라 사진은 라플라시안 에지 필터(ImageFilter.FIND_EDGES)로 분석되어 구조적 에지 밀도(ActiveEdgeRatio)와 색상 분산(ColorStd)을 측정하고, AI 추론 전에 빈 벽이나 작은 먼지 점을 플래그 지정합니다. 이후 이미지는 YCbCr 색 공간으로 변환되어 자연 녹색 엽록소 색조를 왜곡하지 않으면서 휘도(Y채널) 대비를45%로 균형 있게 맞추고, **UnsharpMask(radius=1.6, percent=145%, threshold=3)**을 통해 선명하게 처리하여 흐릿한 잎맥과 곤충 다리를 복구하며, 단일784×448px측면-대-측면 이중 스케일 자연주의 검사판(Side-by-Side Dual-Scale Naturalist Inspection Plate) (왼쪽:448×448px전체 프레임 | 오른쪽:332×448px2×확대된 중앙 디테일 크롭)으로 합성됩니다. - Stage 2 — 4단계 분류학 심사관 (
verify.py): 피험자 무결성(Gate 1), 필수 분류학 해부학(Gate 2), 하드 네거티브 위조품(Gate 3), 야외 카메라 블러 허용도(Gate 4)를 평가합니다.
예를 들어, 시스템은 심장 모양의 심장형 기부(cordate base), 곧은 깃털-망상 노란색 맥관(pinnate-reticulate yellow venation), 그리고 길쭉한 꼬리 같은 현저한 낙하단(caudate drip-tip) (잎 길이의 $\ge 20%$)을 필요로 하는 **피팔 잎(Ficus religiosa)**을 시각적으로 유사한 실내 돈나무(Epipremnum aureum) 덩굴이나 베텔(Piper betle) 잎과 구별하고, 몸체 세 부분 분할, 좁은 엽병 허리, 그리고 6개의 관절이 있는 다리가 보이지 않는 한 바닥의 작은 어두운 점을 **직조군 개미(Oecophylla smaragdina)**의 증거로 엄격하게 거부합니다.
서버 측 검증은 진행 상황에 대한 보상을 하기 전에 모델의 응답을 확인하며, is_impostor_or_fake == true, confidence < 0.85, 또는 CV 먼지 점 감지기가 작동한 경우 강제로 passed = false 및 0 XP를 적용하여, 부정확한 식별을 줄이고 90–95%+의 분류학적 정밀도를 달성하는 데 도움을 줍니다.
3. 동적 퀘스트 생성
고블린 모드(Goblin Mode)는 고정된 챌린지 목록에만 의존하는 것이 아니라 위치 컨텍스트를 사용하여 자연 미션을 생성할 수 있습니다.
이 시스템의 **범용 2단계 분류학적 RAG 시스템 (botanical_rag.py)**은 엄격한 전체 단어 경계 정규식(\b...\b)을 사용하는 선별된 생물다양성 인덱스(Tier 1)와 동적으로 생성되는 종 검증 기준(Tier 2)을 결합합니다. 플레이어가 정적 카탈로그에 없는 무작위로 생성된 위치 기반 퀘스트(예: Touch-Me-Not Mimosa pudica, Crimson Callistemon Bottlebrush, Seven-Spotted Coccinella Ladybug, 또는 Plumeria rubra)를 시도할 때마다, 백엔드는 실시간으로 오픈 가중치 120B openai/gpt-oss-120b 모델 (reasoning_effort="low")에 질의하여 해당 종의 과학적 이름, 필수 진단 형질, 그리고 유사종 사기(impostors)를 합성하고 거부합니다. _DYNAMIC_RAG_CACHE에 캐시된 결과는 0ms 만에 재사용되며, AI 서비스가 사용 불가능한 경우 결정론적 도메인 클래스 폴백 규칙이 처리합니다.
4. 오프라인 우선 탐험 (Offline-First Exploration)
실외 연결성은 항상 안정적이지 않기 때문에, 이 애플리케이션은 로컬 진행 상황 및 대기 중인 표본을 위해 클라이언트 측 HTML5 Canvas 이미지 정규화(64px 최소 ~ 1280px 최대 경계 상자, #FFFFFF 알파 합성, 300 KB 이하 JPEG 압축률 0.88)와 IndexedDB 영속성 (idb-keyval)을 포함합니다.
3단계의 절차적 퀘스트 생성 시스템은 로컬 Ollama (gemma2:2b) $\to$ 클라우드 Groq (openai/gpt-oss-120b) $\to$ 클라이언트 측 **조합기 행렬 (combinatoricMatrix.ts)**로 이어지며, 이 조합기 행렬은 15개의 감각 형용사, 15개의 자연 명사, 그리고 10개의 위치 컨텍스트를 곱하여 신호가 없는 오프라인 탐험을 위해 최대 2,250가지 조합을 생성합니다.
계정별 로컬 저장소 (goblin_bingo_board_v4_<uid> 대 goblin_bingo_board_v4_guest)는 또한 개별 사용자의 보드와 경험치(XP) 진행 상황이 동일한 장치에서 엄격하게 격리되도록 유지합니다.
5. 음성, 분위기 및 접근성 (Voice, Atmosphere, and Accessibility)
Grimble은 설정 시 **ElevenLabs (eleven_multilingual_v2)**를 통해 생생한 음성 내레이션을 제공하며, 이는 반복되는 음성 지연 시간을 ~1,400ms에서 <15ms로 줄이는 **결정론적 SHA-256 디스크 오디오 캐시 (backend/audio_cache/)**에 의해 뒷받침됩니다. 또한 전용 **중앙 집중식 듀얼 채널 오디오 컨트롤러 (audioManager.ts)**가 SFX와 Voice 채널을 분리하여 UI 클릭이 Grimble의 현장 해설을 방해하거나 중단시키는 일이 없도록 합니다.
인터페이스는 또한 Indian Standard Time (UTC +05:30) 기준 시간대에 따라 시각적 분위기를 적응시키며, 빠르고 **10초 간격의 폴링 심장 박동(polling heartbeat)**을 가집니다. 여기에는 뚜렷한 아침/낮 (07:00–17:00 IST) 햇빛에 비친 꽃가루 입자, **저녁/일몰 (17:00–19:00 IST)**의 호박색-보라색 황혼 빛깔, 그리고 밤에는 초승달과 반짝이는 별, 떠다니는 생체 발광 반딧불이가 있는 밤 (19:00–07:00 IST) 달빛이 포함됩니다. 이 요소들은 야간 시간 외에는 엄격하게 숨겨집니다.
이러한 기능들을 종합하여 자연 탐험이 단순히 화면 기반의 게임이라기보다는 상호작용적인 현장 모험처럼 느껴지도록 하는 것이 목표입니다.
데모 (Demo)
실시간 웹 앱 (최상의 경험을 위해 휴대폰으로 시도해 주세요):
goblin-nature-bingo.vercel.app
실시간 백엔드 상태 원격 측정: https://goblin-nature-bingo.onrender.com/api/health
데모 비디오: https://drive.google.com/file/d/1DqGSOqb6mjMUv41udrZGpEPFkdf78fXF/view?usp=sharing
코드 (Code)
GitHub 저장소: https://github.com/SoumyaGhosh2006/Goblin_Nature_Bingo
GitHub logo SoumyaGhosh2006 / Goblin_Nature_Bingo
🌿 Goblin Nature Bingo
오프라인 우선, 위치 인식형 야외 현장 일지 및 AI 식물 채집가 사냥 (AI Botanical Scavenger Hunt)
📖 개요 (Overview)
**고블린 네이처 빙고(Goblin Nature Bingo)**는 Grimble이라는 목소리 합성 고블린 자연학자가 안내하는 인터랙티브하고 오프라인 우선의 야외 스캐빈저 사냥 웹 애플리케이션입니다. Grimble은 플레이어들을 화면에서 벗어나 공원, 정원, 캠퍼스, 동네 산책로 등을 직접 탐험하도록 유도합니다.
사용자들은 끝없이 화면을 스크롤하는 대신, 3×3 크기의 세월이 느껴지는 가죽 및 양피지 필드 바인더에 자연 기반 미션을 받습니다. 그리고 밖으로 나가 주변 환경을 탐험하고, 실제 식물학적 및 동물학적 표본을 사진 찍은 후, 다단계 컴퓨터 비전 (Computer Vision) + 범용 분류학 RAG (Universal Taxonomic RAG) + 오픈 웨이트 멀티모달 AI 심판 시스템을 사용하여 발견물을 검증합니다.
핵심 기능 (Core Capabilities)
- 촉각적 자연학 필드 저널 및 화면 없는 집중 모드 (Tactile Naturalist Field Journal & Screen-Free Focus Mode): 스티치된 가죽 테두리, 황동 모서리 브래킷, 와시 마스킹 테이프, 맞춤형 잉크 및 수채화 SVG 식물 삽화가 특징인
3×3크기의 데콜 페이퍼 빙고 그리드입니다. 어떤 퀘스트 타일을 선택하든 **집중 모드 (Focus Mode)**로 진입하며, UI를 하나의 감각적인 야외 미션으로 축소합니다...
구현 내용을 탐색하고, 문제를 보고하며, 야외 AI 경험을 더욱 안정적이고 접근 가능하게 만드는 데 기여하세요.
제작 과정 (How I Built It)
프론트엔드 (Frontend): React 19, TypeScript, Vite, Tailwind CSS, Framer Motion, HTML5 Canvas, 그리고 idb-keyval을 사용한 IndexedDB.
백엔드 (Backend): Python 3.11, FastAPI, Pillow, httpx, 및 Pydantic.
AI 및 컴퓨터 비전 (AI and Computer Vision): Groq를 통한 Qwen 3.8 27B와 GPT-OSS 120B, 그리고 Gemma 2와 Moondream을 위한 로컬 Ollama 통합.
인증 및 영속성 (Authentication and Persistence): Firebase Authentication, Cloud Firestore, 및 계정 범위 IndexedDB 저장소.
음성 및 모니터링 (Voice and Monitoring): ElevenLabs 음성 합성(text-to-speech) 및 Sentry SDK 통합.
배포(Deployment): 프론트엔드는 Vercel을, FastAPI 백엔드는 Render를 사용합니다.
이 아키텍처는 이미지 향상, 분류학적 검색, 시각적 검증, 퀘스트 생성, 영속성(persistence), 오디오 관리를 개별적인 구성 요소로 분리합니다. 이는 각 시스템의 유지보수를 용이하게 하고, 서비스가 사용 불가능할 때 애플리케이션에 여러 대체 경로를 제공합니다.
우리의 엔지니어링 여정: 직면했던 실제 문제와 해결 방법
실외에서 안정적으로 작동하는 AI 앱을 구축하려면, 실제 테스트 과정에서 발생한 몇 가지 명확하지 않은 시스템 및 컴퓨터 비전 문제를 해결해야 했습니다:
1.
AI 자동 생성 콘텐츠
본 콘텐츠는 Dev.to AI tag의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.
원문 바로가기