- 相關(guān)推薦
實(shí)例學(xué)Axure7.0簡(jiǎn)約教程
您對(duì)實(shí)例學(xué)Axure7.0簡(jiǎn)約教程了解多少,下面我們一起來(lái)了解一下吧。
Axure7.0實(shí)例操作-模仿百度首頁(yè)
首先我們要知道Axure是產(chǎn)品經(jīng)理、原型師經(jīng)常使用的原型設(shè)計(jì)工具,能快速地把自己想要的方案展示出來(lái),給程序、美工參考。加快產(chǎn)品開(kāi)發(fā)進(jìn)度及工作效率,彌補(bǔ)了返工重做的機(jī)率。
我們打開(kāi)Axure,把我們想要的產(chǎn)品方案以圖文和清晰的邏輯關(guān)系表達(dá)出來(lái)。
因?yàn)槲覀冞@里是快速學(xué)習(xí)的一個(gè)教程,所以我們就參照百度首頁(yè)的布局打造一個(gè)Axure的原型方案。
左上角以4個(gè)文本及小圖標(biāo)表示天氣狀態(tài),右上角是用戶名、搜索設(shè)置、傳統(tǒng)首頁(yè)的3個(gè)文本標(biāo)簽。下面我們就用Axure先把這7個(gè)文本及1個(gè)圖片實(shí)現(xiàn)。
拖進(jìn)工作區(qū)7個(gè)文本標(biāo)簽及1個(gè)圖片標(biāo)簽,并按下圖的方式排列好。
再加入百度首頁(yè)的圖片bdlogo,并填加圖片陰影。
然后我們?cè)僮鏊阉骺虻南嚓P(guān)內(nèi)容,填加9文字標(biāo)簽,1個(gè)矩形輸入框,1個(gè)矩形按紐。工具箱里的工具很多,如果要熟悉,需要多次操作幾次。如下圖設(shè)置:
拉動(dòng)工具箱的滾動(dòng)條向下拉,找到button,并雙擊編輯按紐的文字。
最后把百度下面的相關(guān)內(nèi)容加入到網(wǎng)頁(yè)面底部即可。需要一個(gè)播放器,一個(gè)圖片和若干個(gè)文本。這里就不一一演示。相信你已經(jīng)學(xué)會(huì)基本的網(wǎng)頁(yè)面的造型設(shè)計(jì)及相關(guān)簡(jiǎn)單的網(wǎng)頁(yè)布局設(shè)計(jì)了。期待你的設(shè)計(jì)方案更精彩。
最后看一下整體的效果:
如下圖,按F5進(jìn)入頁(yè)面預(yù)覽,看一下我們的原型效果吧。
最后預(yù)覽的效果會(huì)在瀏覽器中打開(kāi)。Axure是最適合做網(wǎng)頁(yè)策劃、頁(yè)游策劃及各類(lèi)網(wǎng)頁(yè)產(chǎn)品經(jīng)理的原型利器。希望你能學(xué)的更快更好。謝謝!
【實(shí)例學(xué)Axure7.0簡(jiǎn)約教程】相關(guān)文章:
Photoshop文字實(shí)例:晶亮文字教程04-09
用實(shí)例介紹通道摳圖的PS教程11-16
photoshop教程04-02
地道美式短語(yǔ)及實(shí)例03-30
php查詢mysql的實(shí)例03-29
PS嘴唇處理實(shí)例11-26
photoshop美圖教程12-06