酷知百科網

位置:首頁 > 母嬰教育 > 學習交流

如何利用Axure RP8搭建簡易登入頁面原型圖?

利用Axure RP8來搭建原型圖,就不得不提到元件庫的使用,元件庫對於Axure來說其實在某種程度上相當於工具欄對於平面設計,如果想要在頁面上搭建一個簡易原型,元件庫中元件的使用時必不可少的,就像是搭建一個積木原型就必須要有積木的原理是一樣的,好了,且看如何使用元件庫當中的元件來搭建一個簡易的原型圖吧。

如何利用Axure RP8搭建簡易登入頁面原型圖?

操作方法

(01)一、頁面。在整個Axure中的左上角偏下的位置,即爲頁面的位置,一般系統默認是三個,當然也可以複製很多個頁面,雙擊第一個頁面,我們再當前頁面進行簡易原型的搭建。

如何利用Axure RP8搭建簡易登入頁面原型圖? 第2張

(02)二、在元件庫當中選擇矩形2的這一元件,拖動到畫布當中,根據自己的要求的尺寸,畫出相應的大小,這裏選擇使用1920*1080尺寸的,也是蘋果手機plus版本的分辨率尺寸,可以在如圖所示的位置進行相應的調整。

如何利用Axure RP8搭建簡易登入頁面原型圖? 第3張

(03)三、選擇佔位符。佔位符一般代表的是原型當中的圖片的位置,這裏使用佔位符代表登入頁面當中經常出現的logo之類的資訊,當然如果想要使得更美觀一些的話,也可以選擇使用圖片。

如何利用Axure RP8搭建簡易登入頁面原型圖? 第4張

(04)四、選擇矩形1和文字方塊兩個元件,來進行登入位置的創建顯示效果,具體如下圖所示,雙擊元件可以對矩形元件進行編輯,這裏我們選擇對矩形設定成登入的字樣。

如何利用Axure RP8搭建簡易登入頁面原型圖? 第5張

(05)五、單擊元件,同時按住Ctrl鍵,可以複製出一個元件出來,具體如下圖所示,使用這種方法,可以比較方便的創建出來密碼的顯示效果,具體如下圖所示。

如何利用Axure RP8搭建簡易登入頁面原型圖? 第6張

(06)六、創建關鍵按鈕,也就是登入按鈕。拖動完成之後,我們將其名稱命名爲立即登入。具體如下圖所示,創建完成之後,按下F5點擊發布,我們就可以使用網頁開啟自己的原型來看一下展示的效果。

如何利用Axure RP8搭建簡易登入頁面原型圖? 第7張
如何利用Axure RP8搭建簡易登入頁面原型圖? 第8張