【新春创造营】春节日程助手

10011876418 · 2026 年2 月 3 日 07:06

我不会写提示词，我是先跟AI讨论做个什么项目开始，讨论做的方向后，让AI先生成需求文档。然后再实现。由于前期没啥很好的提示词，需求文档写的也不是很好。导致做出来的很烂。然后就是漫长的改bug环节了。然后有啥新的想法，也都是一点点提出。

设计文档

春节日程规划助手 - 需求设计文档

1. 项目概述

1.1 项目名称

春节日程规划助手 (Spring Festival Planner)

1.2 项目背景

春节期间日程繁忙，涉及拜年、聚会、家庭活动等多种安排。为了帮助用户更好地规划春节假期时间，避免冲突，提高节日效率，开发此日程规划助手。

1.3 项目目标

提供春节假期日程规划和管理功能
支持拜年人员管理和拜年记录
突出春节喜庆氛围和节日元素
一键启动，简单易用
核心功能：春节期间专属日程规划（腊月二十三至正月十五）

2. 功能需求

2.1 核心功能

2.1.1 日程管理

创建日程

日期选择（默认春节期间范围）
时间段选择（开始时间-结束时间）
日程类型（拜年、聚餐、家庭活动、其他）
地点
备注
关联联系人
快速创建：双击统计卡片自动选择对应类型和推荐日期

查看日程

春节时间线视图：替代传统日历，聚焦春节期间
- 显示腊月二十三至正月十五的日期
- 智能压缩：无日程且非重要节日的日期自动压缩
- 重要节日始终显示：小年、除夕、春节、元宵节
- 宽屏布局，时间线清晰展示
- 点击日期快速创建日程
列表视图：按时间顺序展示所有日程

编辑日程：修改已创建的日程信息

删除日程：删除不需要的日程

2.1.2 拜年人员管理（强化版）

联系人管理

添加联系人（姓名、关系、电话、地址、备注）
编辑和删除联系人
联系人列表展示

拜年记录功能

拜年状态标记：已拜年 / 待拜年
拜年详情记录：
- 拜年方式（上门/电话/视频/信息）
- 礼物记录
- 红包金额
- 备注
批量拜年：支持多选联系人批量标记拜年
统计展示：已拜年/待拜年数量统计

智能拜年日期

双击拜年统计卡片：自动创建拜年日程
默认日期范围：正月初一至初七随机选择
自动设置日程类型为"拜年"

2.1.3 春节主题元素

视觉设计

春节红色主题：红色渐变 + 金色点缀
灯笼装饰：两侧对称灯笼，带流苏摆动动画
祥云飘动：淡雅祥云背景装饰
梅花元素：角落梅花装饰

交互动画

放烟花按钮：点击展示烟花绽放动画（彩色粒子效果）
放鞭炮按钮：点击展示鞭炮爆炸动画（火花飞散+烟雾效果）
统计卡片悬停动画
时间线节日节点发光效果

2.1.4 辅助功能

农历支持：农历日期显示，重要节日标识
- 支持节日：小年（腊月二十三）、除夕（腊月三十）、春节（正月初一）、元宵节（正月十五）
数据备份：本地数据备份和恢复
主题切换：支持明暗主题适配春节配色

3. 用户体验设计

3.1 主界面布局

春节头部区域

顶部装饰条（红金条纹）
标题：2026春节日程规划（带火焰动画）
副标题：腊月二十三·小年至正月十五·元宵节
统计卡片：拜年行程 | 聚餐安排 | 家庭活动 | 总日程
- 支持双击快速创建对应类型日程

操作区域

添加日程按钮
放烟花 / 放鞭炮按钮
时间线视图 / 列表视图切换

内容区域

时间线视图：春节期间日期时间线，智能压缩无日程日期
日程卡片：按日期分组展示，支持编辑删除

3.2 操作流程

打开应用，看到春节主题时间线界面
方式一：点击日期卡片 → 创建日程
方式二：双击顶部统计卡片 → 快速创建对应类型日程（拜年默认初一至初七）
方式三：点击"添加日程"按钮 → 手动创建
在联系人页面标记拜年状态和记录
点击烟花/鞭炮按钮体验节日动画

3.3 视觉规范

配色方案

主色：#ff4d4f（春节红）
点缀：#ffd700（金色）
背景：#fff5f5（淡红渐变）

节日标识

春节：大红圆点 + 发光动画
除夕：橙色圆点
小年/元宵：红色圆点
普通日期：灰色圆点

动画规范

灯笼：流苏摆动，福字发光
烟花：30个粒子绽放，1.5秒
鞭炮：12个依次爆炸，带火花和烟雾
卡片：悬停上浮效果

