天天看點

結對作業一(原型設計)

這個作業屬于哪個課程 <2021春軟體工程實踐|S班>
這個作業要求在哪裡 <結對作業一>
結對學号 <221801230>、<221801334>
這個作業的目标

1.NABCD模型

2.原型設計

其他參考文獻 CSDN、簡書、部落格園等

目錄

  • PSP表格
  • 效能分析
  • NABCD模型
    • N(Need,需求)
      • 目标使用者
      • 根本需求
      • 痛點分析
      • 基本需求(具體檢視作業要求)
      • 拓展需求
    • A(Approach,做法)
      • 目标
      • 原型設計
      • 具體實作
    • B(Benefit,好處)
    • C(Competitors,競争)
      • 優勢
      • 劣勢
    • D(Delivery,推廣)
  • 原型工具的使用
  • 原型位址
  • 原型介紹
    • 1.總體架構
    • 2.登入/注冊
      • 登入
      • 注冊
    • 3.首頁
      • 輪播圖
      • 最新資訊
    • 4.論文清單
      • 功能區
      • 論文添加
      • 批量操作
      • 論文翻譯
    • 5.資料統計
    • 6.總論文統計
    • 7.收藏夾
  • 困難解決
  • 結隊過程
  • 結隊感受
  • 隊友評價

因為還沒開始編碼,是以PSP表格中部分項目僅記錄預估耗時的部分。

PSP2.1 Personal Software Process Stages 預估耗時(分鐘) 實際耗時(分鐘)
Planning 計劃 45 60
• Estimate • 估計這個任務需要多少時間
Development 開發 1130
• Analysis • 需求分析 (包括學習新技術) 240
• Design Spec • 生成設計文檔 30
• Design Review • 設計複審
• Coding Standard • 代碼規範 (為目前的開發制定合适的規範)
• Design • 具體設計 50
• Coding • 具體編碼 600
• Code Review • 代碼複審
• Test • 測試(自我測試,修改代碼,送出修改) 120
Reporting 報告
• Test Repor • 測試報告
• Size Measurement • 計算工作量
• Postmortem & Process Improvement Plan • 事後總結, 并提出過程改進計劃
合計 1295

這次作業中我們的時間主要花費在了讨論如何進行原型設計以及具體的原型設計中。
  • 在原型設計中,除了要滿足使用者的基本功能,進行合理地拓展功能之外,我們還需要考慮如何使得我們的原型更加地美觀?更加地接近實際?更加地貼近使用者?對于這幾個問題的研究占據了我們讨論的大部分時間,因為我們深知美觀可以帶來一個良好的第一印象,而且在産品當中大家的功能差別不是很大的情況下,這就尤為重要。
  • 原型設計工具的學習占據的時間較小,使用原型設計工具進行原型設計的過程是我們另一個占據了大部分時間的工作。我們在開始進行原型設計之前,已經進行了多次的讨論,确定了原型的大概,但是實際的過程中并不是一次就能完成的,我們經常讨論,然後否定原來的設計,推倒了重做。

小剛、想要了解計算機視覺領域研究現狀的群體(包含教師教授、學生、相關從業者等)

通過閱讀論文了解計算機視覺領域的研究現狀,了解近幾年計算機視覺領域的熱門研究方向。

難以從大量論文中擷取需要的資訊。

  • 擷取待爬取論文清單及論文資訊爬取(單個、批量爬取)
  • 對已爬取的論文清單進行操作(論文清單的增、删、改、查)
  • 分析已爬取到的論文資訊,提取top10個熱門領域或熱門研究方向(圖譜、圖表的形式)

  • 增加登入、注冊——為使用者添加更多的個性化功能
  • 顯示三大會議的最新資訊——幫助使用者擷取更多感興趣的資訊
  • 論文清單增加更加豐富的查詢方式——幫助使用者更加高效地擷取想要的資訊
  • 增加對論文清單的一些批量操作功能——對基本需求進一步的完善
  • 增加對國家、學校、三大會議投稿量的資料統計——讓使用者從多個方面快速了解計算機視覺領域資訊
  • 收藏夾功能——使用者可以收藏一些有用的論文
  • 論文翻譯功能——可以幫助使用者高效了解論文

