ogt-docs-define-feature

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

OGT Docs - Define Feature

OGT Docs - 定义功能

Complete guide for creating feature definition documents with phased delivery.
创建含分阶段交付的功能定义文档完整指南。

Overview

概述

Feature definitions specify WHAT a feature does, WHO it's for, and HOW it will be delivered in phases. Each feature is a folder containing the main definition, MVP scope, phase documents, and completion criteria.
mermaid
flowchart TD
    subgraph feature ["Feature Definition Structure"]
        F[feature.md<br/>Core definition]
        M[mvp.md<br/>MVP scope & phases]
        P0[phase_0.md<br/>Foundation]
        P1[phase_1.md<br/>Enhancement]
        P2[phase_2.md<br/>Advanced]
        N[nice_to_have.md<br/>Future ideas]
        O[out_of_scope.md<br/>Explicit exclusions]
    end

    F --> M
    M --> P0
    M --> P1
    M --> P2
    M -.-> N
    F --> O
功能定义明确了某个功能是什么面向谁,以及如何分阶段交付。每个功能对应一个文件夹,包含核心定义、MVP范围、各阶段文档和完成标准。
mermaid
flowchart TD
    subgraph feature ["Feature Definition Structure"]
        F[feature.md<br/>Core definition]
        M[mvp.md<br/>MVP scope & phases]
        P0[phase_0.md<br/>Foundation]
        P1[phase_1.md<br/>Enhancement]
        P2[phase_2.md<br/>Advanced]
        N[nice_to_have.md<br/>Future ideas]
        O[out_of_scope.md<br/>Explicit exclusions]
    end

    F --> M
    M --> P0
    M --> P1
    M --> P2
    M -.-> N
    F --> O

When to Use This Skill

何时使用该方法

Use
ogt-docs-define-feature
when:
  • Defining a new product feature
  • Specifying a user-facing capability
  • Planning phased delivery of functionality
  • Establishing MVP scope and definition of done
  • Documenting feature requirements before implementation
在以下场景使用
ogt-docs-define-feature
  • 定义新产品功能
  • 明确用户端可用能力
  • 规划功能的分阶段交付
  • 确定MVP范围与完成标准
  • 在开发前记录功能需求

Folder Structure

文件夹结构

docs/definitions/features/
├── global_search/
│   ├── feature.md              # Core feature definition
│   ├── mvp.md                  # MVP scope and phase inclusion
│   ├── phase_0.md              # Phase 0: Foundation/Core
│   ├── phase_1.md              # Phase 1: Enhanced
│   ├── phase_2.md              # Phase 2: Advanced
│   ├── nice_to_have.md         # Future enhancements
│   ├── out_of_scope.md         # Explicit exclusions
│   ├── dependencies.md         # Technical dependencies
│   ├── user_stories.md         # User stories (optional)
│   ├── wireframes/             # Visual designs (optional)
│   │   ├── search_modal.png
│   │   └── results_list.png
│   ├── .version
│   ├── .approved
│   └── .approved_by_product
├── user_authentication/
│   ├── feature.md
│   ├── mvp.md
│   ├── phase_0.md
│   ├── phase_1.md
│   ├── out_of_scope.md
│   └── .version
└── campaign_manager/
    ├── feature.md
    ├── mvp.md
    ├── phase_0.md
    ├── phase_1.md
    ├── phase_2.md
    ├── phase_3.md
    ├── nice_to_have.md
    ├── out_of_scope.md
    └── .version

docs/definitions/features/
├── global_search/
│   ├── feature.md              # 核心功能定义
│   ├── mvp.md                  # MVP范围与阶段划分
│   ├── phase_0.md              # 阶段0:基础/核心
│   ├── phase_1.md              # 阶段1:增强
│   ├── phase_2.md              # 阶段2:进阶
│   ├── nice_to_have.md         # 未来增强方向
│   ├── out_of_scope.md         # 明确排除项
│   ├── dependencies.md         # 技术依赖
│   ├── user_stories.md         # 用户故事(可选)
│   ├── wireframes/             # 视觉设计(可选)
│   │   ├── search_modal.png
│   │   └── results_list.png
│   ├── .version
│   ├── .approved
│   └── .approved_by_product
├── user_authentication/
│   ├── feature.md
│   ├── mvp.md
│   ├── phase_0.md
│   ├── phase_1.md
│   ├── out_of_scope.md
│   └── .version
└── campaign_manager/
    ├── feature.md
    ├── mvp.md
    ├── phase_0.md
    ├── phase_1.md
    ├── phase_2.md
    ├── phase_3.md
    ├── nice_to_have.md
    ├── out_of_scope.md
    └── .version

Feature Lifecycle

功能生命周期

mermaid
flowchart LR
    subgraph lifecycle ["Feature Definition Lifecycle"]
        D[draft] --> R[review]
        R --> A[approved]
        R --> REJ[rejected]
        REJ --> D
        A --> IP[in_progress]
        IP --> DONE[completed]
        A --> DEP[deprecated]
    end

    style D fill:#fef3c7
    style R fill:#e0e7ff
    style A fill:#d1fae5
    style REJ fill:#fecaca
    style IP fill:#dbeafe
    style DONE fill:#a7f3d0
    style DEP fill:#e5e7eb
mermaid
flowchart LR
    subgraph lifecycle ["Feature Definition Lifecycle"]
        D[draft] --> R[review]
        R --> A[approved]
        R --> REJ[rejected]
        REJ --> D
        A --> IP[in_progress]
        IP --> DONE[completed]
        A --> DEP[deprecated]
    end

    style D fill:#fef3c7
    style R fill:#e0e7ff
    style A fill:#d1fae5
    style REJ fill:#fecaca
    style IP fill:#dbeafe
    style DONE fill:#a7f3d0
    style DEP fill:#e5e7eb

Draft State

草稿状态

