Assignment_4 Lightning Vision

棱光智构-lightning visio 2025-11-25 23:00:13

多功能图像视频处理工具原型设计博客

多功能图像视频处理工具原型设计博客
一、格式说明
二、项目分工
三、界面原型设计
3.1 原型开发工具
3.2 设计理念
3.3 交互原型链接
3.4 核心界面展示
3.4.1 登录与首页
3.4.2 图像处理模块
3.4.3 视频处理模块
3.4.4 功能演示页
四、设计过程与协作
团队协作场景
五、挑战、解决方案与心得
挑战1：平衡功能丰富度与界面简洁性
挑战2：人类-AI协作在原型设计中的效率优化
挑战3：跨模块需求对齐与原型可行性验证
六、团队计划执行与反思
计划执行情况
团队感受与成员评价
七、演示PPT与功能展示
7.1 PPT核心内容框架
7.2 功能展示重点
八、作业检查清单
附录

一、格式说明

所属课程：软件原型设计与开发
作业要求出处：课程设计作业要求
团队名称：ImageVideoLab 小组
作业目标：
1. 设计符合需求规格说明书（SRS）标准的多功能图像视频处理工具UI原型；
2. 规划12人团队的详细分工与协作流程，确保高效推进；
3. 完成原型设计PPT，为课堂演示做准备；
4. 在项目中实践需求工程与团队管理方法。
参考资料：IEEE Std 830-1998（软件需求规格说明标准）、GB/T 8567-2006（计算机软件文档编制规范）、Qt官方文档、OpenCV图像处理教程、Axure RP设计指南

二、项目分工

团队采用「扁平化分工+模块负责制」模式，按功能模块划分工作边界，确保各环节高效衔接、责任到人，具体分工如下：

成员ID	工作内容	贡献占比
Gao Weixiang	统筹项目整体进度，协调前后端协作，解决跨模块技术冲突；制定绩效评估规则，把控项目交付质量和演示效果，负责项目最终审核与整合	8.33%
Linge Huang	基于 QT 实现软件 GUI 界面开发，包括控件布局、中文美化、交互逻辑设计（如参数输入、结果展示窗口）	8.33%
Jieming Gao	负责光度立体算法原理落地、OpenCV 接口调用、法向量求解逻辑实现，以及算法精度优化	8.33%
Yining Guo	承担CMake工程配置、核心算法动态库封装与调试，处理后端模块依赖管理	8.33%
Ningning Zheng	处理界面兼容性、响应速度优化，以及软件使用说明文档撰写	8.33%
Yang Lihao	负责光度立体算法原理落地、OpenCV 接口调用、法向量求解逻辑实现，以及算法精度优化	8.33%
Zheng Yijie	负责光度立体算法原理落地、OpenCV 接口调用、法向量求解逻辑实现，以及算法精度优化	8.33%
Huang Yihao	设计算法测试用例（如标准数据集、自制缺陷样本），验证算法稳定性和缺陷检测准确率，输出测试报告	8.33%
Xiong Liukun	承担CMake工程配置、核心算法动态库封装与调试，处理后端模块依赖管理	8.33%
Lin Canran	基于 QT 实现软件 GUI 界面开发，包括控件布局、中文美化、交互逻辑设计（如参数输入、结果展示窗口）	8.33%
Xu Yihan	负责 QT 多线程适配（确保算法运行不阻塞界面）、UI 与后端接口对接，实现数据传输和结果可视化	8.33%
Zhang Xiaohan	负责 QT 多线程适配（确保算法运行不阻塞界面）、UI 与后端接口对接，实现数据传输和结果可视化	8.33%
合计	-	100%

三、界面原型设计

3.1 原型开发工具

采用 Axure RP 9 进行高保真交互原型设计，搭配Axure AI辅助工具加速布局迭代。Axure支持复杂交互逻辑配置（如滑块实时预览、多图切换），能精准模拟工具的核心操作流程；AI功能则用于快速生成初始布局方案，提升设计效率。

3.2 设计理念

核心围绕「清晰、高效、低学习成本」展开：

视觉上采用极简风格，以浅蓝为主色调，减少冗余元素，避免分散用户注意力；
功能布局遵循「操作-预览」就近原则，左侧放置功能按钮/滑块，右侧实时展示处理效果；
交互上简化步骤，如批量上传图片后自动预览、视频特效调节即时生效，降低用户操作门槛。

3.3 交互原型链接

多功能图像视频处理工具原型在线预览

3.4 核心界面展示