目标是制作一個Web項目,基礎是實作小剛的基本需求,之後在這基礎上,分析并進一步實作像小剛一樣想要了解計算機視覺領域研究現狀的群體的需求。

工具:Axure RP 9

步驟:優先設計基礎需求的部分,再按照拓展需求進一步優化完善。

說明:首頁中盡量使用圖檔,美觀為主;資訊的操作界面需要盡可能簡介,功能明确;資訊的統計盡可能使用圖表的形式展示,以直覺的方式展示。

程式設計語言:HTML、CSS、JavaScript、java

采用前後端分離開發,前端根據原型展示頁面,後端進行資料的爬取、處理等。

步驟:分解功能,計劃每天的工作量,白天兩人分别實作功能的前後端部分,晚上進行聯合測試。優先實作基礎需求的部分,後續在按照拓展需求進一步優化完善。

規劃:

将項目劃分為七個部分:前期準備、登入注冊、首頁、論文清單、資料統計和總論文統計、個人中心(包含收藏夾等)、部落格的撰寫與總結。每天完成一個部分,兩人分工一人負責前端,一人負責後端,每天晚上進行聯合調試。

其中前期的準備需要進行商定程式設計規範、學習springboot架構、學習爬蟲技術等工作。

  • 界面的操作簡單,使用者可以更加高效地擷取自己需要的資訊。
  • 資訊的展示直覺,資料的展示通過圖表、圖檔等直覺的形式展示,使用者可以更加輕松地了解、擷取相關的資訊。
  • 資訊的内容完備,網站專注于在計算機視覺領域的三大頂級會議統計資訊,足以滿足想要了解計算機視覺領域研究現狀的群體的需求。
  • 資訊的内容“熱乎”,網站會自動實時更新上面的資料,實時跟蹤最新的論文進展,以滿足使用者對于高品質内容的需求。

  • 相較于中國知網那樣大體量的論文平台,該平台隻着重于計算機視覺領域的三大頂級會議,更加适用于計算機視覺領域的使用者。
  • 項目的需求和分析開發并不局限于小剛,該項目适合所有像小剛一樣的想要了解計算機視覺領域研究現狀的群體。
  • Web項目本身的特性使得使用者使用友善,不需要下載下傳安裝,相容各種包含浏覽器的裝置,具有便捷的特點。
  • 目前未在市面上發現與之類似的、被大衆熟知的産品,具有先發優勢。
  • 除了論文的相關情況外,也提供了三大會議的一些資訊,進一步滿足使用者想要了解該領域的需求。
  • 首頁展示使用者最關心的資料資訊,幫助使用者更加高效地擷取資訊。
  • 可以批量進行論文清單的操作,友善使用者的使用。

  • 相較于中國知網,缺少對論文的資訊進行更加細化的操作。
  • 界面的互動、界面的美觀方面相較于中國知網有所不足。

初期時候現在小範圍有需求的同學間試用,獲得回報,提高使用者體驗

達到一定的使用者量後,再進行較大範圍的推廣,推廣在平台穩定程度高的限度内進行,逐漸擴充。當有一定影響力後,可以嘗試尋求合作方,擴大使用者量

主要宣傳平台有:微網誌、知乎、部落格園、微信公衆号

在對比了作業中推薦的幾種原型模型設計工具後,最後選擇了Axure RP 9,因為以前就有聽說過,且該軟體功能較完善,能很好地滿足我們進行原型設計的要求。
結對作業一(原型設計)

原型位址:https://cujolh.axshare.com

因為使用的是Axure RP 9,加載比較慢,請耐心等待。

我們的項目名稱為:PaperCV。paper是論文的含義,CV是計算機視覺。

以下是我們項目設計的總體架構,其中除了實作使用者的所有基本功能外,我們也做了一些功能上的完善和拓展。

結對作業一(原型設計)

  • 使用者在進入網站時,會進入登入界面,登入後才能進入首頁
  • 如果使用者沒有賬号,點選立即注冊即可新增賬號
  • 登入界面包含對密碼的有效性檢驗
  • 為了便于原型設計的檢視,此處僅做部分合法性的檢測,實際編碼将實作完整的合法性檢測
    結對作業一(原型設計)

  • 點選上方注冊按鈕進入注冊界面
  • 注冊時用手機作為使用者名登入,需要擷取4位短信驗證碼,包含驗證碼位數檢驗
  • 密碼設定需要兩次填寫密碼,防止出錯
  • 包含密碼位數檢驗和密碼一緻性檢驗
  • 結對作業一(原型設計)