Feature is being defined, not ready for review.
{feature_slug}/
├── feature.md
├── mvp.md
├── phase_0.md
├── .version
└── .draft
功能正在定义中,尚未准备好评审。
{feature_slug}/
├── feature.md
├── mvp.md
├── phase_0.md
├── .version
└── .draft

Approved State

已批准状态

Feature definition approved, ready for implementation.
{feature_slug}/
├── feature.md
├── mvp.md
├── phase_0.md
├── phase_1.md
├── .version
├── .approved
└── .approved_by_product
功能定义已通过评审,可进入开发阶段。
{feature_slug}/
├── feature.md
├── mvp.md
├── phase_0.md
├── phase_1.md
├── .version
├── .approved
└── .approved_by_product

In Progress State

开发中状态

Feature is being implemented.
{feature_slug}/
├── feature.md
├── mvp.md
├── phase_0.md
├── phase_1.md
├── .version
├── .approved
├── .in_progress
├── .current_phase              # Content: "0" or "1" etc.
└── .implementation_started_at
功能正在开发。
{feature_slug}/
├── feature.md
├── mvp.md
├── phase_0.md
├── phase_1.md
├── .version
├── .approved
├── .in_progress
├── .current_phase              # 内容:"0" 或 "1" 等
└── .implementation_started_at

Completed State

已完成状态

All MVP phases implemented.
{feature_slug}/
├── feature.md
├── mvp.md
├── phase_0.md
├── phase_1.md
├── .version
├── .approved
├── .completed
├── .completed_at
└── .verified

所有MVP阶段开发完成。
{feature_slug}/
├── feature.md
├── mvp.md
├── phase_0.md
├── phase_1.md
├── .version
├── .approved
├── .completed
├── .completed_at
└── .verified

Core Files

核心文件

feature.md

feature.md

The primary feature definition document.
主要的功能定义文档。

Example: global_search/feature.md

示例:global_search/feature.md

markdown
undefined
markdown
undefined

Feature: Global Search

功能:全局搜索

Overview

概述

A universal search interface accessible via Ctrl+K that searches across all content types (creatures, items, abilities, campaigns, etc.) with fuzzy matching, instant results, and keyboard navigation.
通过Ctrl+K唤起的通用搜索界面,可跨所有内容类型(生物、物品、技能、战役等)进行模糊匹配,提供即时结果与键盘导航。

Problem Statement

问题陈述

Users currently navigate through multiple menus to find content. There's no way to quickly search across all content types from anywhere in the application.
用户目前需要通过多个菜单导航查找内容,无法从应用内任意位置快速跨所有内容类型搜索。

Target Users

目标用户

  • Primary: Power users who know what they're looking for
  • Secondary: New users exploring available content
  • Tertiary: GMs preparing sessions who need quick access
  • 核心用户:明确知道所需内容的高级用户
  • 次要用户:探索可用内容的新用户
  • 边缘用户:需要快速访问内容的游戏主持(GM)

User Value

用户价值

  • Find any content in <2 seconds
  • Stay in flow without menu navigation
  • Discover related content through search
  • 2秒内找到任意内容
  • 无需菜单导航,保持操作流畅性
  • 通过搜索发现相关内容

Success Metrics

成功指标

MetricTargetMeasurement
Time to find content<2 secondsUser testing
Search usage>50% of usersAnalytics
Search success rate>80%Analytics
User satisfaction>4/5Survey
指标目标值测量方式
内容查找时间<2秒用户测试
搜索使用率>50%的用户数据分析
搜索成功率>80%数据分析
用户满意度>4/5调研

Key Capabilities

核心能力

  1. Universal Access: Ctrl+K from anywhere opens search
  2. Fuzzy Matching: "fir" matches "Fireball", "Fire Elemental"
  3. Instant Results: Results appear as user types
  4. Keyboard Navigation: Arrow keys, Enter to select
  5. Result Preview: Hover/focus shows preview
  6. Recent Searches: Quick access to recent queries
  7. Type Filtering: Filter by content type
  1. 全局访问:任意位置按下Ctrl+K可打开搜索
  2. 模糊匹配:"fir"可匹配"Fireball"、"Fire Elemental"
  3. 即时结果:用户输入时实时显示结果
  4. 键盘导航:方向键选择,Enter确认
  5. 结果预览:悬停/聚焦时显示预览
  6. 最近搜索:快速访问近期查询
  7. 类型过滤:按内容类型筛选

User Experience

用户体验

Happy Path

理想流程

  1. User presses Ctrl+K
  2. Search modal appears with cursor in input
  3. User types query
  4. Results appear instantly, ranked by relevance
  5. User navigates with arrow keys
  6. User presses Enter to go to selected result
  7. Search modal closes, user is at selected content
  1. 用户按下Ctrl+K
  2. 搜索模态框弹出,光标自动定位到输入框
  3. 用户输入查询内容
  4. 结果实时显示,按相关性排序
  5. 用户用方向键导航
  6. 用户按下Enter跳转到选中结果
  7. 搜索模态框关闭,用户进入选中内容页面

Edge Cases

边缘情况

  • No results: Show "No results" with suggestions
  • Many results: Show top 10 with "See all X results"
  • Slow connection: Show loading state, then results
  • Error: Show error message with retry option
  • 无结果:显示“无匹配结果”及建议
  • 大量结果:显示前10条及“查看全部X条结果”
  • 网络缓慢:显示加载状态,加载完成后展示结果
  • 错误:显示错误信息及重试选项

Technical Considerations

技术考量

  • Search index must be built at app boot
  • Index must update when content changes
  • Search must be <16ms for instant feel
  • Consider debounce for API if server-side
  • 搜索索引需在应用启动时构建
  • 内容变更时索引需同步更新
  • 搜索响应需<16ms以保证即时感
  • 若为服务端搜索,需考虑输入防抖

Dependencies

依赖项

  • MiniSearch library (or similar)
  • Keyboard shortcut system
  • Content type registry
  • MiniSearch库(或同类工具)
  • 键盘快捷键系统
  • 内容类型注册器

Related Features

