云打卡 · 唤醒陌生人

刷到,就出发。让风景把你叫醒。

一个面向 文旅场景 的"沉浸式打卡唤醒"项目。 线下打卡(扫码拍摄) → 线上飞入云打卡墙 → 唤醒更多游客出发。

---

一、项目核心

用户沉迷刷视频，出来走走！ 项目核心是用游客的实时打卡，唤醒远方刷视频的陌生人

景区与平台之间缺少一个"轻量、有情绪、能转化"的中间层。

云打卡 提供极简打卡仪式（拍 1 张图 + AI 生成唤醒短句），打通"线上唤醒 → 线下到达 → 线上回流"闭环。

---

二、功能体验

游客端(现场)

• 在景区扫描二维码进入。
• 用图片/3秒景色打卡
• 系统生成沉浸式卡片 + AI 唤醒短句。
• 卡片可一键飞入合作景区打卡墙大屏。
• 页面下方提示下一站足迹(基于位置 + 情绪标签推荐)。

三、商业模式

1. 文旅局合作:景区购买"季节优质镜头"曝光广告,替代传统短视频投放。
2. 平台分成:卡片中"购票 / 行程"按钮跳转,转化分成。

---

四、技术架构

React 19 + Next.js + TypeScript + Vite
TailwindCSS v4
Lucide React   // 图标
pnpm           // 包管理

目录结构:

yun-daka/
├── public/
│   └── mock/                # 景区图片资源
├── src/
│   ├── routes/
│   │   ├── mobile/          # /m   游客端(扫码访问)
│   │   └── wall/            # /wall 大屏云打卡墙
│   ├── components/
│   │   ├── ImmersiveCard/   # 沉浸卡片组件
│   │   ├── Capture/         # 拍照 + 倒计时
│   │   └── WallGrid/        # 打卡墙瀑布流
│   ├── data/
│   │   ├── scenes.ts        # 景区元数据
│   │   └── poems.ts         # 预埋 AI 短句
│   ├── hooks/
│   │   ├── useCamera.ts     # getUserMedia 封装
│   │   └── useWallSync.ts   # BroadcastChannel 大屏同步
│   ├── store/
│   │   └── cards.ts         # Zustand:卡片池
│   └── App.tsx
├── package.json
├── pnpm-lock.yaml
└── README.md

---