首頁部分包含輪播圖和最新資訊兩個部分
結對作業一(原型設計)

  • 每隔3秒會切換圖檔,切換時間為1秒
  • 圖檔内容為計算機視覺三大頂會的圖檔,點選圖檔将會跳轉到相應會議的官網
  • 圖檔的切換也可以點選圖檔下方的小圓點進行切換
    結對作業一(原型設計)

最新資訊主要顯示的是計算機視覺三大頂會的一些最新的資訊資訊。主要資訊的來源是三大頂會的官網。
結對作業一(原型設計)

論文清單每頁展示5篇論文,論文内容包括圖檔、标題、編号、摘要、關鍵詞和原文連結,可切換頁面(設計時隻展示2頁)。

對于每一個論文的操作是翻譯、收藏和删除功能。

結對作業一(原型設計)

這一部分可以對論文清單進行更加細緻的篩選,比如選擇年份、會議、作者等。

還可以對論文清單進行排序,依據有相關度、下載下傳量、引用量等。

結對作業一(原型設計)

論文的添加主要分為單個論文的添加和批量添加論文。

論文的單個添加需要在輸入框中輸入論文的标題。

批量添加論文要求使用者選擇一個txt檔案,點選确認後将會自動爬取并添加txt檔案中的所有論文标題。

批量添加論文選擇的txt檔案要求格式為:每一行都是一個論文的标題。

結對作業一(原型設計)

為了界面更加美觀,功能更加豐富,我們增加了批量操作的功能,同時将該功能放置在頁面的右邊。

點選按鈕将彈出論文清單的資訊,使用者可以進行多選,然後進行批量删除和批量下載下傳的功能。

結對作業一(原型設計)

為了幫助使用者對論文更好、更高效地進行了解,我們增加了論文翻譯的功能。

可以在論文清單點選翻譯的按鈕進入

需要從網上緩存論文,加載較慢,請耐心等待

結對作業一(原型設計)

使用圖表的形式直覺地顯示論文清單中論文的資料統計資訊

四個圖表的内容為:三大頂會熱詞走勢圖、2020年三大頂會論文投稿及錄取量、Top10熱門研究方向、Top10熱詞雲圖

其中三大頂會熱詞走勢圖包含近5年的熱詞走勢,可通過左側按鈕切換三大頂會的熱詞走勢圖,下方按鈕開啟關閉熱詞展示

其中Top10熱詞雲圖的左邊是top10的熱詞,設計中是想要點選熱詞跳轉到對應的論文清單

結對作業一(原型設計)

總論文統計包含兩大部分:熱門領域精選、部分國家及高校論文統計。

熱門領域精選包含精選的六大計算機領域,為使用者提供興趣導向,其中顯示了論文發表的數量。

下面顯示的是含有部分國家的論文錄取量統計以及對部分高校引用論文量的統計。

結對作業一(原型設計)

收藏夾為每個使用者提供了論文清單的個性化管理,使用者可以根據自己的喜好在論文清單收藏論文,檢視的時候點選導航欄中的收藏夾進行檢視。
結對作業一(原型設計)

  • 困難一:原型工具的選取以及使用方法

說明:我們兩個人之前都沒有接觸過原型設計這一方面,是以對我們來說,一切都是從零開始,這就少不得走一些彎路。

解決:對于新知識的學習我們也都不是第一次了,熟練地打開百度、知乎等各種平台,查閱各種資料,在bilibili上觀看教程。最後在實踐中一步一步變得熟練。

  • 困難二:如何使用axure繪制動态的圖表

說明:axure中并沒有提供友善的圖表元件,我們在網絡上找了很多的方法,要不然使用靜态的圖檔,要不然使用中繼器。

解決:最後我們找到了一個免費的圖表元件,然後順利地解決了問題。

  • 困難三:如何使用axure進行團隊開發

說明:axure9提供了團隊開發的功能,主要操作有點類似使用GitHub的團隊開發。我們本來想使用這個,結果使用過程中通路外國的網站速度很慢,不友善。