相关功能

  • Content Browsing
  • Quick Actions
  • 内容浏览
  • 快速操作

Related Definitions

相关定义

  • Search Service

---
  • 搜索服务

---

mvp.md

mvp.md

Defines MVP scope, which phases are included, and definition of done.
定义MVP范围、包含的阶段及完成标准。

Example: global_search/mvp.md

示例:global_search/mvp.md

markdown
undefined
markdown
undefined

MVP: Global Search

MVP:全局搜索

MVP Philosophy

MVP理念

The MVP must deliver core value to users while being achievable in a reasonable timeframe. It's better to ship a focused, working feature than a broad, buggy one.
MVP需为用户传递核心价值,同时确保在合理时间内可实现。发布一个聚焦、可用的功能,远胜于一个宽泛、bug频发的功能。

Phase Inclusion

阶段包含情况

PhaseIncluded in MVPRationale
Phase 0✅ YesCore functionality
Phase 1✅ YesEssential UX polish
Phase 2❌ NoNice-to-have, post-launch
Phase 3+❌ NoFuture enhancement
阶段是否纳入MVP理由
阶段0✅ 是核心功能
阶段1✅ 是关键UX优化
阶段2❌ 否锦上添花功能,上线后迭代
阶段3+❌ 否未来增强方向

MVP Scope Summary

MVP范围摘要

In Scope (Must Have)

纳入范围(必备)

  • Ctrl+K shortcut opens search modal
  • Search input with fuzzy matching
  • Results from: creatures, items, abilities
  • Keyboard navigation (arrows, enter, escape)
  • Click to navigate to result
  • Basic result display (name, type, icon)
  • Ctrl+K快捷键打开搜索模态框
  • 带模糊匹配的搜索输入框
  • 覆盖内容:生物、物品、技能
  • 键盘导航(方向键、Enter、Escape)
  • 点击结果跳转
  • 基础结果展示(名称、类型、图标)

Out of Scope (Phase 2+)

排除范围(阶段2+)

  • Recent searches
  • Search history
  • Advanced filters
  • Search analytics
  • Saved searches
  • Search suggestions/autocomplete
  • Result previews on hover
  • 最近搜索
  • 搜索历史
  • 高级筛选
  • 搜索数据分析
  • 保存搜索
  • 搜索建议/自动补全
  • 悬停结果预览

Definition of Done

完成标准

Functional Requirements

功能需求

  • Ctrl+K opens search modal from any page
  • Escape closes search modal
  • Typing in input triggers search
  • Results appear within 100ms of typing
  • Results include creatures, items, abilities
  • Fuzzy matching works (e.g., "fir" → "Fireball")
  • Results are ranked by relevance
  • Arrow keys navigate results
  • Enter navigates to selected result
  • Clicking result navigates to it
  • "No results" state displays correctly
  • Loading state displays during search
  • Error state displays on failure
  • 任意页面按下Ctrl+K可打开搜索模态框
  • Escape可关闭搜索模态框
  • 输入内容触发搜索
  • 输入后100ms内显示结果
  • 结果包含生物、物品、技能
  • 模糊匹配生效(如"fir" → "Fireball")
  • 结果按相关性排序
  • 方向键可导航结果
  • Enter可跳转到选中结果
  • 点击结果可跳转
  • 无结果状态显示正确
  • 搜索时显示加载状态
  • 失败时显示错误状态

Technical Requirements

技术需求

  • Search index builds at app initialization
  • Search executes in <16ms
  • Index updates when content changes
  • TypeScript compiles without errors
  • No console errors during usage
  • Works on Chrome, Firefox, Safari
  • Works on desktop (mobile is Phase 2)
  • 应用初始化时构建搜索索引
  • 搜索执行时间<16ms
  • 内容变更时索引自动更新
  • TypeScript编译无错误
  • 使用过程中控制台无错误
  • 支持Chrome、Firefox、Safari
  • 桌面端可用(移动端为阶段2)

Quality Requirements

质量需求

  • Keyboard focus is managed correctly
  • Accessible via screen reader
  • Respects user's color scheme preference
  • Animations are smooth (60fps)
  • No memory leaks on repeated open/close
  • 键盘焦点管理正确
  • 支持屏幕阅读器访问
  • 遵循用户配色方案偏好
  • 动画流畅(60fps)
  • 重复打开/关闭无内存泄漏

Documentation Requirements

文档需求

  • User-facing help text written
  • Technical implementation documented
  • Keyboard shortcuts documented
  • 撰写面向用户的帮助文本
  • 记录技术实现细节
  • 文档化键盘快捷键

MVP Timeline

MVP时间线

MilestoneTarget DateStatus
Definition approved{date}
Phase 0 complete{date}
Phase 1 complete{date}
MVP verification{date}
MVP launch{date}
里程碑目标日期状态
定义通过评审{date}
阶段0完成{date}
阶段1完成{date}
MVP验证{date}
MVP发布{date}

MVP Verification Checklist

MVP验证清单

Before declaring MVP complete, verify each Definition of Done item:
markdown
undefined
宣布MVP完成前,需验证以下所有完成标准项:
markdown
undefined

MVP Verification: Global Search

MVP验证:全局搜索

Date: {date} Verified by: {name}
日期:{date} 验证人:{name}

Functional

功能项

  • Ctrl+K opens modal: Tested on all pages
  • Escape closes modal: Works correctly
  • Search triggers on typing: 50ms debounce, works ...
  • Ctrl+K打开模态框:所有页面测试通过
  • Escape关闭模态框:功能正常
  • 输入触发搜索:50ms防抖,功能正常 ...

Technical

技术项

  • Index builds at init: Verified in console, 200ms
  • Search <16ms: Measured at 8ms average ...
  • 初始化时构建索引:控制台验证,耗时200ms
  • 搜索耗时<16ms:平均8ms ...

Result: PASS / FAIL

结果:通过 / 不通过

undefined

---
undefined

---

phase_0.md

phase_0.md

