作者以信用卡申請(qǐng)作為案例，分享了一組Axure步驟條模板，供大家學(xué)習(xí)參考。

原型演示地址：https://www.pmdaniu.com/storage/113608/76d7dbe58f8810d7d97151ee54013da6-69620/start.html

效果演示

步驟1——選擇卡片

中部圖片輪播原件

交互：

（1）左右滑動(dòng)切換圖片。

（2）點(diǎn)擊左右圖片切換。

（3）點(diǎn)擊左右箭頭切換。

（4）點(diǎn)擊中部圖片或右下方立即申請(qǐng)按鈕可跳轉(zhuǎn)至下一步。

使用：

使用方法簡(jiǎn)單，只需要在中繼器里導(dǎo)入圖片即可直接使用，其他效果按個(gè)人需要修改。

步驟2——基本信息

中部自動(dòng)校驗(yàn)輸入框原件

（1）中文輸入框，只能輸入中文

（2）英文輸入框，只能輸入英文

（3）身份證輸入框，自動(dòng)檢測(cè)身份證輸入是否正確

（4）電子郵箱輸入框，自動(dòng)檢測(cè)電子郵箱是否輸入正確

（5）手機(jī)號(hào)碼輸入框，自動(dòng)檢測(cè)手機(jī)號(hào)是否輸入正確

（6）短信驗(yàn)證碼，模擬生成隨機(jī)驗(yàn)證碼，自動(dòng)檢測(cè)短信驗(yàn)證碼是否正確.60秒后能重發(fā)

（7）勾選框，必須勾選才能提交

（8）信用卡章程，點(diǎn)擊可查看章程、

步驟3——個(gè)人信息

（1）全國(guó)三級(jí)下拉列表地址（含全國(guó)數(shù)據(jù)）

（2）精美單選按鈕組

步驟4——工作信息

步驟5——聯(lián)系人信息

提交完成的精美彈窗：

今天的分享到這里就結(jié)束了，有問(wèn)題或者想下載原型的小伙伴們可以在下方評(píng)論處給我留言哦，我們下期見。

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

題圖來(lái)自 Unsplash，基于CC0協(xié)議