解決:最後經過讨論,我們決定不使用這個功能。我們首先先對功能進行劃分,然後制作一個基本的模闆項目,然後我們兩個人都在這個一樣的模闆上進行開發,最後合并的時候隻需要複制粘貼就完成了。

  • 困難四:如何制作一個美觀的原型

說明:我們深知美觀對于一個項目的重要性,是以我們也很關注這一部分,但是這個确是很難的,我們嘗試了非常多的方案,否定了很多的方案。

解決:不斷地浏覽網絡上各種各樣的網站,不斷地進行嘗試。要做到美觀的一個關鍵點是注重項目中的每一處細節。

  • 困難五:我們究竟想要做一個什麼樣的産品

說明:産品的定位至關重要,如果它不能被市場接受,那麼哪怕功能再強大,再美觀,都是無用的。是以我們必須思考好,使用者想要什麼?使用者的痛點是什麼?我們的産品可以幫助使用者解決什麼問題?我們的産品的每一項功能是不是為了解決使用者的痛點而誕生的?我們的産品是否符合實際?是否真的可以解決使用者的問題?

解決:要想回答這些問題,我們首先浏覽了市面上和我們相似的産品(例如中國知網)。然後細緻地思考我們的優勢和劣勢,有哪些使用者的痛點是他們無法實作而我們可以實作的。在能夠清晰地回答這些問題以後,我們再開始進行原型設計。

  由于還未返校,我們之間的交流主要是通過線上交流的。主要是通過QQ等工具,采取語音、螢幕共享等方式。

  每次的讨論主要分為兩個部分。一個是互相彙報今天一天的工作成果并進行示範,互相探讨不足之處并修改。一個是對第二天的工作進行分工安排。

  讨論并不是每天隻有一次,其中我們也會就中途遇到的一些問題進行讨論。

部分讨論截圖

  1. 在原型總體架構出來後進行讨論,研究布局設計及可擴充部分
    結對作業一(原型設計)
  2. 在部分界面完成後,探讨布局設計合理性及功能編排等
    結對作業一(原型設計)

  • 221801334xy

  結對的工作過程中效果比我想象還要好,度過《建構之法》中提到的學習階段之後,确實讓我體驗到了遠超單人工作的效率。在這次的結對工作中,我也逐漸找到了結對合作的一些關鍵之處,包括如何與隊友溝通、如何進行一個有品質的讨論等等。

  經過這次的結對,我也加深了對結對合作的了解,明白了一些結對合作的優點。結對合作可以很好地監督我們完成每天安排的工作量,相較于單人工作,結對中我們都必須對隊友負責,這就像是一種限制,讓我們不能偷懶,推動我們去工作;結對合作可以幫助我們打開思路,這在我們這次的作業中尤為明顯,有很多我一直想不好的問題,一和隊友讨論就找到了解決的方法。

  第一次的結對合作給了我很大的驚喜,也讓我更加地期待軟體工程後面的作業。

  • 221801230wh

  在這次結對任務中,帶來的是一種全新的感覺,也讓我學到了很多東西。

  首先就是結隊作業讓我們能夠用更多方位的視角找到不足。在這次任務中,我們的每次讨論都能夠有很大進展。合作時互相尊重對方的意見,讓交流更愉快,對于項目的推動也更加順利。

  還有一點獨特的感受是結隊合作帶來的隐形的限制力。我們每次布置完任務後,定完計劃時間,這樣就在無形中限制我們的行為,推動我們工作。因為結隊合作不隻是關于我們自己,也與另一個隊友相關。這對于自律能力不夠好的我來說是一種莫大的幫助,也提高了我的工作效率。

  • To xy
  在這次合作中讓我對xy有了更深的了解,也讓我們之間的友誼更深厚。xy自律能力很好,動手能力很強,工作效率很高,對于任務完成度很高,且擅于溝通和交流。合作過程很愉快,搭配默契,對于任務的推動也很順利。期待後面能有更多的合作機會。
  • To wh
  這是我和wh的第一次合作,在這之前我對wh并不是很熟悉,通過這次的合作,我的另一個大收獲就是對我的隊友有了更深的了解,收獲了一份巨大的友誼。wh在合作的過程中非常認真,每次找他視訊都能很快回複我,每一次修改的建議都能認真地完成,有一個搭配默契的隊友真好。這次的合作相當愉快,期待後面我們有更多的合作機會。