Foundation phase - the minimum viable core.
基础阶段 - 最小可行核心。

Example: global_search/phase_0.md

示例:global_search/phase_0.md

markdown
undefined
markdown
undefined

Phase 0: Global Search Foundation

阶段0:全局搜索基础

Phase Goal

阶段目标

Establish the core search infrastructure and basic UI. Users can search and find content, but UX is minimal.
搭建核心搜索基础设施与基础UI。用户可搜索并找到内容,但UX较为基础。

Scope

范围

Included

纳入内容

  • Search index service (MiniSearch integration)
  • Basic search modal component
  • Keyboard shortcut registration (Ctrl+K)
  • Search input field
  • Basic results list
  • Navigation to result
  • Index: creatures, items, abilities
  • 搜索索引服务(MiniSearch集成)
  • 基础搜索模态框组件
  • 键盘快捷键注册(Ctrl+K)
  • 搜索输入框
  • 基础结果列表
  • 结果跳转
  • 索引覆盖:生物、物品、技能

Not Included (Later Phases)

排除内容(后续阶段)

  • Keyboard navigation of results
  • Result type icons
  • Result previews
  • Recent searches
  • Filters
  • 结果键盘导航
  • 结果类型图标
  • 结果预览
  • 最近搜索
  • 筛选器

Deliverables

交付物

1. SearchIndexService

1. SearchIndexService

typescript
// front/services/search-index.ts
interface SearchIndexService {
  initialize(): Promise<void>;
  search(query: string): SearchResult[];
  addDocument(doc: Searchable): void;
  removeDocument(id: string): void;
}
Acceptance Criteria:
  • Indexes all creatures, items, abilities at init
  • Search returns results in <16ms
  • Fuzzy matching works
  • Results sorted by relevance
typescript
// front/services/search-index.ts
interface SearchIndexService {
  initialize(): Promise<void>;
  search(query: string): SearchResult[];
  addDocument(doc: Searchable): void;
  removeDocument(id: string): void;
}
验收标准:
  • 初始化时索引所有生物、物品、技能
  • 搜索返回结果耗时<16ms
  • 模糊匹配生效
  • 结果按相关性排序

2. GlobalSearchModal

2. GlobalSearchModal

typescript
// front/components/features/GlobalSearchModal.tsx
interface GlobalSearchModalProps {
  isOpen: boolean;
  onClose: () => void;
  onSelect: (result: SearchResult) => void;
}
Acceptance Criteria:
  • Opens centered on screen
  • Has search input focused on open
  • Shows results below input
  • Closes on Escape or outside click
typescript
// front/components/features/GlobalSearchModal.tsx
interface GlobalSearchModalProps {
  isOpen: boolean;
  onClose: () => void;
  onSelect: (result: SearchResult) => void;
}
验收标准:
  • 居中显示
  • 打开时自动聚焦搜索输入框
  • 输入框下方显示结果
  • 按Escape或点击外部可关闭

3. Keyboard Shortcut

3. 键盘快捷键

Acceptance Criteria:
  • Ctrl+K opens search from anywhere
  • Cmd+K works on Mac
  • Doesn't conflict with browser shortcuts
  • Works when input is focused elsewhere
验收标准:
  • 任意位置按下Ctrl+K可打开搜索
  • Mac端Cmd+K生效
  • 不与浏览器快捷键冲突
  • 其他输入框聚焦时仍可触发

4. Results Display

4. 结果展示

Acceptance Criteria:
  • Shows result name
  • Shows result type (creature/item/ability)
  • Clickable to navigate
  • Shows "No results" when empty
验收标准:
  • 显示结果名称
  • 显示结果类型(生物/物品/技能)
  • 可点击跳转
  • 无结果时显示“无匹配结果”

Technical Design

技术设计

mermaid
flowchart TD
    subgraph init ["Initialization"]
        A[App boots] --> B[SearchIndexService.initialize]
        B --> C[Fetch all content]
        C --> D[Build MiniSearch index]
    end

    subgraph search ["Search Flow"]
        E[User types] --> F[SearchIndexService.search]
        F --> G[MiniSearch query]
        G --> H[Return ranked results]
    end

    subgraph select ["Selection Flow"]
        I[User clicks result] --> J[onSelect callback]
        J --> K[Router navigation]
        K --> L[Modal closes]
    end
mermaid
flowchart TD
    subgraph init ["Initialization"]
        A[App boots] --> B[SearchIndexService.initialize]
        B --> C[Fetch all content]
        C --> D[Build MiniSearch index]
    end

    subgraph search ["Search Flow"]
        E[User types] --> F[SearchIndexService.search]
        F --> G[MiniSearch query]
        G --> H[Return ranked results]
    end

    subgraph select ["Selection Flow"]
        I[User clicks result] --> J[onSelect callback]
        J --> K[Router navigation]
        K --> L[Modal closes]
    end

Files to Create

待创建文件

FilePurpose
front/services/search-index.ts
Search index service
front/components/features/GlobalSearchModal.tsx
Search modal UI
front/hooks/use-global-search.ts
Search state and logic
front/types/search.ts
Search-related types
文件用途
front/services/search-index.ts
搜索索引服务
front/components/features/GlobalSearchModal.tsx
搜索模态框UI
front/hooks/use-global-search.ts
搜索状态与逻辑
front/types/search.ts
搜索相关类型

Files to Modify

待修改文件

FileChange
front/app/App.tsx
Add keyboard listener
front/services/index.ts
Export SearchIndexService
File变更内容
front/app/App.tsx
添加键盘监听器
front/services/index.ts
导出SearchIndexService

Definition of Done (Phase 0)

阶段0完成标准

  • SearchIndexService implemented and tested
  • GlobalSearchModal renders correctly
  • Ctrl+K/Cmd+K opens search
  • Search returns relevant results
  • Clicking result navigates correctly
  • TypeScript compiles clean
  • No console errors
  • SearchIndexService已实现并测试
  • GlobalSearchModal渲染正常
  • Ctrl+K/Cmd+K可打开搜索
  • 搜索返回相关结果
  • 点击结果可正确跳转
  • TypeScript编译无错误
  • 控制台无错误