4. 技术方案

4.1 技术栈

前端：React + TypeScript
UI框架：Ant Design
状态管理：React Context + Hooks
农历库：lunar-javascript
数据存储：LocalStorage（本地存储）
构建工具：Vite

4.2 项目结构

spring-festival-planner/
├── doc/                        # 文档目录
│   └── 需求设计文档.md
├── src/
│   ├── components/             # 组件
│   │   ├── ScheduleForm/      # 日程表单
│   │   ├── ContactList/       # 联系人列表（含拜年功能）
│   │   ├── SpringFestivalDecorations/  # 春节装饰动画
│   │   └── ...
│   ├── pages/                  # 页面
│   │   ├── CalendarView/      # 春节时间线视图
│   │   ├── Contacts/          # 联系人管理（含拜年）
│   │   └── Settings/          # 设置
│   ├── store/                  # 状态管理
│   │   ├── scheduleStore.ts
│   │   ├── contactStore.ts
│   │   └── appStore.ts
│   ├── utils/                  # 工具函数
│   │   ├── lunar.ts           # 农历转换（含节日识别）
│   │   └── storage.ts         # 存储工具
│   ├── types/                  # 类型定义
│   │   ├── schedule.ts
│   │   ├── contact.ts         # 含拜年记录类型
│   │   └── index.ts
│   ├── App.tsx
│   └── main.tsx
├── package.json
├── tsconfig.json
├── vite.config.ts
└── README.md

5. 数据模型

5.1 日程数据结构

interface Schedule {
  id: string;
  title: string;
  startDate: Date;
  endDate: Date;
  type: 'visit' | 'dinner' | 'family' | 'other';
  location?: string;
  note?: string;
  contacts?: string[];
  createdAt: Date;
  updatedAt: Date;
}

5.2 联系人数据结构（含拜年记录）

interface BlessingRecord {
  isBlessed: boolean;
  blessingTime?: Date;
  blessingMethod?: 'in-person' | 'phone' | 'video' | 'message' | 'batch';
  gift?: string;
  redPacket?: string;
  note?: string;
}

interface Contact {
  id: string;
  name: string;
  relationship: string;
  phone?: string;
  address?: string;
  note?: string;
  blessingRecord?: BlessingRecord;
  createdAt: Date;
  updatedAt: Date;
}

6. 非功能需求

6.1 性能要求

日程加载时间 < 1秒
支持至少1000条日程记录
动画流畅，60fps

6.2 易用性要求

春节主题突出，一眼识别
双击快速创建，减少操作步骤
时间线清晰，压缩无关日期

6.3 兼容性要求

支持主流浏览器（Chrome、Edge、Firefox）
响应式设计，移动端隐藏部分装饰
支持深色模式（春节配色适配）

7. 开发计划

7.1 第一阶段（核心功能）

春节时间线视图（替代传统日历）
日程CRUD功能
农历日期支持和节日识别
春节主题UI和配色
灯笼装饰动画

7.2 第二阶段（拜年功能）

联系人管理和拜年记录
拜年状态标记和统计
批量拜年功能
双击统计卡片快速创建

7.3 第三阶段（节日体验）

烟花动画效果
鞭炮爆炸动画
时间线智能压缩
响应式适配

8. 节日识别规则

节日	农历日期	是否重要	显示规则
小年	腊月二十三	是	始终显示
除夕	腊月三十	是	始终显示
春节	正月初一	是	始终显示，特殊发光效果
元宵节	正月十五	是	始终显示
其他日期	-	否	无日程时压缩

9. 风险与限制

9.1 风险

农历日期转换准确性（已通过lunar-javascript库解决）
动画性能（限制粒子数量，使用CSS动画）

9.2 限制

仅支持单机使用
春节日期范围固定（腊月二十三至正月十五）
无云端同步

10. 更新记录

2026-02-03 功能优化与体验提升

拜年功能明确化：拜年记录和拜年日程完全分离，拜年方式不等于已拜年
日历视图优化：
- 标题改为" 2026春节欢乐时光"，更活泼亲切
- 统计卡片添加趣味评价（0个：暂无安排，1-3个：不错的开始，4-6个：充实满满，7+个：春节达人）
雪花效果优化：
- 雪花初始位置随机分布，不再从顶部统一开始
- 雪花装饰移至全局，所有页面都有雪花效果
时间线优化：
- 修复圆圈被日程卡片遮挡的问题（通过z-index层级控制）
- 增加时间线项目间距，避免视觉拥挤
- 小年圆框完整显示"小年"文字