צליין הוא PWA פרימיום שהופך הליכה יומיומית למסע ויזואלי על שבילים אגדיים בעולם. כל ק״מ ברגלית שלך הופך לצעד על קמינו דה סנטיאגו, שביל ישראל, ה-Appalachian Trail, Kumano Kodo, או Tour du Mont Blanc. כל תחנה שתעבור תיפתח עם סיפור קצר על המקום האמיתי.
✨ הקונספט הייחודי
במקום עוד tracker של צעדים — gamification אסתטי של הליכה: השביל הוא סיפור, התחנות הן ידיעות תרבותיות אמיתיות, והקצב הופך למסע ארוך-טווח של חודשים.
🎯 6 פיצ׳רים עיקריים
- 5 שבילים אגדיים — Camino (800 ק״מ), שביל ישראל (1,100 ק״מ), Appalachian (3,520 ק״מ), Kumano Kodo (70 ק״מ), Mont Blanc (170 ק״מ)
- תחנות עם סיפורים — לכל מילסטון שם, מיקום אמיתי וקטע סיפור (lore) שנפתח כשמגיעים
- SVG Trail Map — מסלול ויזואלי דינמי עם getPointAtLength, gradient stroke, current-position pulse marker
- Heatmap 90 ימים — ויזואליזציית קצב יומית עם 5 דרגות עוצמה ו-tooltip תאריך/ק״מ
- סטטיסטיקות חכמות — חישוב ETA אוטומטי לפי קצב ממוצע, מעקב streak, ספירת תחנות
- שיתוף + Multi-Store — Web Share API, IndexedDB עם 4 stores (walks/journeys/settings/achievements), Service Worker offline-first
🎨 עיצוב פרימיום
- פלטה ייחודית: Clay-Rust × Sage-Moss (טראקוטה + ירוק מוס) — אווירת שבילים, אדמה, עץ זית
- 3 תמונות codex: לוגו סקאלופ-שלל (סמל הקמינו) על alpha שקוף, hero אטמוספרי של שביל בזריחה זהובה עם דמות צליין בודדת באופק, empty state של מגף חבוק לצד גלעד אבנים על אדמה סדוקה
- Typography hierarchy: Frank Ruhl Libre + Instrument Serif italic + IBM Plex Mono + Heebo
- Glassmorphic surfaces, ambient orbs נושמים, film grain overlay, RTL native
- Micro-interactions: hover lifts, spring transitions, pulse animations, FAB עם halo
⚙️ טכנולוגיות
- Vanilla JS (IIFE), אין framework
- IndexedDB multi-store — 4 stores נפרדים (walks, journeys, settings, achievements)
- Service Worker — cache-first revalidate
- SVG dynamic — חישוב מיקום על Path עם getPointAtLength
- Web Share API + clipboard fallback
- PWA installable — manifest, 3 icon sizes (192/512/maskable)
