眾所周知，Axure（http://www.axurechina.cc/）作為一款高保真原型設(shè)計(jì)軟件是非常優(yōu)秀的，功能強(qiáng)大，學(xué)起來又毫不費(fèi)力，不管對于小白或者有一定經(jīng)驗(yàn)的產(chǎn)品經(jīng)理都是最佳的選擇。

關(guān)于用Axure制作登錄窗口其實(shí)是很簡單的操作，為了有利于大家更好的掌握這款軟件，小編特地編輯了這篇文章。

首先我們下載Axure（http://www.axurechina.cc/download.html）軟件，創(chuàng)建一個(gè)頁面，命名為“登錄窗口”，拖入一個(gè)“矩形”元件，鼠標(biāo)右擊，轉(zhuǎn)為動(dòng)態(tài)面板，命名為“登錄”。

從元件庫中拖入一條“水平線”，作為劃分，然后拖入一個(gè)“三級標(biāo)題”，文本改為“登錄窗口”接著拖入一個(gè)“占位符”命名為“btn_close”，作為窗口的關(guān)閉按鈕。

根據(jù)登錄頁面的模型，拖入兩個(gè)“文本框”，兩個(gè)文本框分別命名為“用戶名”和“密碼”。一個(gè)“復(fù)選框”文字改為“記住你的登錄狀態(tài)”，一個(gè)“按鈕”，輸入文字“登錄”。

在這里設(shè)置文本時(shí)，第一個(gè)文本框作為“用戶名”，第二個(gè)作為輸入“密碼”。然后在屬性里面，找到提示文字，輸入“用戶名”，第二個(gè)輸入“密碼”。在提示文字前面按兩個(gè)空格，提示樣式可以自行設(shè)置，比如我設(shè)置為“獲取焦點(diǎn)”時(shí)文字消失：

在這里為了體現(xiàn)更好的交互也可以，在輸入用戶名或密碼時(shí)，提醒輸入錯(cuò)誤。拖入一個(gè)“標(biāo)簽框”作為提示：

一個(gè)總體的登錄界面就算設(shè)計(jì)出來了，接下來我們需要對登錄窗口的用例邏輯進(jìn)行設(shè)置。當(dāng)用戶名輸入為空、密碼輸入為空、用戶名輸入錯(cuò)誤、密碼輸入錯(cuò)誤、用戶名和密碼正確時(shí)都應(yīng)該有相應(yīng)的邏輯用例比如我們對登錄進(jìn)行設(shè)置。

這里我們以用戶名為空，然后提示“請輸入你的用戶名”為例，點(diǎn)擊“登錄”交互為“鼠標(biāo)單擊時(shí)”：

添加條件，將“用戶名”文本框，在條件生成時(shí)設(shè)置當(dāng)前為空，如下圖所示:

然后將最開始添加的“標(biāo)簽框”設(shè)置文本為“請輸入你的用戶名”。

設(shè)置完之后我們可以點(diǎn)擊預(yù)覽，我在沒有輸入任何文字的情況下，直接點(diǎn)擊登錄，便會(huì)提示我“請輸入你的用戶名”，如下圖所示：

比如我們添加第二個(gè)交互，則“密碼為空時(shí)”，在“密碼”文本框作同樣設(shè)置：

預(yù)覽時(shí)，輸入“用戶名”，“密碼”那一行為空，然后點(diǎn)擊登錄，就會(huì)彈出“請輸入你的密碼”。

其他的用例交互也同樣方法設(shè)置，小編在這里就不一一講解了，如果有任何疑問可以關(guān)注我們Axure官網(wǎng)，咨詢客服哦。