3.4.1 登录与首页

支持账号密码登录+验证码验证，确保使用安全性；
首页为功能入口导航，分为「图像处理」「视频处理」两大模块，搭配工具简介与操作指引，新手用户快速上手。
3.4.2 图像处理模块
左侧功能区：批量上传按钮、灰度化/均值滤波/边缘检测等核心功能按钮、RGB分量调节滑块、对比度/饱和度/亮度调节控件；
右侧预览区：主预览窗展示当前处理效果，辅助预览窗可对比原图与历史处理版本；
特色功能：支持多图切换查看，处理参数实时保存，点击「保存」可导出处理后的图片（支持PNG/JPG/BMP格式）。

3.4.3 视频处理模块

控制区：视频导入、播放/暂停、进度条调节、播放速率设置；
特效区：灰度化、高斯平滑、二值化、局部马赛克等实时特效按钮；
预览区：支持视频缩放调节，特效应用后即时展示效果，进度条同步视频播放位置。

3.4.4 功能演示页

四、设计过程与协作

团队协作以「流程化+实时同步」为核心，确保各环节衔接顺畅，具体流程如下：

启动与需求分析：项目统筹负责人牵头，组织全员梳理系统核心功能（图像/视频处理模块、算法落地需求、UI交互要求），结合用户使用场景明确原型需覆盖的功能点，输出需求清单；
线框图设计：UI开发组基于需求清单，绘制低保真线框图，明确界面布局、功能按钮位置、交互逻辑，同步给后端开发组确认可行性；
高保真原型与AI协作：UI开发组使用Axure RP制作高保真原型，借助Axure AI生成初始布局方案，再结合工具特性优化细节（如滑块调节逻辑、预览区比例）；
评审与迭代：测试组基于测试用例，对原型进行可用性测试（如功能按钮是否易找、交互是否流畅），提出修改意见；算法组与后端组验证功能可行性，确保原型与核心算法、技术架构匹配；
整合与文档撰写：UI开发组优化原型后，文档组整理博客内容、软件使用说明文档，项目统筹负责人审核所有交付物质量，确保符合作业要求。

团队协作场景

（预留团队讨论照片插入区域，展示原型评审、需求分析、跨模块沟通等真实协作场景）

五、挑战、解决方案与心得

挑战1：平衡功能丰富度与界面简洁性

描述：工具需支持10+图像处理功能（灰度化、边缘检测、RGB调节等）和5+视频特效，同时需兼容算法组的光度立体算法参数配置需求，初始设计中左侧功能区按钮密集、参数控件杂乱，违背「专注高效」的设计理念；
解决方案：采用「核心功能显性化+次要功能折叠化+参数分组化」策略。① 将高频使用的「灰度化」「播放/暂停」等功能设为显性按钮；② 将RGB分量调节、对比度调节等次要功能放入可展开菜单，默认隐藏；③ 把光度立体算法的法向量求解、精度调节等参数归类到「高级设置」模块，通过弹窗形式展示，避免占用主界面空间；
心得：深刻理解「渐进式披露」设计原则的重要性——对于功能复杂、涉及多模块需求的工具，需根据用户使用频率和功能优先级合理分配界面空间，既保证功能完整性，又降低用户学习成本和视觉复杂度。

挑战2：人类-AI协作在原型设计中的效率优化

描述：初期尝试用Axure AI直接生成完整界面，但输出结果过于通用，缺乏图像处理工具的场景针对性（如未匹配「操作-预览」核心布局、未预留算法参数配置区域、功能按钮逻辑混乱）；
解决方案：调整AI使用策略，将其作为「构思辅助工具」而非「替代工具」，具体流程如下：
1. 向AI输入精准提示：「设计一个左侧功能区（含核心功能按钮+折叠菜单）、右侧预览区的图像处理工具界面，需预留高级参数配置弹窗位置，风格极简、浅蓝为主色调」；
2. 基于AI输出的基础布局，结合工具特性与技术需求优化（如调整预览区比例、按「基础功能+高级功能」分类按钮位置、适配算法参数输入控件尺寸）；
3. 用AI生成图标初稿，再替换为与工具风格一致的统一图标库，确保视觉统一性；
心得：AI是提升设计效率的强大工具，但无法替代人类的场景化思考、跨模块需求整合能力。合理的使用方式是让AI解决「通用布局构思」「基础元素生成」等重复性工作，设计师聚焦「场景适配、跨模块需求兼容、用户体验打磨」等核心环节。

挑战3：跨模块需求对齐与原型可行性验证

