中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

學(xué)習(xí)Axure的時(shí)候覺得中繼器與函數(shù)很枯燥？本文教你一個(gè)趕走枯燥的方法——設(shè)計(jì)游戲！讓你感覺學(xué)習(xí)Axure原來可以這么有趣！

Axure是產(chǎn)品經(jīng)理工作中最重要的軟件之一，除此之外對PS、Visio也應(yīng)該有所了解。不過就產(chǎn)品經(jīng)理而言，Axure是最有代表性的軟件。大多數(shù)人都可以做到使用Axure畫一些簡單的原型圖，但是到了交互方面則捉襟見肘，中繼器和函數(shù)是不少產(chǎn)品經(jīng)理面前的兩座大山。

有趣的內(nèi)容能夠減少人在學(xué)習(xí)中的抵觸心理，Axure的函數(shù)無疑是十分枯燥的，且一般用不到的特點(diǎn)容易讓人沒有動(dòng)力進(jìn)行學(xué)習(xí)。這種情況下，自己制作一些有意思的東西對于技能的鍛煉以及娛樂身心都有很大的益處。

一、制作結(jié)果

主要交互：

• 小魚會(huì)來回循環(huán)的游泳且會(huì)轉(zhuǎn)身；
• 小魚的速度實(shí)際上是隨機(jī)的，即不是勻速運(yùn)動(dòng)；
• 可以設(shè)置難度完成小魚速度的切換；
• 點(diǎn)擊魚鉤可以進(jìn)行捕魚，捕捉成功后得分且小魚將會(huì)回到原來的位置。

體驗(yàn)地址：點(diǎn)擊此處

二、制作方法

1.用Axure畫背景元件

這一步很簡單，圖片就是由幾個(gè)矩形，一個(gè)橢圓，一個(gè)小魚組成的。其中值得注意的是小魚的圖片需要png不帶背景的圖片，否則會(huì)有一個(gè)背景框的存在。

png的制作方式很簡單，可以在網(wǎng)絡(luò)上下載一個(gè)背景比較純凈的小魚圖片，然后使用PS進(jìn)行摳圖，最后去掉背景頁然后保存為png格式即可。

因?yàn)樾◆~是需要轉(zhuǎn)身的，所以可以將方向相反的小魚分別儲(chǔ)存為動(dòng)態(tài)面板的兩種狀態(tài)。當(dāng)然，圖片的水平翻轉(zhuǎn)需要PS的幫助。這樣，只要改變動(dòng)態(tài)面板的狀態(tài)就可以實(shí)現(xiàn)小魚的轉(zhuǎn)身。

2.魚鉤動(dòng)作

魚鉤動(dòng)作的設(shè)置如上圖所示，魚鉤是由魚鉤以及魚線兩部分組成的，魚鉤的動(dòng)畫為移動(dòng)，而魚線的動(dòng)畫則為尺寸的改變。因?yàn)檫€需要收回，所以移動(dòng)后再設(shè)置反向的移動(dòng)即可。這一步的觸發(fā)方式設(shè)置為鼠標(biāo)點(diǎn)擊魚鉤。

3.釣魚動(dòng)作

通過上述兩步可以實(shí)現(xiàn)釣魚的動(dòng)作。這里主要的知識(shí)點(diǎn)是接觸操作，可以在條件中進(jìn)行設(shè)置，被掉的魚運(yùn)動(dòng)是垂直的，故而其移動(dòng)的坐標(biāo)中x值為0。

此處設(shè)置的難點(diǎn)是：注意移動(dòng)設(shè)置中的相對位置和絕對位置，如果不慎弄反可能導(dǎo)致交互出錯(cuò)。

到這里看起來已經(jīng)實(shí)現(xiàn)很多功能了，但實(shí)際上還差很多，比如現(xiàn)在的魚是不動(dòng)的，且將魚掉走之后就沒有可以掉的魚了，游戲無法繼續(xù)進(jìn)行。

