axure rp 是一個(gè)專業(yè)、高效制作原型軟件,可以制作低保真原型,高保真原型,以及流程圖,給產(chǎn)品經(jīng)理帶來(lái)很多的方便,工作效果也大大提高。幻燈片效果,在很多網(wǎng)站上都可以看到圖片輪播,今天我在這給大家詳細(xì)介紹一下如何利用AXURE RP 8.0制作幻燈片輪播的原型過程。
1、打開axure 8.0 ,界面如圖
2、在首頁(yè)拖入四張小圖和一張大圖,在這我就I以矩形色塊代替圖片,這樣更節(jié)省時(shí)間,給每個(gè)色塊填充不同的顏色,用來(lái)區(qū)分,大圖的顏色跟第一個(gè)小圖的色塊一樣,如圖:
3、接下這一步很重要,我們點(diǎn)擊大圖,右鍵,轉(zhuǎn)化為動(dòng)態(tài)面板,如圖效果:
4、雙擊動(dòng)態(tài)面板,彈出對(duì)話框,我們給動(dòng)態(tài)面板起個(gè)名字(大圖展示),并在下面點(diǎn)擊添加狀態(tài)abcde,如圖:
5、接下來(lái)我們要開始設(shè)置我們小圖,點(diǎn)擊第一張小圖,名稱設(shè)為a,在交互欄目下雙擊鼠標(biāo)移入時(shí),
6、彈出的編輯器對(duì)話框,我們?cè)谧筮呥x擇設(shè)置面板狀態(tài),勾選大圖展示,狀態(tài)選a,進(jìn)入動(dòng)畫效果選為向左滑動(dòng);再選擇左邊設(shè)置不透明度,選中矩形a,設(shè)置不透明度為20,然后點(diǎn)擊確定,如圖:
7、繼續(xù)選中第一個(gè),在交互界面上選擇鼠標(biāo)移出時(shí),雙擊,在出現(xiàn)的編輯器選擇,設(shè)置不透明度,右邊選中矩形a原件,不透明度設(shè)為100,點(diǎn)擊確定,如圖:
8、按以上辦法,依次設(shè)置好第二、三、四個(gè)矩形,并且分別命名b/c/d,動(dòng)態(tài)面板狀態(tài)分別選中b/c/d,在這不一一展示,設(shè)置好的效果如圖:
9、接下來(lái)我們要設(shè)置動(dòng)態(tài)面板大圖展示的狀態(tài),a狀態(tài)展示的圖片是小矩形a的放大圖的效果,我們就把a(bǔ)狀態(tài)的顏色與矩形a的顏色設(shè)為相同,bcd的狀態(tài)顏色分別與對(duì)應(yīng)的原件bcd顏色相同,雙擊大圖展示動(dòng)態(tài)面板的abcd,并且把a(bǔ)狀態(tài)的矩形分別復(fù)制到bcd,分別給bcd狀態(tài)填充矩形bcd的顏色,與之一一對(duì)應(yīng),效果如下:
10、最后一步,也是我們最重要的關(guān)鍵一步,那就是大功告成了,我們返回首頁(yè),點(diǎn)擊預(yù)覽,彈出的頁(yè)面我們就可以看到我們辛苦制作的幻燈片原型出來(lái)了,如圖:
注意事項(xiàng):
幻燈片制作時(shí)小圖要與大圖一一對(duì)應(yīng),不能弄混了。
新聞熱點(diǎn)
疑難解答
圖片精選