Estimated Effort

预估工作量

Medium (4-8 hours)
中等(4-8小时)

Dependencies

依赖项

  • MiniSearch library must be installed
  • Content services must expose getAllX() methods

---
  • 需安装MiniSearch库
  • 内容服务需暴露getAllX()方法

---

phase_1.md

phase_1.md

Enhancement phase - UX improvements.
增强阶段 - UX优化。

Example: global_search/phase_1.md

示例:global_search/phase_1.md

markdown
undefined
markdown
undefined

Phase 1: Global Search Enhancement

阶段1:全局搜索增强

Phase Goal

阶段目标

Improve UX with keyboard navigation, visual polish, and better result display. Make search feel professional and efficient.
通过键盘导航、视觉优化与更优结果展示提升UX,让搜索体验专业且高效。

Prerequisites

前置条件

  • Phase 0 complete and working
  • 阶段0已完成且可用

Scope

范围

Included

纳入内容

  • Keyboard navigation (arrow keys)
  • Result type icons
  • Result highlighting (matched text)
  • Empty state improvement
  • Loading state
  • Animation/transitions
  • Debounced input
  • 键盘导航(方向键)
  • 结果类型图标
  • 结果高亮(匹配文本)
  • 空状态优化
  • 加载状态
  • 动画/过渡效果
  • 输入防抖

Not Included (Later Phases)

排除内容(后续阶段)

  • Recent searches
  • Filters
  • Previews
  • Saved searches
  • 最近搜索
  • 筛选器
  • 预览
  • 保存搜索

Deliverables

交付物

1. Keyboard Navigation

1. 键盘导航

Acceptance Criteria:
  • Arrow down moves to next result
  • Arrow up moves to previous result
  • Selection wraps at top/bottom
  • Enter navigates to selected
  • Visual indicator on selected result
验收标准:
  • 向下箭头切换到下一个结果
  • 向上箭头切换到上一个结果
  • 首尾结果可循环切换
  • Enter可跳转到选中结果
  • 选中结果有视觉标识

2. Result Type Icons

2. 结果类型图标

Acceptance Criteria:
  • Creature results show creature icon
  • Item results show item icon
  • Ability results show ability icon
  • Icons are consistent with app design
验收标准:
  • 生物结果显示生物图标
  • 物品结果显示物品图标
  • 技能结果显示技能图标
  • 图标与应用设计风格一致

3. Match Highlighting

3. 匹配文本高亮

Acceptance Criteria:
  • Matched text is highlighted in results
  • Highlighting is visually distinct
  • Works with fuzzy matches
验收标准:
  • 结果中匹配文本高亮显示
  • 高亮效果视觉区分明显
  • 模糊匹配结果也支持高亮

4. States Polish

4. 状态优化

Acceptance Criteria:
  • Loading spinner while searching
  • "No results for X" message
  • Error state with retry option
验收标准:
  • 搜索时显示加载动画
  • 显示“未找到与X相关的结果”提示
  • 错误状态显示重试选项

5. Animation

5. 动画效果

Acceptance Criteria:
  • Modal fades in smoothly
  • Results animate in
  • Selection highlight transitions
  • All animations 60fps
验收标准:
  • 模态框平滑淡入
  • 结果列表动画进入
  • 选中高亮过渡流畅
  • 所有动画保持60fps

6. Input Debounce

6. 输入防抖

Acceptance Criteria:
  • Search debounced by 100ms
  • No flicker on fast typing
  • Immediate feel maintained
验收标准:
  • 搜索输入防抖100ms
  • 快速输入无闪烁
  • 保持即时响应感

Technical Design

技术设计

mermaid
stateDiagram-v2
    [*] --> Closed
    Closed --> Open: Ctrl+K
    Open --> Searching: User types
    Searching --> Results: Search complete
    Searching --> NoResults: No matches
    Searching --> Error: Search failed
    Results --> Selected: Arrow key
    Selected --> Results: Arrow key
    Selected --> Navigating: Enter
    Navigating --> Closed: Navigation complete
    Open --> Closed: Escape
    Results --> Closed: Escape
    NoResults --> Closed: Escape
    Error --> Searching: Retry
mermaid
stateDiagram-v2
    [*] --> Closed
    Closed --> Open: Ctrl+K
    Open --> Searching: User types
    Searching --> Results: Search complete
    Searching --> NoResults: No matches
    Searching --> Error: Search failed
    Results --> Selected: Arrow key
    Selected --> Results: Arrow key
    Selected --> Navigating: Enter
    Navigating --> Closed: Navigation complete
    Open --> Closed: Escape
    Results --> Closed: Escape
    NoResults --> Closed: Escape
    Error --> Searching: Retry

Files to Modify

待修改文件

FileChange
front/components/features/GlobalSearchModal.tsx
Add keyboard handling, states
front/hooks/use-global-search.ts
Add debounce, selection state
front/styles/global-search.css
Add animations
File变更内容
front/components/features/GlobalSearchModal.tsx
添加键盘处理、状态管理
front/hooks/use-global-search.ts
添加防抖、选中状态管理
front/styles/global-search.css
添加动画效果

Definition of Done (Phase 1)

阶段1完成标准

  • Keyboard navigation works fluidly
  • Result icons display correctly
  • Match highlighting works
  • All states display correctly
  • Animations are smooth (60fps)
  • Debounce prevents flicker
  • TypeScript compiles clean
  • No console errors
  • 键盘导航流畅可用
  • 结果图标显示正确
  • 匹配文本高亮生效
  • 所有状态显示正确
  • 动画流畅(60fps)
  • 防抖避免输入闪烁
  • TypeScript编译无错误
  • 控制台无错误

Estimated Effort

预估工作量

Medium (4-6 hours)

---
中等(4-6小时)

---

phase_2.md

