原型设计 —— 校园失物招领系统原型设计

一、原型设计工具对比（Axure、墨刀、Mockplus）
本次系统原型开发前，对三款主流原型设计工具进行优缺点分析，结合项目需求确定最终使用工具。
Mockplus（摹客 RP）
适用场景：移动端 APP、小程序、小型管理系统、课程作业快速原型设计，新手学生群体首选。
优点：全中文操作界面，内置大量表单、按钮、导航等预制组件，拖拽式设计无需代码；免费版满足课程原型制作，一键生成分享链接与预览二维码，原型预览便捷。
缺点：不适合大型复杂业务系统原型，高级动态交互功能需要付费开通会员，自定义拓展性偏弱。
墨刀
适用场景：微信小程序、校园类轻应用、移动端产品快速原型，国内高校课程设计最常用工具。
优点：云端在线保存项目，浏览器直接使用，无需安装大型客户端；拥有海量生活化、校园场景 UI 素材，搭建失物招领页面效率高；一键生成 H5 预览链接，方便老师在线查看原型交互效果。
缺点：大型 PC 端后台系统制作吃力，免费版存在项目数量上限，复杂动态面板交互受限。
Axure RP
适用场景：商用大型软件、企业级后台、高保真复杂交互原型，专业产品工作使用。
优点：行业专业原型软件，动态面板、条件判断、数据联动功能完善，可实现高度仿真产品交互，导出 HTML、规格文档等多种格式。
缺点：软件体积大、安装繁琐，原版英文界面，学习门槛高，零基础短期难以熟练使用，正版软件收费高昂，不适合短期课程作业。
选型总结：本项目《校园失物招领系统》为校园小程序轻量化应用，综合上手难度、素材丰富度、预览便捷度，最终选用墨刀完成原型设计。
二、校园失物招领系统整体设计概述

1. 系统名称
   校园失物招领小程序系统
2. 目标用户与核心功能
   面向全体在校师生，解决校园物品遗失、捡拾后信息不对称问题，核心功能如下：
   （1）寻物发布：物品丢失用户填写物品信息、丢失地点、联系方式，发布寻物启事；
   （2）招领发布：捡到物品用户上传物品照片、拾取位置，发布招领信息；
   （3）信息检索浏览：按照物品分类、校区筛选查看全部失物与招领信息；
   （4）详情查看与联系：查看启事完整信息，私信发布人沟通认领事宜；
   （5）个人中心：管理自己发布的启事、已完成认领记录。
3. 界面设计考虑因素
   （1）用户层面：使用人群为在校大学生，界面简洁直观，减少冗余输入，支持学号快捷登录，降低使用门槛；
   （2）使用场景：手机移动端使用，按钮尺寸适配手机点击操作，页面布局符合小程序使用习惯；
   （3）校园场景：地点选项预设图书馆、教学楼、食堂、宿舍区、操场等校园常用点位，减少手动输入；
   （4）实用优化：首页置顶校园卡、身份证等重要证件紧急遗失信息，提高物品找回概率。
   三、四大核心界面详细设计说明
   本次原型选定 4 个关键页面：系统首页、寻物启事发布页、失物信息列表页、启事详情页，分别从功能、页面组成、前置条件、后置条件、操作步骤五个维度说明。
   页面 1：系统首页
   界面功能：系统入口主页，展示系统导航、最新寻物 / 招领信息流、分类搜索、快速发布入口。
   界面组成：顶部搜索框 + 校区筛选栏；中部【我要寻物】【我要招领】两大快捷按钮；下方最新寻物、最新招领信息流卡片；底部导航栏（首页、发布、我的）。
   前置条件：用户在微信打开小程序链接，无论是否登录均可进入首页。
   后置条件：点击【我要寻物】跳转寻物发布页面；点击信息流卡片跳转启事详情页；点击底部【我的】跳转个人中心页面。
   操作步骤：用户进入首页，可在顶部搜索框输入物品名称检索信息，需要发布寻物时，点击【我要寻物】按钮进入发布页面。
   页面 2：寻物启事发布页
   界面功能：填写遗失物品相关信息，提交完成寻物启事发布。
   界面组成：左上角返回首页按钮；表单区域（物品名称、物品分类、丢失时间、丢失地点、物品详情描述、联系电话、图片上传）；页面底部【提交发布】按钮。
   前置条件：用户在系统首页点击【我要寻物】按钮，跳转至本页面。
   后置条件：必填信息填写完整后点击提交，自动跳转失物信息列表页面；点击左上角返回按钮，撤回填写内容，回到系统首页。
   操作步骤：依次选择物品分类、填写名称、丢失时间与地点，补充物品特征描述，按需上传丢失物品照片，确认信息无误后点击提交发布。
   页面 3：失物信息列表页
   界面功能：集中展示所有已发布寻物启事，支持按照物品分类筛选内容。
   界面组成：顶部物品分类筛选标签（证件类、数码产品、生活用品、书本文具）；启事信息卡片列表（卡片包含物品名、丢失地点、发布时间、物品缩略图）；左上角返回首页按钮。
   前置条件：①用户发布寻物启事提交成功自动跳转本页面；②首页点击 “查看更多寻物” 跳转列表页。
   后置条件：点击分类标签，列表自动刷新筛选对应物品；点击任意启事卡片，跳转至启事详情页面。
   操作步骤：进入列表页面后，可按需点击顶部分类筛选物品，找到目标物品后点击对应卡片查看详细内容。
   页面 4：启事详情页
   界面功能：查看启事完整信息，发起私信联系发布人协商认领。
   界面组成：左上角返回按钮；物品大图展示区；完整信息栏（物品介绍、丢失时间地点、发布人预留联系方式）；页面底部【私信联系】功能按钮。
   前置条件：在首页信息流或者失物列表页点击任意启事卡片，跳转至详情页面。
   后置条件：点击【私信联系】弹出聊天弹窗，可和发布人沟通；点击返回按钮，回到上一级页面（列表页 / 首页）。
   操作步骤：浏览物品全部详情信息，确认是自己捡拾物品后，点击私信按钮联系发布人，约定线下认领时间地点。
   四、页面整体跳转业务流程
   用户打开小程序→进入【系统首页】
   首页点击【我要寻物】→【寻物启事发布页】→填写信息提交→【失物信息列表页】；
   首页信息流 / 列表页面点击物品卡片→【启事详情页】→详情页返回→回到列表页或首页；
   首页底部导航点击【我的】→跳转个人中心（拓展页面）。

五、设计总结
本校园失物招领系统立足校园真实使用场景，围绕师生寻物、招领两大核心需求完成原型设计，页面流转逻辑清晰、操作简单。借助墨刀快速完成页面布局与交互跳转，原型可以直观展示系统整体业务流程，后续可基于本原型进一步优化功能、迭代开发正式小程序。