init

prd_digital_home.md

@@ -0,0 +1,435 @@
+# 「還有誰來我家」— 個人數位家園 MVP 產品需求文件
+
+---
+
+## 1. 修訂追蹤表
+
+| 版本 | 日期 | 修訂者 | 變更說明 |
+|------|------|--------|----------|
+| v0.1 | 2026-04-20 | AI PM | 初版 MVP PRD |
+
+---
+
+## 2. 背景簡介
+
+### 2.1 目標
+
+打造一個「可長期保存、可分層分享、可被朋友拜訪」的個人生活首頁，解決個人內容資產散落在推薦流、聊天群組與工具型平台之間的碎裂問題。
+
+### 2.2 背景
+
+- 台灣 18-39 歲上網率近 100%；Facebook 觸及 1,710 萬人、Instagram 1,130 萬人、LINE 月活 2,200 萬人
+- 主流平台重心在推薦流與 AI 排序，通訊平台把內容鎖在聊天脈絡，出版工具偏向文字發布
+- 官方《台灣網路報告》指出：演算法與資訊超載讓民眾失去自主性；短影音形成「無感成癮」
+- 沒有任何現有平台把「把照片、心情、生活事件與朋友互動放在同一個地方」做成對一般人友善的日常產品
+
+### 2.3 價值主張
+
+**大家都有貼文，卻沒有房子；都有帳號，卻沒有家。**
+
+本產品不是另一個綜合社群平台，而是個人數位家園——讓使用者把人生片段放回一個自己能掌控的地方。
+
+---
+
+## 3. 功能清單
+
+### 3.1 個人首頁與固定網址
+
+#### 3.1.1 個人首頁
+
+- **描述**：使用者登入後對外展示的主頁面，等同於「自己的家」的門面
+- **規格**：
+  - 固定網址格式：`username.還有誰來我家.com` 或 `還有誰來我家.com/username`
+  - 首頁由四個核心區塊組成：相簿（最優先）、網誌、留言板、心情
+  - 預設版型一套，療癒風格（柔色、大量留白、手寫感）
+  - 支援封面照片 + 大頭照 + 自我介紹
+- **驗收標準**：
+  - 訪客輸入網址可在 3 秒內看到完整首頁
+  - 四區塊均以卡片形式呈現，可一眼掌握最近更新
+
+#### 3.1.2 首頁訪客感與回訪提醒
+
+- **描述**：讓互動回到「拜訪你」而不是「刷到你」
+- **規格**：
+  - 訪客紀錄：「還有誰來我家」列表，顯示近期來訪的朋友頭像與時間
+  - 新動態提醒：朋友首頁有更新時，以「某某的家有新照片」形式通知（非 feed 推薦）
+  - 最近拜訪：首頁側邊顯示「最近來訪的朋友」
+- **驗收標準**：
+  - 訪客紀錄可正確記錄登入使用者的來訪
+  - 回訪提醒為 opt-in，預設開啟，可關閉
+  - 提醒不使用演算法排序，純依時間順序
+
+### 3.2 圖文貼文 + 相簿 + 時間軸
+
+#### 3.2.1 圖文貼文
+
+- **描述**：支援長文/短文/圖文的貼文系統，回歸無名小站 DNA 但手機優先
+- **規格**：
+  - 支援純文字、圖文混排、多圖貼文
+  - 單篇貼文圖片上限 20 張
+  - Markdown 或富文字編輯器（粗體、斜體、連結、圖片嵌入）
+  - 貼文可設定隱私層級（見 3.4）
+- **驗收標準**：
+  - 手機端發文流程 ≤ 3 步完成一篇圖文貼文
+  - 貼文在首頁時間軸上依時間倒序排列
+
+#### 3.2.2 相簿
+
+- **描述**：高容量、美觀、可整理的相簿系統，MVP 最核心功能
+- **規格**：
+  - 每本相簿可設名稱、描述、封面圖
+  - 相簿內照片支援拖曳排序
+  - 相簿可設隱私層級（見 3.4）
+  - 瀏覽模式：格狀縮圖 → 點擊全螢幕滑動瀏覽
+  - 免費版容量 5GB，付費版 50GB+
+- **驗收標準**：
+  - 上傳 50 張照片 ≤ 2 分鐘（正常網路環境）
+  - 相簿在首頁以封面圖 + 標題呈現
+
+#### 3.2.3 時間軸
+
+- **描述**：首頁的時間軸式呈現，整合貼文與相簿更新
+- **規格**：
+  - 時間軸按月/年分組
+  - 每個節點顯示：日期、類型圖示（貼文/相簿/心情）、摘要預覽
+  - 支援「跳到某年某月」快速導航
+- **驗收標準**：
+  - 時間軸載入 ≤ 2 秒（含 1 年內容）
+  - 可正確依時間排序不同類型內容
+
+### 3.3 留言板
+
+- **描述**：情感差異化核心功能，不只是功能懷舊，而是讓朋友「到你家留話」
+- **規格**：
+  - 留言板位於首頁下方，訪客可留言
+  - 留言支援文字 + 貼圖（基本表情符號集）
+  - 板主可回覆留言、刪除留言
+  - 留言依時間倒序排列
+  - 留言板可設隱私：誰可以留言（公開/朋友/指定名單）
+- **驗收標準**：
+  - 訪客登入後可留留言，留言即時顯示
+  - 板主收到新留言通知
+  - 留言板載入 ≤ 1 秒
+
+### 3.4 分層隱私
+
+- **描述**：讓使用者精細控制誰能看到什麼
+- **規格**：
+  - 四個隱私層級：
+    1. **公開**：任何人含未登入訪客可見
+    2. **連結可見**：知道連結的人可見（不含搜尋與推薦）
+    3. **朋友**：僅互相加入朋友者可見
+    4. **指定名單**：從朋友名單中勾選特定人可見
+  - 每篇貼文、每本相簿、留言板均可獨立設定
+  - 首頁整體隱私預設為「朋友」
+  - 提供隱私總覽頁面：一覽所有內容的隱私設定
+- **驗收標準**：
+  - 不同隱私層級的內容，未授權訪客無法透過任何方式存取（含直接 URL）
+  - 隱私設定變更即時生效
+  - 首月使用分層隱私（非全部公開）比例 > 50%
+
+### 3.5 匯入與匯出
+
+#### 3.5.1 匯入
+
+- **描述**：降低搬家摩擦，讓使用者從既有平台搬入內容
+- **規格**：
+  - 支援來源：
+    - Facebook 資料匯出檔（JSON/HTML）
+    - Instagram 資料匯出檔
+    - Google Takeout（Google 相簿）
+    - 通用 ZIP（圖片資料夾結構）
+  - 匯入時自動對應：照片→相簿、貼文→網誌
+  - 匯入保留原始日期時間
+  - 匯入進度條 + 預估時間
+- **驗收標準**：
+  - 匯入流程完成率 > 70%
+  - 1000 張照片匯入 ≤ 30 分鐘
+  - 匯入後內容可正確對應到對應區塊
+
+#### 3.5.2 匯出
+
+- **描述**：確保使用者隨時可帶走自己的資料，建立信任
+- **規格**：
+  - 一鍵匯出全部內容為標準格式（JSON + 原始圖片）
+  - 可選擇匯出範圍（全部/特定相簿/特定時間範圍）
+  - 匯出檔案保留完整 metadata（日期、隱私設定、留言）
+- **驗收標準**：
+  - 匯出檔案可在 24 小時內產生並提供下載
+  - 匯出內容可被標準工具開啟（圖片可看、JSON 可解析）
+
+### 3.6 朋友名單與關係
+
+- **描述**：支撐隱私分層與訪客感的基礎社交圖譜
+- **規格**：
+  - 朋友需雙方確認（非單向追蹤）
+  - 朋友名單可分組（標籤），供「指定名單」隱私使用
+  - 朋友申請需附簡短訊息
+  - 可封鎖使用者
+- **驗收標準**：
+  - 朋友申請流程 ≤ 2 步
+  - 封鎖後對方無法查看任何內容或留言
+
+---
+
+## 4. 功能流程
+
+### 4.1 新使用者引導流程
+
+```mermaid
+flowchart LR
+    A[註冊] --> B[選擇網址]
+    B --> C[設定大頭照/封面/自介]
+    C --> D{邀請朋友？}
+    D -- 是 --> E[發送邀請]
+    D -- 跳過 --> F[建立首本相簿]
+    E --> F
+    F --> G[發佈首篇貼文]
+    G --> H[進入首頁]
+    style A fill:#a5d8ff
+    style H fill:#b2f2bb
+```
+
+### 4.2 日常使用流程
+
+```mermaid
+flowchart TD
+    LOGIN[登入] --> HOME[首頁：含最近來訪]
+    HOME --> |發佈內容| POST[撰寫貼文/上傳照片]
+    HOME --> |建立相簿| ALBUM[建立相簿 → 上傳照片]
+    HOME --> |拜訪朋友| VISIT[朋友首頁]
+    HOME --> |查看提醒| NOTIFY[回訪提醒 → 朋友首頁]
+    HOME --> |管理| SETTINGS[隱私/匯入/匯出]
+    POST --> PRIV1[選擇隱私層級] --> PUB1[發佈 → 時間軸更新]
+    ALBUM --> PRIV2[選擇隱私層級] --> PUB2[發佈 → 首頁相簿卡更新]
+    VISIT --> |留言| GUESTBOOK[留言板]
+    VISIT --> |看內容| BROWSE[相簿/網誌]
+    GUESTBOOK --> REPLY[板主收到通知]
+    BROWSE --> VISITLOG[被記錄為訪客]
+    style LOGIN fill:#a5d8ff
+    style PUB1 fill:#b2f2bb
+    style PUB2 fill:#b2f2bb
+    style VISITLOG fill:#d0bfff
+```
+
+### 4.3 匯入流程
+
+```mermaid
+flowchart TD
+    START[選擇匯入來源] --> SRC{來源類型}
+    SRC -- Facebook --> FB[上傳 FB 匯出檔]
+    SRC -- Instagram --> IG[上傳 IG 匯出檔]
+    SRC -- Google --> GG[上傳 Google Takeout]
+    SRC -- ZIP --> ZIP[上傳 ZIP 檔]
+    FB --> PREVIEW
+    IG --> PREVIEW
+    GG --> PREVIEW
+    ZIP --> PREVIEW
+    PREVIEW[預覽對應結果] --> MAP{對應正確？}
+    MAP -- 是 --> CONFIRM[確認匯入]
+    MAP -- 否 --> ADJUST[手動調整對應] --> CONFIRM
+    CONFIRM --> PROCESS[背景處理中...]
+    PROCESS --> DONE[完成通知]
+    style START fill:#a5d8ff
+    style DONE fill:#b2f2bb
+    style PROCESS fill:#ffd8a8
+```
+
+### 4.4 訪客瀏覽與隱私判斷流程
+
+```mermaid
+flowchart TD
+    ENTRY[輸入網址/點擊連結] --> AUTH{訪客身份}
+    AUTH -- 未登入 --> PUB{內容隱私？}
+    AUTH -- 已登入 --> FRIEND{是朋友？}
+    PUB -- 公開 --> SHOW1[顯示首頁]
+    PUB -- 非公開 --> DENY1[無法存取]
+    FRIEND -- 是 --> SHOW2[顯示完整內容]
+    FRIEND -- 否 --> CHECK{在指定名單？}
+    CHECK -- 是 --> SHOW3[顯示指定內容]
+    CHECK -- 否 --> PUB2{內容隱私？}
+    PUB2 -- 公開/連結可見 --> SHOW4[顯示對應內容]
+    PUB2 -- 朋友/指定名單 --> DENY2[無法存取]
+    SHOW1 --> BROWSE[瀏覽相簿/網誌]
+    SHOW2 --> BROWSE
+    SHOW3 --> BROWSE
+    SHOW4 --> BROWSE
+    BROWSE --> GUEST[留言/互動]
+    BROWSE --> LOG[被記錄為訪客]
+    GUEST --> LOG
+    style ENTRY fill:#a5d8ff
+    style DENY1 fill:#ffc9c9
+    style DENY2 fill:#ffc9c9
+    style LOG fill:#d0bfff
+```
+
+### 4.5 隱私層級決策流程
+
+```mermaid
+flowchart LR
+    CONTENT[建立/編輯內容] --> Q1{要讓誰看到？}
+    Q1 -- 所有人 --> L1[公開]
+    Q1 -- 知道連結的人 --> L2[連結可見]
+    Q1 -- 只有朋友 --> L3[朋友]
+    Q1 -- 特定人 --> L4[指定名單 → 勾選朋友]
+    L1 --> SAVE[儲存]
+    L2 --> SAVE
+    L3 --> SAVE
+    L4 --> SAVE
+    style CONTENT fill:#a5d8ff
+    style L1 fill:#b2f2bb
+    style L2 fill:#ffd8a8
+    style L3 fill:#d0bfff
+    style L4 fill:#fff3bf
+```
+
+（詳細流程圖另見 `flow_overview.excalidraw`）
+
+---
+
+## 5. 功能結構
+
+```mermaid
+graph TD
+    ROOT[還有誰來我家]
+
+    ROOT --> HOME[個人首頁]
+    ROOT --> ALBUM[相簿]
+    ROOT --> BLOG[網誌]
+    ROOT --> GUEST[留言板]
+    ROOT --> MOOD[心情]
+    ROOT --> FRIEND[朋友]
+    ROOT --> PRIV[隱私設定]
+    ROOT --> IMPTEXP[匯入/匯出]
+    ROOT --> NOTIF[通知]
+
+    HOME --> H1[封面照片 + 大頭照 + 自介]
+    HOME --> H2[四區塊卡片]
+    HOME --> H3[時間軸]
+    HOME --> H4[最近來訪]
+    HOME --> H5[訪客紀錄]
+
+    ALBUM --> A1[相簿列表]
+    ALBUM --> A2[相簿內頁：照片瀏覽]
+    ALBUM --> A3[相簿設定：名稱/封面/隱私]
+    ALBUM --> A4[上傳]
+
+    BLOG --> B1[貼文列表]
+    BLOG --> B2[貼文編輯器]
+    BLOG --> B3[貼文內頁]
+    BLOG --> B4[貼文設定：隱私]
+
+    GUEST --> G1[留言列表]
+    GUEST --> G2[留言輸入]
+    GUEST --> G3[留言管理：回覆/刪除]
+
+    MOOD --> M1[當前心情狀態]
+    MOOD --> M2[心情歷史]
+
+    FRIEND --> F1[朋友名單]
+    FRIEND --> F2[朋友分組：標籤]
+    FRIEND --> F3[朋友申請]
+    FRIEND --> F4[封鎖管理]
+
+    PRIV --> P1[內容隱私總覽]
+    PRIV --> P2[個別內容隱私]
+    PRIV --> P3[留言板權限]
+
+    IMPTEXP --> IE1[匯入：來源選擇]
+    IMPTEXP --> IE2[匯入：預覽與對應]
+    IMPTEXP --> IE3[匯入：進度]
+    IMPTEXP --> IE4[匯出：範圍選擇]
+    IMPTEXP --> IE5[匯出：下載]
+
+    NOTIF --> N1[新留言通知]
+    NOTIF --> N2[朋友更新通知]
+    NOTIF --> N3[回訪提醒]
+
+    style ROOT fill:#d0bfff
+    style HOME fill:#a5d8ff
+    style ALBUM fill:#a5d8ff
+    style BLOG fill:#b2f2bb
+    style GUEST fill:#fff3bf
+    style MOOD fill:#ffd8a8
+    style FRIEND fill:#d0bfff
+    style PRIV fill:#ffd8a8
+    style IMPTEXP fill:#b2f2bb
+    style NOTIF fill:#ffd8a8
+```
+
+（結構圖另見 `structure.excalidraw`）
+
+---
+
+## 6. 頁面設計（Wireframe）
+
+### 6.1 個人首頁
+
+見 `wireframe_homepage.excalidraw`
+
+**重點設計原則**：
+- 手機優先，桌面端適度展開
+- 四區塊以卡片排列，相簿佔最大面積
+- 留言板在頁面下方，模擬「家門口的留言條」感
+- 最近來訪以小頭像列呈現，帶「還有誰來我家」標題
+
+### 6.2 相簿頁
+
+見 `wireframe_album.excalidraw`
+
+**重點設計原則**：
+- 格狀縮圖排列，3 欄（手機 2 欄）
+- 點擊進入全螢幕滑動瀏覽
+- 相簿封面大圖 + 標題 + 照片數量
+
+### 6.3 貼文/時間軸頁
+
+見 `wireframe_timeline.excalidraw`
+
+**重點設計原則**：
+- 時間軸左側時間線，右側內容卡
+- 依月分組，可折疊
+- 不同類型內容用圖示區分
+
+### 6.4 留言板頁
+
+見 `wireframe_guestbook.excalidraw`
+
+**重點設計原則**：
+- 留言卡式排列，含頭像、暱稱、時間、內容
+- 板主回覆縮排在原留言下方
+- 底部固定留言輸入框
+
+### 6.5 隱私設定 & 匯入匯出頁
+
+見 `wireframe_settings.excalidraw`
+
+**重點設計原則**：
+- 隱私設定以列表呈現，每行一內容+目前層級+修改按鈕
+- 匯入以步驟式引導，大面積拖放區
+- 匯出一鍵按鈕 + 進度條
+
+---
+
+## 附錄：早期驗證指標
+
+| 指標 | 門檻 |
+|------|------|
+| 新註冊 24h 內完成「首頁+首篇貼文+首本相簿」 | > 40% |
+| 首月 ≥ 2 次回訪並新增內容 | > 25% |
+| 首次分享後被訪客留言 | > 15% |
+| 匯入流程完成率 | > 70% |
+| 使用分層隱私（非全公開）比例 | > 50% |
+
+---
+
+## 附錄：商業模式（Freemium）
+
+| 免費版 | 付費版 |
+|--------|--------|
+| 5GB 相簿容量 | 50GB+ 相簿容量 |
+| 1 種版型 | 多種主題與版型 |
+| 還有誰來我家.com/username | 自訂網域 |
+| 基本隱私名單 | 進階隱私名單（無限分組） |
+| — | 家庭方案 |
+| — | 紀念頁與列印/輸出服務 |