第一次結對編程作業

#一、結對成員 031702147鄧澤源 031702419姚彬錕

二、使用工具

Axure RP 8、Photoshop

三、原型分析

• N---Need
  本次作業要求開發一個AI對戰的十三水客戶端需要完成以下內容：
  • 登錄
  • 開啟一局游戲
  • 出牌
  • 查詢排行榜
  • 查詢往期對戰結果
• 自行添加的內容：
  • 規則
  • 商城
  • 設置
  • 分享
• A---Approach
  本次作業主要是對UI界面進行設計，要滿足以上的要求，而下一次要加入AI,實現自動將13張牌分成三墩，得出盡量能獲勝的牌。於是第一階段我們通過學習Axure RP，並找一些模板，對界面進行設計。第二階段我們將進行客戶端的開發，寫出自動分牌的算法，並在界面展示。
• B---Benefits
  可以一鍵完成十三張牌的分墩，提高游戲進行的進度。
• C---Compettors
  • 優勢
    界面設計比較美觀一些，用戶體驗感更強。
    可以自動分墩。
  • 劣勢
    暫時沒有玩家手動分墩的功能，只有分墩算法自動給出智能分類。
• D---Delivery
  通過朋友圈或者空間等簡單的平台發布，或是可能的話可以讓一些公眾號幫忙發布
• 原型貼圖分析
  PS:素材都是網上自行查找的，如有雷同純屬巧合。
  (1)界面登陸
  
  自己尋找素材，設置了一個背景圖（調顏色，用Axure RP拉蒙板、真是把過去兩年的PPT技術運用淋漓盡致）
  最主要的部分是用戶登陸（熱鍵與后一步界面聯動），輸入賬號和密碼，並提供了注冊按鈕，
  同時為了美觀和對其的可持續開發還加上了其他方式的登陸、忘記密碼等操作。

(2)用戶界面

主要是提供了快速開始游戲、排行、戰績的功能，其他東西是為了設計美觀，貼合實際開發設計

(3)歷史記錄（戰績）


這一部分我們設計了兩張原型圖：
第一張是幾張戰績的簡要概括，
同時在每一場下面設計一個查看詳情，點擊可以切換看到詳細的對戰信息，也就是可以看到當局的牌型。
還可以點擊左上角返回。

(4)排行榜。

這是對玩家“歡樂豆”的排行，顯示前幾名的信息可以下划查看，每一名的信息都當作一個組合，在這個組合里有排名、頭像、昵稱、ID、歡樂豆數的信息，為了貼近實際的應用，我們還加了加為好友和查看信息的按鈕，反正畫是畫出來了，能不能實現就再說吧。而且對排名前三的選手還有特殊獎牌加成，聊表心意。

(5)對局界面。

這個是用戶在進行游戲時的界面，我們找到了一張棋牌桌當作背景，然后把玩家頭像也加進去了，模仿的是斗地主的界面。

四、結對的過程、結對照片。

由於是團隊內部兩人組隊，於是在團隊開會的時候一拍即合，於是成功結對（牽手成功）。
討論照片如下

五、PSP表格

PSP2.1	Personal Software Process Stages	預估耗時(min)	實際耗時(min)
Planning	計划	40	40
Estimate	估計這個任務需要多少時間	40	40
Development	開發	310	310
Analysis	需求分析 (包括學習新技術)	80	70
Design Spec	生成設計文檔	20	20
Design Review	設計復審	10	10
Coding Standard	代碼規范 (為開發制定合適的規范)	0	0
Design	具體設計	200	210
Coding	具體編碼	0	0
Code Review	代碼復審	0	0
Test	測試 (自我測試,修改,提交修改)	0	0
Reporting	報告	20	20
Test Report	測試報告	0	0
Size Measurement	計算工作量	0	0
Postmortem & Process Improvement Plan	事后總結 並提出過程改進計划	20	20
	合計	370	370

六、遇到的困難

(1)困難描述

• Axure RP的使用，有關UI素材的查找
  （最難得就是素材了QUQ 哭了，一點一點從網上搜羅矢量圖）
  

(2)解決嘗試

• 最好的解決辦法當然是搜索引擎了，在網上找了一些教程看了一下，然后也在B站很迅速看了點視頻。
• UI素材也是利用了百度，還有網上找到一些同樣制作棋牌類游戲的一些素材，拿過來使用。但是有些東西實在找不到，或者要錢，只能利用PS摳圖出來了…

(3)是否得到解決

• 是（搜索引擎果然還是很強大的）

(4)有何收獲

• 搭檔的分工很重要！
• 好好利用搜索引擎、能利用好搜索引擎也很重要，要善於在網上尋找更多有用的資源。

• Axure RP真的很好用。PS也真的很好用。也是通過了對這個UI界面的設計，對Axure RP的了解，對軟件開發前的UI設計了解的更多了一些，對做項目之前的一些准備工作也有了一定的了解。

七、設計說明

本次作業要求做一個AI對戰的十三水客戶端，第一次結對編程的任務主要是進行頁面設計，要求的界面也比較少，所以做出界面還是比較輕松一點的，但是做到盡可能美觀就有點難度了。本次界面的設計主要是學習了網上無窮無盡的棋牌游戲的各種界面，模仿借鑒、甚至摳圖。接下去的任務就是要實現把十三張牌分三墩的算法，能夠把十三張牌自動分成盡可能能夠獲勝的三墩牌。根據要求我們主要設計了以下幾個界面：

• 登陸界面
• 游戲主界面（包括開始游戲、戰績、排行幾個功能）
• 顯示當前對戰界面
• 顯示往期對戰結果（主界面進入）
• 顯示排行榜（主界面進入）
  在本次設計之中，我們也加入了頁面的交互，添加了返回、前進、點擊按鈕與熱鍵，從主頁可以切換到任意要求的界面（暫時只支持有設計出的界面交互）。

八、個人心得

• 姚彬錕

  • 本次的UI設計讓我學習了Axure RP8這個軟件的基本實現，懂得了一些簡單的界面設計方法，了解了開發軟件的一些基本程序，學到的還是挺多的。 還有知道了審美的重要性，沒有審美的我表示只能靠D老板帶我了。

• 鄧澤源

  • 零基礎學習 Axure RP8，速成設計，太難頂了。但是最后還是做了出來，也算是有比較大的收獲，為了那些圖片素材，我也順利再鍛煉了一下我的摳圖技術，總之也是很有收獲的。

九、學習進度表

第N周	新增代碼（行）	累計代（行）	本周學習耗時(小時)	累計學習耗時（小時）	重要成長
1	100	100	5	5	學習了Axure RP的基本使用
1	300	100	10	10	學習了JAVA的常用語法與mySQL數據庫的基本操作

十、參考博客與資料（稍后更新）

Axure RP 8教程：基礎元件的使用 ： http://www.woshipm.com/rp/758870.html
藝術字體矢量在線生成器 ： http://www.akuziti.com/
阿里巴巴矢量圖標庫 ：https://www.iconfont.cn/home/index?spm=a313x.7781069.1998910419.2
Axure QQ登錄界面交互效果制作 ： https://jingyan.baidu.com/article/adc81513b01639f722bf7373.html