| 這個作業屬於哪個課程 | 課程 |
|---|---|
| 這個作業要求在哪里 | 作業要求 |
| 這個作業的目標 | 結對完成原型設計 |
| 吳世龍學號 | 221801317 |
| 陳子傲學號 | 221801320 |
PSP
| PSP2.1 | Personal Software Process Stages | 預估耗時（分鍾） | 實際耗時（分鍾） |
|---|---|---|---|
| Planning | 計划 | ||
| Estimate | 估計這個任務需要多少時 | ||
| Analysis | 需求分析 | 3h | 1h58min |
| Design Review | 設計復審 | 2h | 1h |
| Design | 具體設計 | 10h | 11h21min |
| Reporting | 報告 | 2h | 3h |
| Postmortem & Process Improvement Plan | 事后總結, 並提出過程改進計划 | 1h | 20min |
| 合計 | 17h | 17h37min |
原型地址
效能分析
本次實驗我們花費了大量時間用於需求的理解和原型界面的設計上，在初次進行討論之后，我們兩個之間的理解產生了一些分叉，導致第一次原型制作偏離了兩個人的預期，最終只能重新討論需求設計，花費了不少時間；其次，由於我們是第一次使用Axure這個軟件，我們對於使用其中的功能還不夠熟練，只能夠一點點摸索，期間又重構了兩次原型布局以及美化處理，導致原型具體實現的時間偏長。
原型介紹
基本介紹
我們的原型構想主要體現在易用性和功能性上。盡可能的減少交互上的冗余操作，並且與整體美觀性做出協調。
頂欄設計
左側的CVTrend是一個快速回到主頁的按鈕
中間的搜索欄提供快速搜索
右邊是一個下拉菜單，可以快速定位到需要的頁面
首頁
首頁由兩個模塊組成、圖表模塊以及文章推薦。
其中圖表模塊在用戶還沒建立自己的論文列表時會默認先展示網絡上的數據，錄入文章之后則默認顯示的是用戶的論文分析圖。
圖表支持兩種狀態，一種是如上文所示的折線圖和餅圖組合展示。
支持鼠標選中某個階段，餅圖會自動轉換成該階段的比例。支持鼠標選中高光展示某個詞條的趨勢
另外一種圖表是展示三個頂會中某個熱詞出現了多少次。
文章推薦中有兩種排列形式：按照文章熱度排序、按照修改筆記的時間排序
同時支持轉換成極簡模式
文章錄入
支持按照標題錄入，關鍵詞錄入 以及以文件的形式批量導入
點擊錄入之后會先展示搜索到的文章，用戶可以選擇自己想要的文章錄入
同樣支持縮略視圖展示,展示標題以及部分的概述
文章搜索
除了在頂部有一個快速搜索欄之外，也有單獨一個文章搜索頁面。一般搜索是模糊搜索，精確匹配則是搜索出關鍵詞完全匹配的論文。
支持對關鍵詞、文章標題、文章ID、以及作者進行搜索
左下側是一個熱詞的欄目，展示最近最熱的搜索詞
右下側是歷史搜索記錄
搜索出來的結果會用紅字把相應的搜索詞標注出來，支持搜索結果多種排序方式：時間、熱度、關鍵詞出現次數、文章標題字母序、文章ID字母序。
搜索出來的項目除了論文標題、部分概述，還有論文下載以及熱詞提取。
右邊有個展示熱門搜索的欄目。
縮略視圖展示則以論文標題、下載、個人筆記為主
如果搜索結果沒有的話會在論文庫中搜索，並且加上錄入的功能。
文章詳情
展示文章的全部概述。左側有文章的推薦。下面則是可以添加、修改筆記。
管理
我們管理的模式是：展示出所有的論文。通過關鍵詞、論文標題、論文ID、作者 進行過濾。對過濾之后的列表進行操作。
可以進行刪除以及修改筆記的操作。
個人中心
目前來說我們還沒有找到很多個人中心需要有的功能。所以我們暫時只做了基本信息展示以及修改密碼的功能。
困難
動態圖表的實現
我們使用的Axure有雖然有一些動畫效果，但是僅僅是模塊的出現和消失等的轉跳，一般的柱狀圖和折線圖或許可以做出效果，但是如果要實現動態的扇形圖，或者要和鼠標實現一些互動，那就會需要很巨大的工作量。
經過查閱資料之后，我們發現了兩個方法，一個是復用其他人分享的Axure組件，另一個則是用一些web端的圖標框架嵌入到Axure中。
最后查找到了將echart框架的圖插入到Axure的方式，並且將該方法整理成了博客。
需求拓展
這次的任務基本要求其實是很簡單的，簡單概述就是：輸入``增刪改查``展示。但是經過討論之后我們認為不能簡單地將這三個需求做成相應的三個頁面，這樣對於用戶體驗和網站的觀感都是很糟糕的。
所以我們從這三個基礎需求出發來進行了頁面的規划以及需求的拓展。關於頁面規划已經在上文中有所展示了。下面說說需求的拓展。
查詢的頁面，參考了bilibili、百度等網站，加入了歷史查詢和熱詞快速查詢。
論文管理的頁面。我們用增刪改查這四個基本的管理需求對這個頁面進行了討論。
為了快速響應客戶的提交，我們將輸入文章和圖表放在了同個頁面，並在這個頁面中展示出熱門的文章。
同時，我們發現需求中其實是沒有修改這個項目的。我們以此為出發點，增加了添加論文筆記的功能。並且在搜索論文時也體現出這個過濾項。
對於查詢，我們參考了百度的查詢，會在查詢的結果中的關鍵字用亮色標出。
交流中產生的誤解與消除
在進行了最初的需求分析討論之后，我們就各自去執行自己的任務。但是在第一版的簡單原型做好之后，發現雙方對於需求的理解不是統一的。於是就馬上安排再一次的討論，進行原型的迭代。總共從需求到原型的細節迭代了很多次才最終完成。
NABCD模型
Need
我們的產品主要是幫助學生、研發人員以及對想了解計算機視覺的人提取出其所感興趣的論文中的熱門趨勢，使用動態的圖表來直觀展示趨勢的走向。同時也會展示所有論文里的熱詞趨勢。
用戶可以在論文詳情頁做筆記。同時搜索的時候支持多種排序：日期、熱度、筆記、字母序等，讓用戶可以快速定位需要的文字。
支持縮略圖展示，更加方便地管理自己的論文列表，瀏覽搜索結果。
Approach、
我們采取了計算機視覺的三大頂會CVPR、ICCV、ECCV作為我們的論文源，確保可以找到科研最前端的論文。
通過對於論文題目、概述、關鍵字的分析提取出領域中的專有名詞，利用專有名詞的出現頻率來作為其研究熱度的指標.
站內論文搜索使用elastic search全文檢索技術來實現關鍵字搜索，同時可以將關鍵字加重展示。
圖表采用echart框架，快速實現動態的圖表效果，使展示更加生動。
為每位用戶維護一個專屬的論文列表，提供模糊搜索，批量搜索，讓用戶看到自己感興趣分支的研究趨勢。
Benefit
用戶可以快速且有針對性的獲取需要的熱詞分析，同時可以便利地管理自己的論文列表，自由地添加自己的筆記。
Competitors
我們的競品主要有兩類：傳統的論文網站和熱點趨勢網站。
傳統的論文網站相對來說有更多門類的論文信息，但是一方面不同的論文網站資源分散，並沒有針對計算機視覺的文章進行專門的收集。另一方面，這類網站不能分析出某個領域的熱點趨勢，更不用說針對用戶所感興趣的方向來進行熱點趨勢分析。同時這類網站也不能讓用戶添加自己的閱讀筆記。
對於熱點趨勢網站，目前來說我所了解的熱點趨勢很多都是搜索引擎公司做的，比如百度、谷歌等。他們是通過用戶的搜索量來提供數據，但是搜索量這對於專業領域中的熱點判斷是缺乏可信度的。
Delivery
方案1: 和論文網站進行合作，一方面可以利用論文網站的資源拓寬產品的業務，另一方面則是利用論文網站的流量對產品進行推廣，可以采取用戶存取量/接口調用次數等所作為收費方式。
方案2: 在高校中進行推廣，通過學院的公眾號等方式讓學生知道這個軟件。
結對過程
完成作業過程
我們最初集中討論了一次需求，然后用了兩天時間做出了一個大概的模型，發現雙方對需求的理解有一定的偏差。然后用一天實現快速迭代了一個版本，定下了整體的框架。接下來設計各個組件的樣式，調整原型的外觀。
討論與原型使用
隊友評價
吳世龍->陳子傲
最開始的原型設計是交給子傲來做的，在后面發現需求理解出現矛盾的時候他也很有耐心的去修改原型。整個過程下來重構了很多次原型，是個很有責任心的隊友。
對頁面的展示模式設計方向也有一些見解，因為一開始我會更偏向於做動態些的搜索結果展示，但是他提出這樣在直觀性與效率的角度來看是不合適的，所以采納現在這種模式的展示。
陳子傲->吳世龍
世龍真的是一個非常具有主觀能動性隊友，對於新知識的學習和運用能力讓我嘆為觀止。包括使用echarts圖表和整理相關博客都是他主動完成的。
同時在設計過程中，世龍也具有自己的獨特的審美和見解，在完成了基本的頁面制作之后，世龍還對我們的原型進行了一系列美化處理，讓整體頁面看上去舒服的多，期待下一次和世龍的繼續合作。
結對任務感受
結對作業相比於單人作業來，比起個人能力，會更加考驗雙方的交流的效率。結對任務的體驗建立在雙方對於作業的重視程度，否則就很容易變成單人作業，這次的結對任務體驗是比較好的。
結對任務對我來說最大好處就是思路上會有更多的選擇出現，進而可以考慮每種選擇的優劣。也可以以問答的形式進行討論，這對於激發雙方的思路都是有一定幫助的。
從整體來說兩個人的交流成本還算可以，相比起其帶來的好處算是超值:D
總結
- 需求分析結束后，應該進行一次整體的邏輯回盤，盡量使雙方沒有大方向上的理解偏差
- 產品迭代初期可以做的不那么仔細，直到確定了整體框架后再進行細節上的調整
- 進行設計時除了美觀上的設計，應該對應於應用的類型於交互的效率做出平衡。