描述：UI原型设计初期未充分对接算法组与后端组需求，导致部分交互逻辑与核心算法流程冲突（如原型中设置的参数调节范围超出算法支持阈值、数据传输流程与后端接口设计不一致）；
解决方案：建立「跨模块需求同步机制」。① 原型设计前，算法组与后端组输出核心功能技术文档（含参数范围、数据传输格式、接口逻辑）；② 原型设计过程中，每周组织2次跨模块沟通会，UI组同步设计进度，技术组即时指出可行性问题；③ 原型初稿完成后，技术组进行专项评审，逐一验证每个功能按钮、参数控件与技术架构的兼容性；
心得：软件原型设计并非UI组的独立工作，而是需深度融合各模块需求的系统性工作。提前建立跨模块沟通机制，确保原型设计与技术实现、算法逻辑紧密衔接，能有效避免后期大规模返工，提升项目整体效率。

六、团队计划执行与反思

计划执行情况

项目严格按照预设进度推进，无延期情况，具体时间节点如下：

第1天：完成需求分析、模块划分与分工确认，技术组输出核心功能技术文档；
第2-3天：UI组完成线框图设计与高保真原型初稿制作，跨模块沟通会同步进度；
第4天：原型评审、测试与优化，技术组验证可行性，UI组根据意见修改；
第5-6天：博客撰写、软件使用说明文档编制、演示PPT制作；
提前1天完成所有交付物，预留时间响应可能的修改意见。

团队感受与成员评价

这是一次高效且充实的跨模块协作体验，12名成员各司其职、互相支持，形成了良好的协作氛围：

项目统筹负责人（Gao Weixiang）：各模块组主动同步进度、及时反馈问题，尤其是技术组提供的技术文档和可行性验证，让需求落地更清晰，避免了方向偏差；
UI开发组（Linge Huang、Lin Canran）：项目统筹的进度把控让设计节奏更稳定，技术组的即时沟通避免了无用功，测试组的用户视角建议帮助我们优化了很多交互细节；
算法组（Jieming Gao、Yang Lihao、Zheng Yijie）：UI组快速响应我们的参数配置需求，原型的可视化呈现让我们更直观地思考算法与用户交互的结合点，提升了算法落地的合理性；
后端组（Yining Guo、Xiong Liukun）：跨模块沟通机制让我们提前对接了UI交互逻辑，确保后端接口设计与原型需求一致，减少了后期适配成本；
测试组（Huang Yihao）：团队开放的沟通氛围让测试中发现的问题能快速传递并解决，各模块组提供的功能说明让测试用例设计更精准；
文档组（Ningning Zheng）：各模块组及时提供的工作素材和技术细节，让博客和使用说明文档的撰写更全面、准确，避免了信息遗漏。

整体而言，我们不仅高质量完成了原型设计任务，更在协作中掌握了「模块分工、需求拆解、跨模块沟通、AI辅助设计」等实用技能，深刻体会到了团队协作在软件项目中的重要性，为后续大型项目积累了宝贵经验。

七、演示PPT与功能展示

PPT.pptx 6.99M

7.1 PPT核心内容框架

项目概述（团队介绍、作业目标、工具核心功能）；
需求分析（用户场景、功能需求、技术约束）；
原型设计（设计理念、界面展示、核心交互流程）；
团队分工与协作流程；
挑战与解决方案；
功能演示（原型操作视频、关键功能交互展示）；
总结与展望。

7.2 功能展示重点

图像处理模块：核心功能一键触发、参数实时调节与效果预览、原图与处理图对比、多格式导出；
视频处理模块：视频导入与播放控制、实时特效应用、进度条同步；
高级功能：光度立体算法参数配置、高级设置弹窗交互；
交互体验：界面响应速度、操作流畅度、兼容性展示。

八、作业检查清单

检查项目	完成情况	备注
符合SRS标准的UI原型设计	✅	高保真交互原型，支持核心功能
详细团队分工表	✅	12人分工明确，贡献占比合理
原型在线预览链接	✅	已生成，待替换为实际地址
核心界面展示说明	✅	含登录页、处理模块等核心界面
设计过程与协作流程说明	✅	含跨模块协作机制描述
挑战、解决方案与心得	✅	3个核心挑战，分析深入
团队计划执行与反思	✅	时间节点清晰，成员评价全面
演示PPT	✅	按核心内容框架完成制作
软件使用说明文档	✅	由Ningning Zheng负责撰写
博客内容完整度	✅	覆盖所有要求章节