design-documentation
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
ChineseDesign Documentation
设计文档
Create technical blueprints that bridge requirements and implementation. This skill teaches how to document architecture decisions, component design, and system interactions.
创建连接需求与开发实现的技术蓝图。本技能将指导你如何记录架构决策、组件设计和系统交互。
When to Use This Skill
何时使用该技能
Use design documentation when:
- Requirements phase is complete and approved
- You need to plan technical implementation
- Multiple developers will work on the feature
- Architecture decisions need documentation
- The feature involves complex integrations
在以下场景使用设计文档:
- 需求阶段已完成并获批
- 需要规划技术实现方案
- 多名开发者将参与该功能开发
- 架构决策需要被记录留存
- 功能涉及复杂的系统集成
Design Document Structure
设计文档结构
Standard Template
标准模板
markdown
undefinedmarkdown
undefinedDesign Document: [Feature Name]
设计文档: [Feature Name]
Overview
Overview
[High-level summary of the feature and approach]
[High-level summary of the feature and approach]
Architecture
Architecture
[System architecture and component overview]
[System architecture and component overview]
Components and Interfaces
Components and Interfaces
[Detailed component descriptions and interactions]
[Detailed component descriptions and interactions]
Data Models
Data Models
[Data structures and relationships]
[Data structures and relationships]
Error Handling
Error Handling
[Error scenarios and response strategies]
[Error scenarios and response strategies]
Testing Strategy
Testing Strategy
[Testing approach and quality assurance]
undefined[Testing approach and quality assurance]
undefinedStep-by-Step Process
分步流程
Step 1: Requirements Analysis
步骤1: 需求分析
Before designing, ensure you understand:
- All functional requirements
- Non-functional requirements (performance, security, scalability)
- Constraints (technology stack, timeline, resources)
- Integration points with existing systems
Analysis Questions:
- What does the system need to do?
- What are the performance expectations?
- What existing code/systems does this touch?
- What are the security requirements?
- What could go wrong?
在开始设计前,确保你理解以下内容:
- 所有功能需求
- 非功能需求(性能、安全性、可扩展性)
- 约束条件(技术栈、时间线、资源)
- 与现有系统的集成点
分析问题清单:
- 系统需要实现什么功能?
- 性能预期是什么?
- 会涉及哪些现有代码/系统?
- 安全要求有哪些?
- 可能出现哪些故障?
Step 2: Research and Context Building
步骤2: 研究与背景构建
Identify areas needing research:
- Technology choices and alternatives
- Third-party integrations and APIs
- Best practices for similar systems
- Security and compliance considerations
Research Documentation:
markdown
undefined确定需要研究的领域:
- 技术选型与替代方案
- 第三方集成与API
- 同类系统的最佳实践
- 安全与合规考量
研究记录模板:
markdown
undefinedResearch Findings
Research Findings
[Topic]
[Topic]
Sources: [Links/references]
Key Insights:
- [Finding 1]
- [Finding 2] Impact on Design: [How this affects our approach]
undefinedSources: [Links/references]
Key Insights:
- [Finding 1]
- [Finding 2] Impact on Design: [How this affects our approach]
undefinedStep 3: Define System Architecture
步骤3: 定义系统架构
Document the high-level structure:
markdown
undefined记录高层架构结构:
markdown
undefinedArchitecture
Architecture
System Overview
System Overview
[How the overall system works]
[How the overall system works]
Component Architecture
Component Architecture
[Major components and their responsibilities]
[Major components and their responsibilities]
Data Flow
Data Flow
[How information moves through the system]
[How information moves through the system]
Technology Decisions
Technology Decisions
[Key technology choices and rationale]
**Architecture Diagram (Mermaid):**
```mermaid
graph TD
A[Client] --> B[API Gateway]
B --> C[Auth Service]
B --> D[Feature Service]
D --> E[Database]
D --> F[Cache][Key technology choices and rationale]
**架构图 (Mermaid):**
```mermaid
graph TD
A[Client] --> B[API Gateway]
B --> C[Auth Service]
B --> D[Feature Service]
D --> E[Database]
D --> F[Cache]Step 4: Design Components and Interfaces
步骤4: 设计组件与接口
For each major component:
markdown
undefined针对每个核心组件:
markdown
undefinedComponents and Interfaces
Components and Interfaces
[Component Name]
[Component Name]
Purpose: [What this component does]
Responsibilities:
- [Responsibility 1]
- [Responsibility 2]
Interfaces:
- Input: [What it receives]
- Output: [What it produces]
- Dependencies: [What it requires]
API Definition:
typescript
interface ComponentName {
method(input: InputType): Promise<OutputType>;
}undefinedPurpose: [What this component does]
Responsibilities:
- [Responsibility 1]
- [Responsibility 2]
Interfaces:
- Input: [What it receives]
- Output: [What it produces]
- Dependencies: [What it requires]
API Definition:
typescript
interface ComponentName {
method(input: InputType): Promise<OutputType>;
}undefinedStep 5: Define Data Models
步骤5: 定义数据模型
Document all data structures:
markdown
undefined记录所有数据结构:
markdown
undefinedData Models
Data Models
[Entity Name]
[Entity Name]
Purpose: [What this entity represents]
Properties:
| Field | Type | Required | Description |
|---|---|---|---|
| id | string | Yes | Unique identifier |
| name | string | Yes | Display name |
| createdAt | Date | Yes | Creation timestamp |
Validation Rules:
- [Rule 1]
- [Rule 2]
Relationships:
- [Relationship to other entities]
Example:
json
{
"id": "abc123",
"name": "Example",
"createdAt": "2024-01-15T10:30:00Z"
}undefinedPurpose: [What this entity represents]
Properties:
| Field | Type | Required | Description |
|---|---|---|---|
| id | string | Yes | Unique identifier |
| name | string | Yes | Display name |
| createdAt | Date | Yes | Creation timestamp |
Validation Rules:
- [Rule 1]
- [Rule 2]
Relationships:
- [Relationship to other entities]
Example:
json
{
"id": "abc123",
"name": "Example",
"createdAt": "2024-01-15T10:30:00Z"
}undefinedStep 6: Plan Error Handling
步骤6: 规划错误处理
Document error scenarios:
markdown
undefined记录错误场景:
markdown
undefinedError Handling
Error Handling
Error Categories
Error Categories
- Validation Errors: Invalid user input
- Authentication Errors: Unauthorized access
- External Service Errors: Third-party failures
- System Errors: Internal failures
- Validation Errors: Invalid user input
- Authentication Errors: Unauthorized access
- External Service Errors: Third-party failures
- System Errors: Internal failures
Error Response Strategy
Error Response Strategy
| Error Type | HTTP Code | User Message | System Action |
|---|---|---|---|
| Validation | 400 | Specific field error | Log, return details |
| Auth | 401 | "Please log in" | Redirect to login |
| Not Found | 404 | "Resource not found" | Log, return error |
| Server | 500 | "Something went wrong" | Log, alert, retry |
| Error Type | HTTP Code | User Message | System Action |
|---|---|---|---|
| Validation | 400 | Specific field error | Log, return details |
| Auth | 401 | "Please log in" | Redirect to login |
| Not Found | 404 | "Resource not found" | Log, return error |
| Server | 500 | "Something went wrong" | Log, alert, retry |
Recovery Mechanisms
Recovery Mechanisms
- [Retry strategies]
- [Fallback behaviors]
- [Circuit breaker patterns]
undefined- [Retry strategies]
- [Fallback behaviors]
- [Circuit breaker patterns]
undefinedStep 7: Define Testing Strategy
步骤7: 定义测试策略
markdown
undefinedmarkdown
undefinedTesting Strategy
Testing Strategy
Unit Testing
Unit Testing
- Coverage Target: 80%+
- Focus Areas: [Critical business logic]
- Mocking Strategy: [What to mock]
- Coverage Target: 80%+
- Focus Areas: [Critical business logic]
- Mocking Strategy: [What to mock]
Integration Testing
Integration Testing
- Scope: [Component interactions to test]
- Environment: [Test environment setup]
- Data Strategy: [Test data approach]
- Scope: [Component interactions to test]
- Environment: [Test environment setup]
- Data Strategy: [Test data approach]
End-to-End Testing
End-to-End Testing
- Critical Paths: [User journeys to test]
- Tools: [Testing tools]
- Critical Paths: [User journeys to test]
- Tools: [Testing tools]
Performance Testing
Performance Testing
- Load Targets: [Expected load]
- Benchmarks: [Performance requirements]
undefined- Load Targets: [Expected load]
- Benchmarks: [Performance requirements]
undefinedDecision Documentation
决策记录
Document key decisions using this template:
markdown
undefined使用以下模板记录关键决策:
markdown
undefinedDecision: [Brief Title]
Decision: [Brief Title]
Context: [Situation requiring a decision]
Options Considered:
Option 1: [Name]
- Pros: [Benefits]
- Cons: [Drawbacks]
- Effort: [Low/Medium/High]
Option 2: [Name]
- Pros: [Benefits]
- Cons: [Drawbacks]
- Effort: [Low/Medium/High]
Decision: [Chosen option]
Rationale: [Why this option was selected]
Implications: [What this means for implementation]
undefinedContext: [Situation requiring a decision]
Options Considered:
Option 1: [Name]
- Pros: [Benefits]
- Cons: [Drawbacks]
- Effort: [Low/Medium/High]
Option 2: [Name]
- Pros: [Benefits]
- Cons: [Drawbacks]
- Effort: [Low/Medium/High]
Decision: [Chosen option]
Rationale: [Why this option was selected]
Implications: [What this means for implementation]
undefinedCommon Design Decisions
常见设计决策
API Design
API设计
markdown
undefinedmarkdown
undefinedDecision: API Architecture
Decision: API Architecture
Options:
- REST API - Standard HTTP methods, well-understood
- GraphQL - Flexible queries, single endpoint
- RPC-style - Direct operation mapping
Decision: REST API
Rationale: Standard CRUD operations, team familiarity, good tooling support
undefinedOptions:
- REST API - Standard HTTP methods, well-understood
- GraphQL - Flexible queries, single endpoint
- RPC-style - Direct operation mapping
Decision: REST API
Rationale: Standard CRUD operations, team familiarity, good tooling support
undefinedData Storage
数据存储
markdown
undefinedmarkdown
undefinedDecision: Database Choice
Decision: Database Choice
Options:
- PostgreSQL - ACID compliance, complex queries
- MongoDB - Schema flexibility, horizontal scaling
- Redis - High performance, limited queries
Decision: PostgreSQL with JSON columns
Rationale: Data consistency needs + flexibility for user preferences
undefinedOptions:
- PostgreSQL - ACID compliance, complex queries
- MongoDB - Schema flexibility, horizontal scaling
- Redis - High performance, limited queries
Decision: PostgreSQL with JSON columns
Rationale: Data consistency needs + flexibility for user preferences
undefinedAuthentication
身份验证
markdown
undefinedmarkdown
undefinedDecision: Authentication Strategy
Decision: Authentication Strategy
Options:
- Session-based - Server-controlled, simple
- JWT tokens - Stateless, scalable
- OAuth 2.0 - External provider, no password management
Decision: JWT with refresh token rotation
Rationale: Scalability requirements, API-first architecture
undefinedOptions:
- Session-based - Server-controlled, simple
- JWT tokens - Stateless, scalable
- OAuth 2.0 - External provider, no password management
Decision: JWT with refresh token rotation
Rationale: Scalability requirements, API-first architecture
undefinedQuality Checklist
质量检查清单
Before finalizing design:
Completeness:
- All requirements addressed in design
- Major system components defined
- Data models cover all entities
- Error handling covers expected failures
- Testing strategy addresses all layers
Clarity:
- Design decisions clearly explained
- Component responsibilities well-defined
- Interfaces between components specified
- Technical choices include rationale
Feasibility:
- Design is technically achievable
- Performance requirements can be met
- Security requirements addressed
- Implementation complexity reasonable
Traceability:
- Design elements map to requirements
- All requirements covered by design
- Testing validates requirement fulfillment
在最终确定设计前,完成以下检查:
完整性:
- 所有需求均在设计中得到体现
- 已定义核心系统组件
- 数据模型覆盖所有实体
- 错误处理覆盖预期故障场景
- 测试策略覆盖所有层级
清晰性:
- 设计决策解释清晰
- 组件职责定义明确
- 组件间接口已明确指定
- 技术选型包含决策依据
可行性:
- 设计在技术上可实现
- 可满足性能要求
- 已解决安全要求
- 实现复杂度合理
可追溯性:
- 设计元素与需求一一对应
- 所有需求均被设计覆盖
- 测试可验证需求的实现
Common Pitfalls
常见陷阱
- Over-Engineering: Design for current requirements, not hypothetical futures
- Under-Specified Interfaces: Define clear component boundaries
- Ignoring Non-Functional Requirements: Address performance, security, scalability
- Technology-First Design: Let requirements drive technology choices
- Insufficient Error Handling: Plan for failures, not just happy paths
- 过度设计: 针对当前需求设计,而非假设性的未来需求
- 接口定义不足: 明确组件边界
- 忽略非功能需求: 关注性能、安全性、可扩展性
- 技术优先设计: 让需求驱动技术选型
- 错误处理不足: 不仅要规划正常流程,还要为故障做预案
Example: User Profile Design
示例:用户资料设计
markdown
undefinedmarkdown
undefinedDesign Document: User Profile Management
Design Document: User Profile Management
Overview
Overview
Enable users to view and edit their profile information, including personal details, preferences, and profile picture.
Enable users to view and edit their profile information, including personal details, preferences, and profile picture.
Architecture
Architecture
Component Architecture
Component Architecture
┌─────────────┐ ┌──────────────┐ ┌─────────────┐
│ Client │────▶│ Profile API │────▶│ Database │
└─────────────┘ └──────────────┘ └─────────────┘
│
▼
┌──────────────┐
│ Image Store │
└──────────────┘┌─────────────┐ ┌──────────────┐ ┌─────────────┐
│ Client │────▶│ Profile API │────▶│ Database │
└─────────────┘ └──────────────┘ └─────────────┘
│
▼
┌──────────────┐
│ Image Store │
└──────────────┘Technology Stack
Technology Stack
- API: Node.js with Express
- Database: PostgreSQL
- Image Storage: S3-compatible object storage
- Cache: Redis for session data
- API: Node.js with Express
- Database: PostgreSQL
- Image Storage: S3-compatible object storage
- Cache: Redis for session data
Components
Components
ProfileService
ProfileService
Purpose: Manage user profile CRUD operations
Interface:
typescript
interface ProfileService {
getProfile(userId: string): Promise<UserProfile>;
updateProfile(userId: string, data: ProfileUpdate): Promise<UserProfile>;
uploadAvatar(userId: string, image: File): Promise<string>;
deleteAvatar(userId: string): Promise<void>;
}Purpose: Manage user profile CRUD operations
Interface:
typescript
interface ProfileService {
getProfile(userId: string): Promise<UserProfile>;
updateProfile(userId: string, data: ProfileUpdate): Promise<UserProfile>;
uploadAvatar(userId: string, image: File): Promise<string>;
deleteAvatar(userId: string): Promise<void>;
}Data Models
Data Models
UserProfile
UserProfile
| Field | Type | Required | Validation |
|---|---|---|---|
| id | UUID | Yes | Auto-generated |
| string | Yes | Valid email format | |
| displayName | string | Yes | 2-50 characters |
| bio | string | No | Max 500 characters |
| avatarUrl | string | No | Valid URL |
| preferences | JSON | No | Valid JSON object |
| updatedAt | timestamp | Yes | Auto-updated |
| Field | Type | Required | Validation |
|---|---|---|---|
| id | UUID | Yes | Auto-generated |
| string | Yes | Valid email format | |
| displayName | string | Yes | 2-50 characters |
| bio | string | No | Max 500 characters |
| avatarUrl | string | No | Valid URL |
| preferences | JSON | No | Valid JSON object |
| updatedAt | timestamp | Yes | Auto-updated |
Error Handling
Error Handling
| Scenario | Response | Action |
|---|---|---|
| Profile not found | 404 | Return error message |
| Invalid update data | 400 | Return validation errors |
| Image too large | 413 | Return size limit error |
| Unauthorized | 401 | Redirect to login |
| Scenario | Response | Action |
|---|---|---|
| Profile not found | 404 | Return error message |
| Invalid update data | 400 | Return validation errors |
| Image too large | 413 | Return size limit error |
| Unauthorized | 401 | Redirect to login |
Testing Strategy
Testing Strategy
- Unit tests for validation logic
- Integration tests for API endpoints
- E2E test for profile edit flow
undefined- Unit tests for validation logic
- Integration tests for API endpoints
- E2E test for profile edit flow
undefinedNext Steps
后续步骤
After completing design:
- Get design review and approval
- Move to Task Planning phase
- Break design into implementation tasks
- Begin systematic implementation
完成设计后:
- 获取设计评审与批准
- 进入任务规划阶段
- 将设计拆解为开发任务
- 开始系统化开发实现