phase_2.md

Advanced phase - power features.
进阶阶段 - 高级功能。

Example: global_search/phase_2.md

示例:global_search/phase_2.md

markdown
undefined
markdown
undefined

Phase 2: Global Search Advanced

阶段2:全局搜索进阶

Phase Goal

阶段目标

Add power user features: recent searches, type filters, and result previews. Make search a productivity tool.
添加高级用户功能:最近搜索、类型筛选与结果预览,让搜索成为生产力工具。

Prerequisites

前置条件

  • Phase 0 complete
  • Phase 1 complete
  • 阶段0已完成
  • 阶段1已完成

Scope

范围

Included

纳入内容

  • Recent searches (last 10)
  • Type filter buttons
  • Result preview on hover
  • Search across more content types
  • Search suggestions
  • 最近搜索(最多10条)
  • 类型筛选按钮
  • 悬停结果预览
  • 支持更多内容类型搜索
  • 搜索建议

Not Included (Later Phases)

排除内容(后续阶段)

  • Saved searches
  • Search analytics
  • AI-powered suggestions
  • 保存搜索
  • 搜索数据分析
  • AI驱动建议

Deliverables

交付物

1. Recent Searches

1. 最近搜索

Acceptance Criteria:
  • Last 10 searches stored in localStorage
  • Recent searches shown when modal opens
  • Click recent search to execute
  • Clear recent searches option
验收标准:
  • 最近10条搜索记录存储在localStorage
  • 模态框打开时显示最近搜索
  • 点击最近搜索可直接执行
  • 提供清除最近搜索选项

2. Type Filters

2. 类型筛选

Acceptance Criteria:
  • Filter buttons for each content type
  • Multiple filters can be active
  • Filters persist during session
  • "All" option to clear filters
验收标准:
  • 各内容类型对应筛选按钮
  • 可同时激活多个筛选
  • 筛选状态在会话中保持
  • “全部”选项清除所有筛选

3. Result Preview

3. 结果预览

Acceptance Criteria:
  • Preview panel shows on result hover
  • Preview shows: image, description, stats
  • Preview doesn't block results list
  • Preview loads lazily
验收标准:
  • 悬停结果时显示预览面板
  • 预览包含:图片、描述、属性
  • 预览不遮挡结果列表
  • 预览懒加载

4. Extended Content Types

4. 扩展内容类型

Acceptance Criteria:
  • Search includes: campaigns, scenarios
  • Search includes: spells, feats
  • Results grouped by type
验收标准:
  • 搜索包含:战役、场景
  • 搜索包含:法术、专长
  • 结果按类型分组

Definition of Done (Phase 2)

阶段2完成标准

  • Recent searches work correctly
  • Type filters work correctly
  • Previews load and display
  • Extended content types searchable
  • TypeScript compiles clean
  • No console errors
  • Performance still <16ms with filters
  • 最近搜索功能正常
  • 类型筛选功能正常
  • 预览加载与显示正常
  • 扩展内容类型可搜索
  • TypeScript编译无错误
  • 控制台无错误
  • 带筛选的搜索耗时仍<16ms

Estimated Effort

预估工作量

Large (8-12 hours)

---
较大(8-12小时)

---

nice_to_have.md

nice_to_have.md

Future ideas that aren't planned for any phase yet.
暂未规划到任何阶段的未来想法。

Example: global_search/nice_to_have.md

示例:global_search/nice_to_have.md

markdown
undefined
markdown
undefined

Nice to Have: Global Search

锦上添花:全局搜索

Ideas for future enhancement, not currently planned for any phase.
未来增强方向的想法,目前未规划到任何阶段。

Ideas

想法

AI-Powered Search

AI驱动搜索

Natural language queries like "show me fire spells for a level 5 wizard"
Value: Powerful for complex queries Effort: High (requires AI integration) Priority: Low (nice to have, not essential)
支持自然语言查询,如“展示5级法师可用的火系法术”
价值:复杂查询能力强 工作量:高(需AI集成) 优先级:低(锦上添花,非必需)

Saved Searches

保存搜索

Save frequently used searches with custom names
Value: Power user productivity Effort: Medium Priority: Low
用自定义名称保存常用搜索
价值:提升高级用户生产力 工作量:中等 优先级:低

Search Analytics Dashboard

搜索数据分析面板

Admin view of what users search for, failed searches
Value: Product insights Effort: Medium Priority: Medium (useful for product)
管理员视图,查看用户搜索内容、失败搜索记录
价值:产品洞察 工作量:中等 优先级:中等(对产品有用)

Voice Search

语音搜索

"Hey app, search for dragons"
Value: Accessibility, hands-free Effort: High Priority: Low
“嘿应用,搜索龙”
价值:可访问性、免提操作 工作量:高 优先级:低

Search in Results

结果内搜索

Ctrl+F style search within search results
Value: Large result sets Effort: Low Priority: Low
类似Ctrl+F的结果内搜索
价值:处理大量结果 工作量:低 优先级:低

Fuzzy Command Palette

模糊命令面板

Search for actions, not just content ("create campaign", "export data")
Value: Power users, keyboard-first Effort: High Priority: Medium
可搜索操作而非仅内容(如“创建战役”、“导出数据”)
价值:面向高级用户、优先键盘操作 工作量:高 优先级:中等

Evaluation Criteria

评估标准

When considering moving items to a phase:
  1. User demand (support requests, feedback)
  2. Competitive pressure (competitors have it)
  3. Technical feasibility (dependencies ready)
  4. Strategic alignment (company priorities)

---
考虑将想法纳入阶段时,需评估:
  1. 用户需求(支持请求、反馈)
  2. 竞争压力(竞品已具备)
  3. 技术可行性(依赖项就绪)
  4. 战略对齐(公司优先级)

---

out_of_scope.md

out_of_scope.md

Explicit exclusions to prevent scope creep.
明确排除项,防止范围蔓延。

Example: global_search/out_of_scope.md

