Axure 教程:注冊驗證

3 評論 7433 瀏覽 42 收藏 3 分鐘

大家都知道,注冊的時候有很多的驗證,如何通過Axure來制作這個驗證那,今天小猿就給大家演示,通過這個練習(xí),希望大家能夠掌握邏輯條件和全局變量。

我們先看一下最終的效果:

猿型庫:Axure小練習(xí)-注冊驗證

需求分析

原型設(shè)計

(1)拖入賬號輸入框account,設(shè)置最大輸入長度為10,設(shè)置輸入提示“賬號只能包含字母和數(shù)字”;

(2)拖入圖片account_img和文本account_msg,并且設(shè)置為隱藏;

(3)拖入密碼輸入框pass,設(shè)置輸入類型為密碼,設(shè)置輸入提示”密碼為6位數(shù)字“;

(4)拖入圖片pass_img和文本pass_msg,并設(shè)置為隱藏;

(5)拖入注冊按鈕;

(6)拖入文本reg_result,并設(shè)置為隱藏;

猿型庫:Axure小練習(xí)-注冊驗證

(7)設(shè)置全局變量reg_pass_correct和reg_account_correct。

猿型庫:Axure小練習(xí)-注冊驗證

交互設(shè)計

(1)設(shè)置賬號輸入框account的“失去焦點事件”:

猿型庫:Axure小練習(xí)-注冊驗證

(2)設(shè)置密碼輸入框pass的“失去焦點事件”:

猿型庫:Axure小練習(xí)-注冊驗證

(3)設(shè)置登錄按鈕的點擊事件:

猿型庫:Axure小練習(xí)-注冊驗證

到了這步,注冊的功能就算做好了,同學(xué)們趕緊去試試吧。

 

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

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

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 賬號字段是否為字母數(shù)字是怎么判定的??

    來自陜西 回復(fù)
  2. 原型預(yù)覽:http://www.axurestudy.cn/pr/#id=6oms29&p=%E7%9B%AE%E5%BD%95

    來自廣東 回復(fù)
    1. 原型還可以在發(fā)一遍嗎

      來自廣東 回復(fù)