GreenBreak — 오픈 소스 Gemma 2를 활용하여 화면에 중독된 개발자들에게 야외 활동을 강제한 방법 🌱

이 글은 Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass 제출물입니다.

'책상 잠금(Desk-Lock)' 딜레마: 두 개의 화면 이야기

솔직하게 한 번 말해봅시다.

소프트웨어 개발자로서 우리의 일과는 보통 다음과 같습니다:

1. JSON 파일에서 빠진 쉼표를 찾기 위해 32인치 4K 모니터를 4시간 동안 응시합니다.
2. 심각한 정신적 브레인 포그, 건조한 안구 통증, 나쁜 자세를 경험합니다.
3. '마땅히 누릴 만한 휴식' 시간이 되었다고 결정합니다.
4. 6.1인치 OLED 휴대폰을 꺼내 같은 의자에서 Reddit/X를 스크롤 합니다. 🤡

   ┌────────────────────────────────────────────────────────┐
   │              개발자의 '휴식' 주기               │
   │                                                        │
...

우리는 이것을 **'화면 전환(Screen Switching)'**이라고 부릅니다. 당신은 쉬는 것이 아니라, 단지 디지털 피로의 종횡비만 바꾸고 있을 뿐입니다!

기존의 피트니스, 습관, 마음챙김 앱들은 이를 악화시킵니다. 이 앱들은 사용자가 외부에 있을 때 GPS 좌표를 추적하고, 실시간 지도를 검사하며, 걸음 수를 기록하고, 알림을 끊임없이 확인하도록 요구합니다. 당신은 여전히 화면을 응시하고 있습니다.

그래서 저는 GreenBreak를 만들었습니다. 이는 **제로-스크린 프로토콜(Zero-Screen Protocol)**을 가진 30초짜리 야외 활동 지령기입니다.

🌿 제가 만든 것

GreenBreak는 피트니스 앱의 패러다임 전체를 뒤집습니다. 사용자는 웹사이트에서 30초 미만을 보내고, 그 후 이 앱은 사용자에게 책상에서 벗어나도록 적극적으로 강제합니다.

graph TD
    A[런처: 5m/15m/30m + 설정 + 목표 선택] -->|지령 버튼| B(Gemma 2 27B가 3단계 감각 임무를 합성)
    B --> C[실행 가능한 임무 카드: 3가지 단서 암기]
...

⚡ 5가지 핵심 기둥:

1. ⚡ 30초 실행기(Launchpad) 설정: 이름과 활동 시간(5m Quick Eye Reset, 15m Sun & Movement, 30m Deep Unplug)을 선택하고, 장소(Balcony/Rooftop, Urban Sidewalk, Public Park), 그리고 신체 회복 목표(Relieve Eye Strain, Brain Fog, Stiff Muscles)를 지정합니다.
2. 🧠 오픈 소스 Gemma 2 27B AI 추론: 지도, GPS 또는 디지털 장치 없이 사용자의 정확한 물리적 환경에 맞춰 3단계의 실행 가능한 감각 임무(sensory mission)를 합성해냅니다.
3. 🌑 OLED 포켓 모드 (Screen Zero UX): 브라우저 캔버스가 즉시 새까만 색(#0B0C0E)으로 변하며 주변에 맥동하는 녹색 타이머가 표시됩니다. 단 하나의 명령이 나타납니다: _"화면 잠김. 햇빛을 바라보세요. 시간이 만료될 때까지 연결을 끊으세요."
4. 🔔 제로 자산 웹 오디오 차임: 카운트다운이 00:00에 도달하면, 이중 하모닉 사인 차임(D5 587Hz → A5 880Hz)이 브라우저의 네이티브 Web Audio API를 통해 직접 합성되어 책상으로 돌아올 것을 알립니다.
5. 🌱 감각 보고 및 마음챙김 배지: 복귀 시, 사용자는 실제 세계 관찰 내용을 한 문장으로 타이핑합니다 (예: _"동쪽에서 차가운 바람을 느꼈고 지붕에 둥지를 튼 참새를 발견했다.""). Gemma는 감각적 깊이를 평가하고, 배지(예: Canopy Tactician 또는 Horizon Scout)를 수여하며, 햇빛 노출 시간을 MongoDB Atlas에 기록합니다.

🚀 데모

• 실시간 배포 앱: https://greenbreak.vercel.app/
• GitHub 저장소: https://github.com/Ankit-Kum-ar/greenbreak

UI 미리보기 (Positivus Neo-Brutalist 테마)

이 UI는 상징적인 Positivus Neo-Brutalist 디자인 시스템(#B9FF66 라임 악센트, #191A23 단색 경계선, rounded-[40px] 카드, 그리고 굵은 Space Grotesk 타이포그래피)를 사용하여 처음부터 제작되었습니다:

┌────────────────────────────────────────────────────────────────────────┐
│ ★ GreenBreak [Touch Grass]                     [ ⟲ Previous Activities ]│
├────────────────────────────────────────────────────────────────────────┤
... 

🧠 구축 과정

sequenceDiagram
    autonumber
    actor User as 💻 Developer
...

1. Google Gemma 2 27B (google/gemma-2-27b-it): Gemma는 탁월한 추론 밀도와 자연 세계 기반 지식 덕분에 특별히 선택되었습니다. 일반적인 피트니스 조언을 출력하는 대신, Gemma는 정밀한 감각적 단서(예: 광학 20미터 수평선 응시, 나뭇잎 질감 촉각 상호작용, 비기계적 오디오 격리)를 구성합니다.
2. MongoDB Atlas 데이터베이스: 세션 타임스탬프, 사용자 이름, 정성적 관찰 내용, 마음챙김 점수, 그리고 맞춤형 대소문자 구분 없는 사용자 필터링( /history?name=...)을 통해 잠금 해제된 배지 컬렉션을 저장합니다.
3. Next.js 15 및 Tailwind CSS: 모듈식 단계 분리(SetupStage, MissionStage, PocketStage, DebriefStage, SummaryStage)를 갖도록 설계되어 깔끔한 상태 관리와 최대 성능을 보장합니다.
4. 제로 에셋 웹 오디오 차임 (Zero-Asset Web Audio Chime): 브라우저의 네이티브 Web Audio API를 사용하여 수학적 듀얼 사인 오실레이터(D5에서 A5까지 램프)로 직접 합성하여, 대역폭을 사용하지 않는 알림 차임을 만듭니다.

🌍 오픈 혁신은 왜 중요한가?

왜 Gemma 2와 같은 오픈 가중치(open-weight) 모델을 사용하여 구축하고, 독점적인 블랙박스 API를 사용하지 않았을까요?

1. 🔒 주권 데이터 및 정신적 프라이버시: 사용자의 개인적인 성찰, 정신적 피로 기록, 일일 웰빙 순간은 독점 공급업체의 학습 파이프라인 뒤에 가려져서는 안 됩니다. 오픈 웨이트(Open weights)는 개발자에게 데이터가 어디서, 어떻게 처리될지에 대한 완전한 소유권을 부여합니다.
2. ⚡ 초저지연 엣지 추론: Zero-Screen 프로토콜은 즉각적이고 서브초(sub-second) 응답을 요구합니다. 오픈 웨이트 아키텍처는 개발자가 전문 고속 게이트웨이(예: Backboard)를 통해 추론 경로를 지정하거나 WebGPU / Ollama와 같은 온디바이스 하드웨어에 직접 배포할 수 있도록 합니다.
3. 🎯 설명 가능하고 제어 가능한 추론: 인간의 마음챙김을 평가하는 것은 미묘합니다. 오픈 혁신은 우리가 시스템 프롬프트(system prompts)를 정밀하게 구조화하고, 토큰 분포를 검사하며, AI가 일반적인 기업 챗봇이 아닌 격려하는 야외 가이드처럼 행동하도록 보장할 수 있게 합니다.

이제 이 브라우저 탭을 닫고, 밖에 나가서 풀(grass)을 만져보세요! 🌱