示例:global_search/out_of_scope.md

markdown
undefined
markdown
undefined

Out of Scope: Global Search

排除范围:全局搜索

Explicit exclusions from this feature. These will NOT be implemented as part of Global Search.
本功能明确排除的内容,这些将不会作为全局搜索的一部分实现。

Permanently Out of Scope

永久排除

Server-Side Search

服务端搜索

What: Search queries sent to backend Why excluded:
  • Adds latency
  • Requires backend work
  • Client-side is sufficient for our data size Alternative: May revisit if data exceeds client-side limits
内容:搜索请求发送到后端 排除原因
  • 增加延迟
  • 需后端开发
  • 客户端搜索已满足当前数据规模需求 替代方案:若数据规模超出客户端处理能力,可重新评估

Search Within Documents

文档内搜索

What: Full-text search inside document content Why excluded:
  • Significantly more complex
  • Different use case (research vs navigation)
  • Would require different index structure Alternative: Separate "Document Search" feature if needed
内容:文档内容全文搜索 排除原因
  • 复杂度显著提升
  • 用例不同(研究vs导航)
  • 需不同的索引结构 替代方案:若有需求,可单独做“文档搜索”功能

Search Across Accounts

跨账户搜索

What: Search other users' public content Why excluded:
  • Privacy implications
  • Requires backend
  • Different product direction Alternative: Separate "Community Search" feature if ever needed
内容:搜索其他用户的公开内容 排除原因
  • 隐私问题
  • 需后端支持
  • 产品方向不同 替代方案:若有需求,可单独做“社区搜索”功能

Boolean Operators

布尔运算符

What: AND, OR, NOT query syntax Why excluded:
  • Power user feature with low usage
  • Complicates UX for most users
  • Fuzzy search covers most cases Alternative: Type filters provide similar functionality
内容:AND、OR、NOT查询语法 排除原因
  • 高级用户功能,使用率低
  • 增加普通用户UX复杂度
  • 模糊搜索已覆盖多数场景 替代方案:类型筛选可提供类似功能

Temporarily Out of Scope

临时排除

Mobile-Optimized Search

移动端优化搜索

What: Search UI optimized for mobile Why excluded (for now):
  • Desktop is primary platform currently
  • Mobile requires different UX patterns When to reconsider: Mobile user base >20%
内容:针对移动端优化的搜索UI 暂时排除原因
  • 当前核心平台为桌面端
  • 移动端需不同UX模式 重新评估时机:移动端用户占比>20%

Real-Time Index Updates

实时索引更新

What: Index updates as other users create content Why excluded (for now):
  • Single-user focus currently
  • Requires websocket infrastructure When to reconsider: Multi-user collaboration features
内容:其他用户创建内容时实时更新索引 暂时排除原因
  • 当前为单用户聚焦
  • 需WebSocket基础设施 重新评估时机:推出多用户协作功能时

How to Handle Requests

需求处理方式

When someone requests an out-of-scope item:
  1. Point to this document
  2. Explain the rationale
  3. If compelling counter-argument, create a proposal
  4. Don't implement without explicit scope change approval

---
当有人请求排除范围内的功能时:
  1. 指向本文档说明
  2. 解释排除理由
  3. 若有充分反对意见,创建提案
  4. 未获得范围变更批准前,不得实现

---

dependencies.md

dependencies.md

Technical dependencies for the feature.
功能的技术依赖项。

Example: global_search/dependencies.md

示例:global_search/dependencies.md

markdown
undefined
markdown
undefined

Dependencies: Global Search

依赖项:全局搜索

External Dependencies

外部依赖

MiniSearch Library

MiniSearch库

  • What: Client-side full-text search
  • Version: ^6.0.0
  • Install:
    npm install minisearch
  • Size: ~6KB gzipped
  • License: MIT
  • Why chosen: Small, fast, fuzzy matching, used by VitePress
  • 说明:客户端全文搜索工具
  • 版本:^6.0.0
  • 安装
    npm install minisearch
  • 大小:约6KB(gzip后)
  • 许可证:MIT
  • 选择理由:轻量、快速、支持模糊匹配,VitePress采用

No Other External Dependencies

无其他外部依赖

Global Search intentionally has minimal external dependencies.
全局搜索刻意减少外部依赖。

Internal Dependencies

内部依赖

Content Services

内容服务

Search requires access to all content for indexing.
ServiceRequired MethodPurpose
CreatureService
getAll()
Index creatures
ItemService
getAll()
Index items
AbilityService
getAll()
Index abilities
CampaignService
getAll()
Index campaigns (Phase 2)
搜索需访问所有内容以构建索引。
服务所需方法用途
CreatureService
getAll()
索引生物
ItemService
getAll()
索引物品
AbilityService
getAll()
索引技能
CampaignService
getAll()
索引战役(阶段2)

Router

路由

Navigation after selection requires router access.
ServiceRequired MethodPurpose
Router
navigate(path)
Go to result
选中结果后跳转需路由支持。
服务所需方法用途
Router
navigate(path)
跳转到结果

Keyboard Shortcuts

键盘快捷键

Global shortcut registration.
ServiceRequired MethodPurpose
KeyboardService
register(combo, handler)
Ctrl+K binding
全局快捷键注册。
服务所需方法用途
KeyboardService
register(combo, handler)
绑定Ctrl+K

Infrastructure Dependencies

基础设施依赖

Local Storage (Phase 2)

本地存储(阶段2)

Recent searches stored in localStorage.
最近搜索记录存储在localStorage。

No Backend Dependencies

无后端依赖

Search is entirely client-side.
搜索完全在客户端实现。

Dependency Verification

依赖项验证

Before starting implementation, verify:
bash
undefined
开始开发前,需验证:
bash
undefined

Check MiniSearch is installed

检查MiniSearch是否已安装

grep "minisearch" package.json
grep "minisearch" package.json

Check content services have getAll methods

检查内容服务是否有getAll方法