4.全局變量的定義

接著為了實(shí)現(xiàn)魚的往復(fù)運(yùn)動(dòng)，得分的計(jì)算，以及難度調(diào)節(jié)功能，需要設(shè)置三個(gè)全局變量。

• dx：應(yīng)用于方向的改變；
• score：用于記錄游戲得分；
• level：用于游戲等級的調(diào)節(jié)。

此處可以先將其默認(rèn)值設(shè)定一下，dx為1即不反向，score為0即初試分?jǐn)?shù)是0，level為1即初始難度為1。

5.魚的移動(dòng)

魚的移動(dòng)是水平不勻速移動(dòng)，不勻速為了增加釣魚預(yù)判的難度。其設(shè)置方式如上圖所示，其中用了隨機(jī)函數(shù)math.random。dx是為了改變其方向，默認(rèn)值為1，level則是為了改變其難度，默認(rèn)值同樣也是1。

6.魚的轉(zhuǎn)身

魚不可能朝向一個(gè)方向一直運(yùn)動(dòng)下去，這樣無法完成游戲，所以可以設(shè)置其邊界條件，讓其超出邊界的時(shí)候dx的數(shù)值變?yōu)?1實(shí)現(xiàn)反向移動(dòng)。此外還需要在邊界的時(shí)候修改魚的狀態(tài)，否則就會(huì)出現(xiàn)魚是倒著游泳的樣子。

反向由dx數(shù)值的改變來完成，而魚的狀態(tài)則是由state的改變來完成。

7.魚的復(fù)位以及得分判定

這是比較有難度的地方，為了能夠讓游戲成為無限模式，魚被釣走之后必須回到原來的地方且分?jǐn)?shù)增加。被掉走的魚不能夠在魚鉤上繼續(xù)移動(dòng)。

因此設(shè)置如上圖所示，其中dx為0限制了繼續(xù)移動(dòng)，移動(dòng)魚to（440，398）讓魚可以復(fù)位，設(shè)置dx為1、yu為state1讓魚可以繼續(xù)游動(dòng)，score相關(guān)則是統(tǒng)計(jì)用戶的游戲得分。

三、可以改進(jìn)的地方

本游戲的制作還是很粗糙的，所有可以改進(jìn)的地方很多，有興趣的讀者可以嘗試自己做一做。這里作者提幾個(gè)很簡單就可以改進(jìn)的點(diǎn)：

• 讓畫面效果好一些，直接找更好的圖片就可以實(shí)現(xiàn)；
• 多個(gè)魚同時(shí)游動(dòng)，重復(fù)上述操作，多幾種魚的類型；
• 增加魚雷，即設(shè)置幾個(gè)移動(dòng)的魚雷，魚鉤碰到之后即宣布游戲結(jié)束或者得分清零；
• 魚的y方向增加移動(dòng)特效，這一點(diǎn)也很好實(shí)現(xiàn)，即y軸方向增加隨機(jī)數(shù)位移即可；
• 增加暫停功能，設(shè)置條件讓魚的速度變?yōu)?即可以實(shí)現(xiàn)這一點(diǎn)。

上圖是稍微美化了的結(jié)果，是不是好看很多呢，其實(shí)只要用心還是可以做出不錯(cuò)的作品的。

四、總結(jié)

本實(shí)例難度中等，相信對于axure有一定基礎(chǔ)的讀者可以直接重復(fù)出來，對于axure的認(rèn)識(shí)僅停留在畫原型上的讀者，可以先學(xué)習(xí)相關(guān)的內(nèi)容再進(jìn)行練習(xí)。

#專欄作家#

馬璐，人人都是產(chǎn)品經(jīng)理專欄作家。關(guān)注產(chǎn)品設(shè)計(jì)以及用戶體驗(yàn)，力求在技術(shù)一定的情況下將產(chǎn)品做到極致，充分發(fā)揮技術(shù)的潛能。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自 Unsplash ，基于 CC0 協(xié)議