Files
ChouJuGEO/docs/analysis/TAB2_OPTIMIZATION_PLAN.md
T

843 lines
28 KiB
Markdown
Raw Normal View History

# Tab2(自动创作)优化方案
## 一、重排后的 Tab 结构草图
```
Tab2: 自动创作
├── 【区域1:快速生成区】(默认展开,紧凑布局)
│ ├── 生成模式选择(单篇/批量)- 横向radio
│ ├── 关键词选择(单篇:selectbox | 批量:multiselect
│ ├── 平台选择(单篇:selectbox | 批量:selectbox统一平台)
│ ├── 高级优化技巧(折叠,默认收起)
│ └── 生成按钮(主按钮,醒目)
├── 【区域2:生成结果概览】(生成后显示)
│ ├── 生成统计卡片(3列:总篇数、平均评分、生成时间)
│ ├── 批量生成:内容列表(可展开查看每篇)
│ └── 单篇生成:直接进入详情
├── 【区域3:内容详情区】(单篇或选中篇)
│ ├── Tab组:内容预览 | 质量分析 | 增强工具
│ │ ├── Tab1: 内容预览
│ │ │ ├── 内容展示(代码块/文本区)
│ │ │ ├── 快速操作(下载、复制、优化)
│ │ │ └── JSON-LD(仅GitHub平台,折叠)
│ │ │
│ │ ├── Tab2: 质量分析
│ │ │ ├── 内容评分(5个指标卡片)
│ │ │ ├── E-E-A-T评估(折叠)
│ │ │ └── 事实密度评估(折叠)
│ │ │
│ │ └── Tab3: 增强工具
│ │ ├── 多模态提示生成(配图/视频)
│ │ ├── 图片生成(通义万相)
│ │ └── E-E-A-T强化(折叠)
│ │
│ └── 下载区(底部固定)
│ ├── 单篇下载
│ └── 批量ZIP下载(批量模式)
└── 【区域4:辅助工具】(折叠,默认收起)
├── JSON-LD Schema生成(移至Tab3或独立Tab
└── 技术配置生成(移至Tab3或独立Tab)
```
## 二、问题清单(含严重级别)
### P0 - 必改(逻辑漏洞/体验阻塞)
1. **批量生成无法查看所有内容** ⚠️ P0
- 问题:只显示最后一篇预览,其他内容无法查看
- 影响:用户无法验证批量生成的所有内容
- 位置:3124-4118行
2. **内容评分可能静默失败** ⚠️ P0
- 问题:评分失败只显示warning,但用户可能看不到
- 影响:用户以为内容已评分,实际未评分
- 位置:3086-3099行
3. **图片生成入口混乱** ⚠️ P0
- 问题:有"直接生成"、"基于描述生成"、"多模态生成"多个入口
- 影响:用户不知道用哪个,容易重复操作
- 位置:3173-3756行
4. **JSON-LD和技术配置功能归属错误** ⚠️ P0
- 问题:放在内容生成Tab,但属于"优化"范畴
- 影响:用户流程混乱,应该在优化Tab使用
- 位置:2271-2572行
5. **批量生成时ZIP下载位置不明确** ⚠️ P0
- 问题:ZIP下载按钮在单篇预览下方,批量模式时位置不明显
- 影响:用户找不到批量下载入口
- 位置:4093-4101行
### P1 - 建议(体验优化)
6. **信息层级混乱** ⚠️ P1
- 问题:评分、多模态、E-E-A-T等功能平铺,没有分组
- 影响:页面冗长,用户需要滚动很多才能找到功能
- 位置:3124-4118行
7. **生成状态反馈不足** ⚠️ P1
- 问题:批量生成时,只有spinner,没有进度条和完成提示
- 影响:用户不知道生成进度,可能误以为卡死
- 位置:2669-3122行
8. **优化技巧选择器位置不当** ⚠️ P1
- 问题:放在表单中间,容易被忽略
- 影响:用户可能不知道有这个功能
- 位置:2628-2652行
9. **内容预览区域过大** ⚠️ P1
- 问题:单篇内容预览占用大量空间,其他功能被挤到下方
- 影响:用户需要大量滚动才能看到其他功能
- 位置:4010-4091行
10. **缺少内容对比功能** ⚠️ P1
- 问题:批量生成时,无法对比不同关键词生成的内容
- 影响:用户无法快速筛选优质内容
- 位置:无此功能
### P2 - 可做(锦上添花)
11. **缺少内容模板预览** ⚠️ P2
- 问题:用户选择平台时,看不到该平台的模板特点
- 影响:用户可能选错平台
- 位置:2591-2612行
12. **批量生成缺少筛选功能** ⚠️ P2
- 问题:批量生成后,无法按评分、平台、关键词筛选
- 影响:内容多时难以管理
- 位置:3124行后
13. **缺少内容历史记录快速入口** ⚠️ P2
- 问题:无法快速查看之前生成的内容
- 影响:用户需要切换到Tab5查看
- 位置:无此功能
14. **优化技巧说明不够直观** ⚠️ P2
- 问题:只有文字说明,没有示例
- 影响:用户不理解技巧的实际效果
- 位置:2642-2652行
15. **缺少批量操作功能** ⚠️ P2
- 问题:无法批量下载、批量优化、批量删除
- 影响:内容多时操作繁琐
- 位置:无此功能
## 三、改动方案(含具体交互/文案/状态设计)
### 改动1:重组布局结构(P0
**目标**:将内容生成作为核心,其他功能按需展示
**具体改动**
```python
with tab2:
# === 区域1:快速生成区 ===
st.markdown("### ✍️ 内容生成")
with st.container(border=True):
with st.form("content_form", clear_on_submit=False):
# 第一行:模式选择
mode = st.radio(
"生成模式",
["单篇生成", "批量生成"],
horizontal=True,
key="content_mode"
)
# 第二行:关键词和平台(紧凑布局)
if mode == "单篇生成":
col1, col2 = st.columns([2, 1])
with col1:
selected_keyword = st.selectbox(
"选择关键词",
st.session_state.keywords,
key="content_kw_single"
)
with col2:
platform = st.selectbox(
"平台",
platforms,
key="content_platform_single"
)
else:
col1, col2 = st.columns([3, 1])
with col1:
selected_keywords = st.multiselect(
"选择关键词(可多选)",
st.session_state.keywords,
key="content_kw_multi"
)
with col2:
platform = st.selectbox(
"统一平台",
platforms,
key="content_platform_multi"
)
# 第三行:高级优化技巧(折叠)
with st.expander("🎨 高级优化技巧(可选)", expanded=False):
technique_manager = OptimizationTechniqueManager()
all_techniques = technique_manager.list_techniques()
technique_options = [f"{tech['icon']} {tech['name']}" for tech in all_techniques]
selected_technique_names = st.multiselect(
"选择优化技巧",
options=technique_options,
default=[],
key="content_techniques",
help="选择要应用的优化技巧,可多选"
)
if selected_technique_names:
st.caption("已选择:" + "".join(selected_technique_names))
# 生成按钮
run_content_disabled = (not st.session_state.cfg_valid) or (gen_llm is None) or (not keywords_to_generate)
run_content = st.form_submit_button(
"🚀 生成内容",
use_container_width=True,
disabled=run_content_disabled,
type="primary"
)
# === 区域2:生成结果概览 ===
if st.session_state.generated_contents:
# 统计卡片
col1, col2, col3 = st.columns(3)
with col1:
st.metric("生成篇数", len(st.session_state.generated_contents))
with col2:
avg_score = sum(
item.get("score", {}).get("scores", {}).get("total", 0)
for item in st.session_state.generated_contents
if item.get("score")
) / len([item for item in st.session_state.generated_contents if item.get("score")]) if any(item.get("score") for item in st.session_state.generated_contents) else 0
st.metric("平均评分", f"{avg_score:.1f}/100" if avg_score > 0 else "未评分")
with col3:
st.metric("生成时间", datetime.now().strftime("%H:%M:%S"))
# 批量模式:内容列表
if len(st.session_state.generated_contents) > 1:
st.markdown("#### 📋 生成内容列表")
# 添加筛选和排序
filter_col1, filter_col2, filter_col3 = st.columns(3)
with filter_col1:
filter_platform = st.selectbox(
"筛选平台",
["全部"] + list(set(item["platform"] for item in st.session_state.generated_contents)),
key="content_filter_platform"
)
with filter_col2:
sort_by = st.selectbox(
"排序方式",
["生成顺序", "评分降序", "评分升序", "关键词"],
key="content_sort_by"
)
with filter_col3:
if st.button("📥 批量下载ZIP", use_container_width=True):
# ZIP下载逻辑
pass
# 内容列表(可展开)
for idx, item in enumerate(st.session_state.generated_contents):
with st.expander(
f"{idx+1}. {item['keyword']} - {item['platform']} | 评分: {item.get('score', {}).get('scores', {}).get('total', 'N/A')}/100",
expanded=False
):
# 快速预览和操作
col1, col2 = st.columns([3, 1])
with col1:
st.text_area(
"内容预览",
item["content"][:500] + "..." if len(item["content"]) > 500 else item["content"],
height=150,
disabled=True,
key=f"preview_{idx}"
)
with col2:
if st.button("查看详情", key=f"view_{idx}"):
st.session_state.selected_content_idx = idx
if st.button("下载", key=f"dl_{idx}"):
# 下载逻辑
pass
# 单篇模式或选中篇:详情展示
selected_idx = st.session_state.get("selected_content_idx", 0) if len(st.session_state.generated_contents) > 1 else 0
item = st.session_state.generated_contents[selected_idx]
# 使用Tabs组织详情
detail_tab1, detail_tab2, detail_tab3 = st.tabs(["📄 内容预览", "📊 质量分析", "🎨 增强工具"])
with detail_tab1:
# 内容预览
st.markdown(f"**关键词**: {item['keyword']} | **平台**: {item['platform']}")
if item["ext"] == "md":
st.code(item["content"], language="markdown")
else:
st.text_area("内容", item["content"], height=400, key="content_preview")
# 快速操作
col1, col2, col3 = st.columns(3)
with col1:
st.download_button("下载单篇", item["content"], f"{item['filename']}", use_container_width=True)
with col2:
if st.button("🔧 优化内容", use_container_width=True):
# 跳转到Tab3或打开优化面板
pass
with col3:
if st.button("📋 复制内容", use_container_width=True):
# 复制到剪贴板
pass
# JSON-LD(仅GitHub平台,折叠)
if item.get("json_ld") or item["platform"] == "GitHubREADME/文档)":
with st.expander("📋 JSON-LD Schema(可选)", expanded=False):
if item.get("json_ld"):
st.code(item["json_ld"], language="json")
else:
# 生成JSON-LD
pass
with detail_tab2:
# 质量分析
if item.get("score"):
# 评分卡片
score_data = item["score"]
scores = score_data.get("scores", {})
col1, col2, col3, col4, col5 = st.columns(5)
with col1:
st.metric("总分", f"{scores.get('total', 0)}/100")
with col2:
st.metric("结构化", f"{scores.get('structure', 0)}/25")
with col3:
st.metric("品牌提及", f"{scores.get('brand_mention', 0)}/25")
with col4:
st.metric("权威性", f"{scores.get('authority', 0)}/25")
with col5:
st.metric("可引用性", f"{scores.get('citations', 0)}/25")
# 详细分析(折叠)
with st.expander("📝 详细分析", expanded=False):
# 显示详细评分和改进建议
pass
else:
st.info("内容未评分,点击下方按钮进行评估")
if st.button("📊 评估内容质量", use_container_width=True):
# 评估逻辑
pass
# E-E-A-T和事实密度评估(折叠)
with st.expander("🎯 E-E-A-T 评估", expanded=False):
# E-E-A-T评估逻辑
pass
with st.expander("📊 事实密度评估", expanded=False):
# 事实密度评估逻辑
pass
with detail_tab3:
# 增强工具
st.markdown("#### 🎨 多模态增强")
# 图片生成(统一入口)
image_gen_col1, image_gen_col2 = st.columns([2, 1])
with image_gen_col1:
image_gen_mode = st.radio(
"图片生成方式",
["直接生成(基于内容)", "基于配图描述生成"],
horizontal=True,
key="image_gen_mode"
)
with image_gen_col2:
num_images = st.selectbox("生成数量", [1, 2, 3], key="num_images")
if st.button("🎨 生成图片", use_container_width=True, type="primary"):
# 统一的图片生成逻辑
pass
# 视频脚本生成(仅B站)
if "B站" in item["platform"]:
if st.button("🎬 生成视频脚本", use_container_width=True):
# 视频脚本生成逻辑
pass
# E-E-A-T强化(折叠)
with st.expander("✨ E-E-A-T 强化", expanded=False):
# E-E-A-T强化逻辑
pass
```
### 改动2:修复批量生成查看问题(P0)
**目标**:批量生成后,用户可以查看所有生成的内容
**具体改动**
```python
# 在区域2中添加内容列表
if len(st.session_state.generated_contents) > 1:
st.markdown("#### 📋 生成内容列表")
# 使用DataFrame展示列表
list_data = []
for idx, item in enumerate(st.session_state.generated_contents):
list_data.append({
"序号": idx + 1,
"关键词": item["keyword"],
"平台": item["platform"],
"评分": item.get("score", {}).get("scores", {}).get("total", "未评分"),
"字数": len(item["content"]),
"操作": f"查看_{idx}"
})
df = pd.DataFrame(list_data)
# 可交互的表格
selected_rows = st.dataframe(
df,
use_container_width=True,
hide_index=True,
on_select="rerun",
selection_mode="single-row"
)
# 根据选择显示详情
if selected_rows.selection.rows:
selected_idx = selected_rows.selection.rows[0]
st.session_state.selected_content_idx = selected_idx
st.rerun()
```
### 改动3:统一图片生成入口(P0)
**目标**:将多个图片生成入口合并为一个,通过选项区分
**具体改动**
```python
# 在detail_tab3中
st.markdown("#### 🖼️ 图片生成")
# 生成方式选择
gen_mode = st.radio(
"生成方式",
["智能生成(推荐)", "基于配图描述", "自定义Prompt"],
key="image_gen_mode",
help="智能生成:AI自动分析内容生成图片;基于描述:使用已生成的配图描述;自定义:手动输入Prompt"
)
if gen_mode == "智能生成(推荐)":
# 直接基于内容生成
if st.button("🎨 生成图片", use_container_width=True, type="primary"):
# 调用直接生成逻辑
pass
elif gen_mode == "基于配图描述":
# 检查是否有配图描述
if st.session_state.get("image_descriptions"):
if st.button("🎨 基于描述生成", use_container_width=True, type="primary"):
# 调用基于描述生成逻辑
pass
else:
st.info("💡 请先生成配图描述")
if st.button("📝 生成配图描述", use_container_width=True):
# 生成配图描述
pass
else:
# 自定义Prompt
custom_prompt = st.text_area("输入图片生成Prompt", height=100)
if st.button("🎨 生成图片", use_container_width=True, type="primary"):
# 使用自定义Prompt生成
pass
```
### 改动4:改进生成进度反馈(P1)
**目标**:批量生成时显示清晰的进度
**具体改动**
```python
if run_content:
# 初始化进度
total_items = len(keywords_to_generate)
progress_bar = st.progress(0)
status_text = st.empty()
contents = []
zip_buffer = io.BytesIO()
with zipfile.ZipFile(zip_buffer, "w", zipfile.ZIP_DEFLATED) as zip_file:
for idx, (keyword, plat) in enumerate(keywords_to_generate):
# 更新进度
progress = (idx + 1) / total_items
progress_bar.progress(progress)
status_text.text(f"正在生成 {idx + 1}/{total_items}: {keyword} - {plat}")
# 生成逻辑
with st.spinner(f"生成 {plat}{keyword}"):
# ... 原有生成逻辑 ...
contents.append({...})
# 完成提示
if idx == total_items - 1:
status_text.success(f"✅ 全部完成!共生成 {len(contents)} 篇内容")
# 清理进度显示
progress_bar.empty()
status_text.empty()
```
### 改动5:移动JSON-LD和技术配置到Tab3P0
**目标**:将不属于"创作"的功能移到"优化"Tab
**具体改动**
```python
# 从Tab2中删除2271-2572行的JSON-LD和技术配置代码
# 在Tab3(文章优化)中添加:
with tab3:
# ... 原有优化功能 ...
# 新增:结构化数据生成
st.markdown("---")
st.markdown("#### 📋 结构化数据生成")
struct_tab1, struct_tab2 = st.tabs(["JSON-LD Schema", "技术配置"])
with struct_tab1:
# JSON-LD生成逻辑(从Tab2移过来)
pass
with struct_tab2:
# 技术配置生成逻辑(从Tab2移过来)
pass
```
## 四、测试用例清单
### 测试用例1:单篇生成流程
**前置条件**
- 已配置API Key
- 已生成关键词(至少1个)
**测试步骤**
1. 进入Tab2
2. 选择"单篇生成"
3. 选择一个关键词
4. 选择一个平台(如"知乎")
5. 点击"生成内容"按钮
**预期结果**
- 显示生成进度(spinner
- 生成完成后显示内容预览
- 自动显示内容评分(如果有)
- 可以下载单篇内容
- 可以查看质量分析
- 可以使用增强工具
### 测试用例2:批量生成流程
**前置条件**
- 已配置API Key
- 已生成关键词(至少3个)
**测试步骤**
1. 进入Tab2
2. 选择"批量生成"
3. 选择3个关键词
4. 选择一个平台
5. 点击"生成内容"按钮
**预期结果**
- 显示进度条和状态文本
- 逐个生成内容
- 生成完成后显示内容列表
- 可以查看每篇内容的详情
- 可以批量下载ZIP
- 可以筛选和排序内容
### 测试用例3:内容评分失败处理
**前置条件**
- 已配置API Key
- 已生成关键词
**测试步骤**
1. 生成一篇内容
2. 模拟评分失败(如API错误)
**预期结果**
- 内容仍然生成成功
- 显示明确的警告信息:"内容已生成,但评分失败"
- 提供"重新评分"按钮
- 不影响其他功能使用
### 测试用例4:图片生成入口
**前置条件**
- 已生成一篇内容
- 已配置通义万相API Key
**测试步骤**
1. 进入"增强工具"Tab
2. 查看图片生成选项
3. 选择"智能生成"
4. 点击"生成图片"
**预期结果**
- 只显示一个图片生成入口
- 生成方式选择清晰
- 生成过程有进度提示
- 生成成功后显示图片预览
### 测试用例5:批量生成查看所有内容
**前置条件**
- 已批量生成5篇内容
**测试步骤**
1. 查看内容列表
2. 点击不同行的内容
3. 使用筛选功能
4. 使用排序功能
**预期结果**
- 列表显示所有生成的内容
- 可以点击查看每篇详情
- 筛选功能正常工作
- 排序功能正常工作
### 测试用例6:优化技巧应用
**前置条件**
- 已配置API Key
- 已生成关键词
**测试步骤**
1. 展开"高级优化技巧"
2. 选择2-3个技巧
3. 生成内容
**预期结果**
- 技巧选择器清晰可见
- 已选择的技巧有明确提示
- 生成的内容应用了选择的技巧
- 技巧效果在内容中体现
### 测试用例7:边界条件测试
**测试场景**
1. 关键词列表为空
2. 批量生成时未选择关键词
3. API Key无效
4. 生成过程中网络中断
5. 批量生成20篇内容(压力测试)
**预期结果**
- 所有边界条件都有明确的错误提示
- 不会导致页面崩溃
- 用户可以清楚知道问题所在
- 提供解决方案或重试选项
## 五、最小改动 MVP 优化清单(1天内完成)
### 优先级排序
**P0(必须完成)**
1. ✅ 修复批量生成查看问题(2小时)
2. ✅ 统一图片生成入口(1小时)
3. ✅ 改进生成进度反馈(1小时)
4. ✅ 修复内容评分失败提示(0.5小时)
**P1(建议完成)**
5. ✅ 重组布局结构(使用Tabs组织详情)(2小时)
6. ✅ 优化技巧选择器位置(0.5小时)
7. ✅ 添加批量生成内容列表(1小时)
**P2(可选)**
8. ⚠️ 添加内容筛选和排序(1小时)
9. ⚠️ 移动JSON-LD到Tab31小时)
### 实施顺序
1. **第一步**2小时):修复批量生成查看问题
- 添加内容列表展示
- 实现内容选择功能
- 测试批量生成流程
2. **第二步**2小时):重组布局结构
- 使用Tabs组织详情区域
- 调整功能分组
- 优化信息层级
3. **第三步**1.5小时):统一图片生成入口
- 合并多个生成入口
- 添加生成方式选择
- 测试图片生成流程
4. **第四步**1小时):改进进度反馈
- 添加进度条
- 添加状态文本
- 测试批量生成进度
5. **第五步**0.5小时):修复评分失败提示
- 改进错误提示
- 添加重试按钮
- 测试错误处理
**总计**:约7小时,可以在1个工作日内完成
## 六、额外风险与体验优化
### 额外风险(至少5条)
1. **状态同步问题** ⚠️ 高风险
- 风险:批量生成时,如果用户刷新页面,可能丢失生成进度
- 解决:将生成进度保存到session_state,支持断点续传
2. **API调用频率限制** ⚠️ 中风险
- 风险:批量生成时,可能触发API频率限制
- 解决:添加请求间隔,实现重试机制
3. **内容过长导致页面卡顿** ⚠️ 中风险
- 风险:生成的内容很长时,页面渲染可能卡顿
- 解决:使用虚拟滚动或分页加载
4. **并发生成冲突** ⚠️ 低风险
- 风险:用户快速点击生成按钮,可能触发多次生成
- 解决:添加生成状态锁,防止并发
5. **ZIP文件过大** ⚠️ 低风险
- 风险:批量生成大量内容时,ZIP文件可能过大
- 解决:添加文件大小检查,超过限制时分批下载
### 体验优化建议
1. **添加快捷操作** 💡
- 在内容预览区域添加快捷按钮:复制、优化、下载
- 使用图标按钮,节省空间
2. **添加内容对比功能** 💡
- 批量生成时,可以选择2篇内容进行对比
- 帮助用户快速筛选优质内容
3. **添加内容模板预览** 💡
- 选择平台时,显示该平台的模板特点
- 帮助用户选择合适的平台
4. **优化错误提示** 💡
- 使用更友好的错误提示
- 提供具体的解决方案
5. **添加操作历史** 💡
- 记录用户的操作历史
- 支持快速重做上次操作
## 七、功能归属检查
### ✅ 属于本Tab的功能
1. **内容生成**
- 单篇生成
- 批量生成
- 平台模板选择
- 优化技巧应用
2. **内容预览**
- 内容展示
- 快速操作(下载、复制)
- 内容列表(批量模式)
3. **质量分析**
- 内容评分
- E-E-A-T评估
- 事实密度评估
4. **增强工具**
- 图片生成
- 视频脚本生成
- 多模态提示生成
### ⚠️ 建议调整的功能
1. **JSON-LD Schema生成** ⚠️
- 当前位置:Tab2
- 建议位置:Tab3(文章优化)或独立Tab
- 理由:属于"优化"范畴,不是"创作"核心功能
2. **技术配置生成** ⚠️
- 当前位置:Tab2
- 建议位置:Tab3(文章优化)或独立Tab
- 理由:属于"优化"范畴,不是"创作"核心功能
3. **E-E-A-T强化** ⚠️
- 当前位置:Tab2(内容详情中)
- 建议位置:Tab3(文章优化)
- 理由:属于"优化"操作,应该在优化Tab进行
### ❌ 不应放在这里的功能
1. **工作流自动化**
- 当前位置:Tab7
- 理由:已在独立Tab,无需调整
2. **平台同步**
- 当前位置:Tab9
- 理由:已在独立Tab,无需调整
## 八、实施建议
### 分阶段实施
**第一阶段(MVP**:完成P0问题修复
- 修复批量生成查看问题
- 统一图片生成入口
- 改进进度反馈
- 修复评分失败提示
**第二阶段(优化)**:完成P1优化
- 重组布局结构
- 优化技巧选择器
- 添加内容列表
**第三阶段(增强)**:完成P2功能
- 添加筛选和排序
- 移动JSON-LD到Tab3
- 添加内容对比功能
### 代码重构建议
1. **提取内容生成逻辑**
- 将内容生成逻辑提取到独立函数
- 便于测试和维护
2. **统一状态管理**
- 使用统一的状态管理方式
- 避免状态冲突
3. **优化组件复用**
- 提取可复用的UI组件
- 减少代码重复
### 测试建议
1. **单元测试**
- 测试内容生成逻辑
- 测试状态管理
2. **集成测试**
- 测试完整生成流程
- 测试错误处理
3. **用户体验测试**
- 邀请真实用户测试
- 收集反馈意见