grep -r "getAll" front/services/*.ts
grep -r "getAll" front/services/*.ts

Check router is available

检查路由是否可用

grep "useRouter" front/hooks/*.ts
undefined

---
grep "useRouter" front/hooks/*.ts
undefined

---

Signal Files for Features

功能标识文件

Status Signals

状态标识

SignalMeaning
.draft
Definition in progress
.ready_for_review
Ready for product review
.approved
Approved for implementation
.in_progress
Implementation started
.completed
All MVP phases complete
.verified
MVP verified working
.deprecated
Feature deprecated
标识文件含义
.draft
定义中
.ready_for_review
已准备好产品评审
.approved
已批准可开发
.in_progress
开发中
.completed
所有MVP阶段完成
.verified
MVP已验证可用
.deprecated
功能已废弃

Phase Signals

阶段标识

SignalContent
.current_phase
Which phase is being implemented ("0", "1", etc.)
.phase_0_complete
Empty file when phase 0 done
.phase_1_complete
Empty file when phase 1 done
标识文件内容
.current_phase
当前开发阶段("0", "1"等)
.phase_0_complete
阶段0完成时创建的空文件
.phase_1_complete
阶段1完成时创建的空文件

Attribution Signals

归属标识

SignalMeaning
.approved_by_product
Product manager approved
.approved_by_engineering
Tech lead approved
.implemented_by_{name}
Who implemented
.verified_by_{name}
Who verified
标识文件含义
.approved_by_product
产品经理已批准
.approved_by_engineering
技术负责人已批准
.implemented_by_{name}
开发人员
.verified_by_{name}
验证人员

Content Signals

内容标识

SignalContent
.version
Schema version JSON
.implementation_started_at
Timestamp
.completed_at
Timestamp

标识文件内容
.version
架构版本JSON
.implementation_started_at
时间戳
.completed_at
时间戳

Creating a Feature: The Process

创建功能的流程

mermaid
flowchart TD
    A[Feature idea] --> B[Create feature folder]
    B --> C[Write feature.md]
    C --> D[Write mvp.md with DoD]
    D --> E[Write phase_0.md]
    E --> F[Write out_of_scope.md]
    F --> G[Add .draft signal]
    G --> H{Review meeting}
    H -->|Approved| I[Add .approved signal]
    H -->|Changes needed| C
    I --> J[Create tasks from phases]
    J --> K[Implement Phase 0]
    K --> L[Verify Phase 0]
    L --> M[Implement Phase 1]
    M --> N[Verify Phase 1]
    N --> O[MVP Verification]
    O --> P[Add .completed signal]
mermaid
flowchart TD
    A[Feature idea] --> B[Create feature folder]
    B --> C[Write feature.md]
    C --> D[Write mvp.md with DoD]
    D --> E[Write phase_0.md]
    E --> F[Write out_of_scope.md]
    F --> G[Add .draft signal]
    G --> H{Review meeting}
    H -->|Approved| I[Add .approved signal]
    H -->|Changes needed| C
    I --> J[Create tasks from phases]
    J --> K[Implement Phase 0]
    K --> L[Verify Phase 0]
    L --> M[Implement Phase 1]
    M --> N[Verify Phase 1]
    N --> O[MVP Verification]
    O --> P[Add .completed signal]

Step 1: Gather Information

步骤1:收集信息

Ask clarifying questions:
  1. What problem does this solve?
  2. Who is the primary user?
  3. What does success look like?
  4. What's the simplest version that provides value?
  5. What should we explicitly NOT do?
  6. What are the technical constraints?
  7. What's the timeline expectation?
提出澄清问题:
  1. 解决什么问题?
  2. 核心用户是谁?
  3. 成功的标准是什么?
  4. 能提供价值的最简版本是什么?
  5. 明确不做什么?
  6. 技术约束有哪些?
  7. 时间线预期?

Step 2: Create Feature Folder

步骤2:创建功能文件夹

bash
mkdir -p docs/definitions/features/{feature_slug}
bash
mkdir -p docs/definitions/features/{feature_slug}

Step 3: Write Core Documents

步骤3:撰写核心文档

  1. feature.md
    - Full feature definition
  2. mvp.md
    - MVP scope and Definition of Done
  3. phase_0.md
    - Foundation phase
  4. out_of_scope.md
    - Explicit exclusions
  1. feature.md
    - 完整功能定义
  2. mvp.md
    - MVP范围与完成标准
  3. phase_0.md
    - 基础阶段
  4. out_of_scope.md
    - 明确排除项

Step 4: Add Signals

步骤4:添加标识文件

bash
echo '{"schema": "1.0", "created": "'$(date -Iseconds)'"}' > .version
touch .draft
bash
echo '{"schema": "1.0", "created": "'$(date -Iseconds)'"}' > .version
touch .draft

Step 5: Request Review

步骤5:请求评审

bash
rm .draft
touch .ready_for_review
bash
rm .draft
touch .ready_for_review

Step 6: After Approval

步骤6:评审通过后

bash
rm .ready_for_review
touch .approved
touch .approved_by_product

bash
rm .ready_for_review
touch .approved
touch .approved_by_product

Quality Checklist

质量检查清单

Before requesting review:
  • feature.md
    has clear problem statement
  • feature.md
    defines target users
  • feature.md
    has success metrics
  • mvp.md
    clearly states phase inclusion
  • mvp.md
    has complete Definition of Done
  • phase_0.md
    is achievable and valuable alone
  • out_of_scope.md
    has explicit exclusions
  • All phases have estimated effort
  • Dependencies identified
  • .version
    file created
请求评审前:
  • feature.md
    有清晰的问题陈述
  • feature.md
    定义了目标用户
  • feature.md
    有成功指标
  • mvp.md
    明确了阶段包含情况
  • mvp.md
    有完整的完成标准
  • phase_0.md
    可独立实现且有价值
  • out_of_scope.md
    有明确排除项
  • 所有阶段有预估工作量
  • 已识别依赖项
  • 已创建
    .version
    文件