Axure 原型教程:利用Axure制作剪刀石頭布小游戲

9 評論 22316 瀏覽 75 收藏 4 分鐘

文章分享了如何利用Axure制作剪刀石頭布的小游戲,與大家分享,相信大家一定會有所收獲。

教你用Axure做個剪刀石頭布的小游戲。

先睹為快:【點我預覽】

教程開始:

第一步:整理業務需求

  1. 做個和電腦剪刀石頭布的小游戲。
  2. 規則…略。
  3. 用戶方,固定選擇;電腦方隨機。
  4. 輸贏+平局,需要直觀展示。

第二步:規劃思路和實現方法

  1. 電腦出招》隨機,需要使用隨機數。
  2. 我方出招》固定值。
  3. 對比每局我方固定值和電腦隨機值進行比較。
  4. 判定輸贏或平局

第三步:開工

1、找素材,略。

2、axure創建游戲界面。

  • 電腦每次只出一個,且隨機,所以用動態面板控制。
  • 判定勝負也是需要變化,所以使用動態面板。
  • 我方,使用固定的三張圖片組成。

3、編寫規則邏輯

  1. 定義【剪刀=1】【石頭=2】【布=3】。
  2. 電腦隨機為1-3之間。
  3. 我方固定出1-3。

通過剪刀石頭布的邏輯,推導判定條件的共用表達式。

電腦為1,則:

  1. 我方出1====平【1-1=0】
  2. 我方出2====贏【2-1=1】
  3. 我方出3====輸【3-1=2】

電腦為2,則:

  1. 我方出1====輸【1-2=-1】
  2. 我方出2====平【2-2=0】
  3. 我方出3====贏【3-2=1】

電腦出3,則:

  1. 我方出1====贏【1-3=-2】
  2. 我方出2====輸【2-3=-1】
  3. 我方出3====平【3-3=0】

查看結果分布【-2,-1,0,1,2】即:【贏,輸,平,贏,輸】

找到規律后,我們就可以開始寫邏輯了:

1、通過[[Math.ceil(Math.random()*3)]]函數,獲取1-3之間的隨機數,并賦值接給電腦。

2、將我方的值,減去電腦的值,進行判定。

3、設置動態面板的5個狀態,分別對應5個結果。

P.S.動態面板順序為1.2.3.4.5,沒有負數,所以將結果加3以便操作。

增加誘惑點:

完成8次連勝,有福利,加油加油~~,至于有沒有福利,就看能不能連贏八局了!瞄·~

內容下載地址:

作者鏈接:http://pan.baidu.com/s/1qYCUuBy 密碼: vdt7

在線預覽:http://t9ymya.axshare.com/auto.html

 

本文由 @陳張良 原創發布于人人都是產品經理?,未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 有視頻嘛 朋友

    來自重慶 回復
  2. 我也是測試轉產品,加微信嗎 樓主

    來自廣東 回復
  3. 啊 我跟著你走了一遍 后來發現判定圖片的順序錯了 ?? 我也不知道具體問題出在哪里 好痛苦

    來自北京 回復
  4. 謝謝大神分享?。?!可能我對Axure還不熟,下載了原型也沒有怎么看懂 ??

    來自廣東 回復
  5. ?? 訂閱訂閱,大神的數理邏輯能力好強悍好仰慕

    來自廣東 回復
  6. 回復
  7. 說的不是很明朗,也可能是我剛入門,不太懂,作者用的Axure RP 8 嗎?

    來自廣東 回復
  8. 666

    來自廣東 回復