我的第三次做業：原型設計

所屬課程	https://edu.cnblogs.com/campus/xnsy/Autumn2019SoftwareEngineeringFoundation/
做業要求	http://www.javashuo.com/article/p-rghulogc-cn.html
做業目標	經過選擇具體項目來作需求分析，再根據需求分析與原型工具來對項目進行原型設計，達到熟悉原型設計流程的目的

---

1、原型工具對比

1.墨刀

• 優勢
  • 教程清晰明瞭，易上手
  • 模板種類較多，素材豐富，且模板大多爲國內網站
  • 能夠方便的將原型設計導出
  • 在Web端與手機端都支持方便快捷的預覽
• 缺點
  • 不支持多種導出形式
  • 可供利用組件較少

2.Mockplus

• 優勢
  • 設計方便快捷，易上手
  • 組件種類豐富，樣式齊全
  • 支持原型設計的多種導出形式，例如項目包、演示樹、HTML演示
  • 支持自動生成的流程圖
• 缺點
  • 新建項目時可供選擇的模板較少
  • 圖形素材庫中的素材大部分需收費
  • 免費版不支持任何的導出形式（我就被坑了(* ￣︿￣)），只支持本地預覽

3.Axure RP

• 優勢
  • 自帶豐富的組件庫且支持第三方組件庫
  • 強大的交互支持
  • 教程詳細完整
  • 能夠快捷方便的進行多人協做設計
• 缺點
  • 專業性較強，學習成本較高
  • 不少組件是利用起來很繁瑣

4.綜上

Axure RP專業性較強且上手較慢，隨提供了強大的組件庫但利用起來卻較爲繁瑣；墨刀與Mockplus都都爲國內團隊設計，有很好的本地化支持，但墨刀可供利用的素材模板較少且擴展度低，而Mockplus組件齊全且模板豐富，最終選擇了Mockplus做爲這次做業的原型設計工具。

---

2、需求分析

我選擇了項目一來作需求分析

1.小程序端

項目要求中提到學生在剛進入大學士沒有了解各類社團的長期的、便利的渠道，各種信息分散各處。因此，小程序端功能的最大特點即是將各種社團信息與活動信息集成起來；此外，學生在看到感興趣的社團或者活動時有快捷的活動加入與社團加入渠道；另外，學生還須要清晰明瞭的消息接收渠道。綜上，列出小程序原型結構圖以下：

2.Web端

項目要求中提到Web端要面向社團管理員與社聯管理員，其中社團管理員要在Web端進行活動發佈、報名人員信息統計、報名審覈、消息通知發佈的功能；而對於社聯管理員，須要在Web端對社團發送的活動申請進行審覈批准、對社團進行星級評定、發送通知信息等。綜上，列出Web端原型結構圖以下：

---

3、原型設計

1.原型設計可查看地址

因爲Mockplus的免費版只支持本地預覽，不支持任何形式的導出，故在此只能給出本次原型設計完成後生成的.mp文件的下載連接（.mp文件只能經過Mockplus打開），望見諒！

百度網盤連接：
https://pan.baidu.com/s/1OJWrNbya-X3WuiRGkJTlzA 提取碼：5m3x

2.詳細功能介紹

因爲部分展現頁面添加了頁面下拉滾動功能，致使展現圖頁面較長。。。爲了將圖片截全致使圖片模糊。。。望見諒！詳細且清晰原型設計內容務必下載網盤中的.mp文件後用Mockplus打開查看！

• 小程序端

  - 註冊及登錄頁面以下：

  - 「首頁」展現以下：

  • 首頁輪播圖連接：

  - 「活動」頁面展現以下：

  • 活動一展現頁面：
  • 活動一報名申請：
  • 活動一報名詳情：

  - 「社團」頁面展現以下

  • 社團詳情頁面展現：
  • 社團申請加入頁面：
  • 申請提交成功頁面：

  - 「個人」頁面展現以下

  • 個人社團頁面展現：
  • 個人消息頁面展現：
  • 個人活動頁面展現：

---

• Web端

  - 登錄頁面及身份選擇：

  - 社團管理員頁面展現：

  • 首頁
  • 活動發佈：
  • 統計信息查看：
  • 消息發佈：
  • 審覈批准：

  - 社聯管理員頁面展現：

  • 首頁
  • 社團活動申請查看：
  • 社團活動申請經過：
  • 社團活動申請打回：
  • 社團星級評定詳細查看：
  • 社團星級評定選擇：
  • 社聯消息發佈：