中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

之前自學(xué)過Axure軟件，但是平常工作只用到了線框圖，沒有用到很復(fù)雜的交互效果，最近利用業(yè)余時(shí)間進(jìn)行Axure軟件的自學(xué)，在練習(xí)時(shí)選用了單讀APP進(jìn)行選型臨摹，由于單讀APP是款小眾且具有文藝范的應(yīng)用，結(jié)構(gòu)也比較簡(jiǎn)單，符合我這個(gè)偽文藝青年的需求，所以便選用此作為原型。

個(gè)人覺得在學(xué)習(xí)任何軟件，光是看教程或者書本是沒有意義的，主要還是要?jiǎng)邮秩ゾ殻ㄗh大家選擇一個(gè)結(jié)構(gòu)比較簡(jiǎn)單、自己又比較喜歡的應(yīng)用進(jìn)行臨摹，在實(shí)踐中學(xué)習(xí)、在實(shí)踐中提供，這樣就會(huì)事半功倍；本人通過此次原型臨摹學(xué)到了以下幾個(gè)知識(shí)點(diǎn)是之前沒有掌握的，列在下面，希望對(duì)大家在使用該原型時(shí)有所幫助：

1. 全局變量—頁(yè)面之間的動(dòng)態(tài)面板狀態(tài)調(diào)用
2. 局部變量—計(jì)時(shí)器的算法生成
3. 條件篩選—部件文字、動(dòng)態(tài)面板狀態(tài)、值
4. 動(dòng)態(tài)面板狀態(tài)之間的切換—模擬手機(jī)頁(yè)面滑動(dòng)（左右上下、淡入淡出）
5. 動(dòng)態(tài)面板拖拽—模擬手機(jī)頁(yè)面拖拽效果、拖拽限制
6. 動(dòng)態(tài)面板接觸后移動(dòng)—模擬手機(jī)頁(yè)面翻頁(yè)效果
7. 輸入框獲得焦點(diǎn)后提示消失—模擬搜索框、輸入框效果

下面我大概介紹一下我的原型制作，水平有限，請(qǐng)多指正。

1、站點(diǎn)地圖

我的站點(diǎn)地圖分為首頁(yè)、文字頁(yè)面、搜索頁(yè)面、登錄頁(yè)面，結(jié)構(gòu)比較簡(jiǎn)單。主要是由于我在頁(yè)面之間的切換大量運(yùn)用了動(dòng)態(tài)面板，因?yàn)閯?dòng)態(tài)面板狀態(tài)的切換可以逼真模擬出APP在手機(jī)操作實(shí)際轉(zhuǎn)場(chǎng)動(dòng)效的效果。如在首頁(yè)就設(shè)置了8個(gè)一級(jí)動(dòng)態(tài)面板。

2、首頁(yè)

1）用戶第一次進(jìn)入APP時(shí)需要載入啟動(dòng)頁(yè)，所以在用例中設(shè)置載入時(shí)進(jìn)入啟動(dòng)頁(yè)，2秒后跳轉(zhuǎn)至內(nèi)容頁(yè)；

2）由于首頁(yè)所有頁(yè)面都是通過動(dòng)態(tài)面板的狀態(tài)變化實(shí)現(xiàn)的，所以當(dāng)其他頁(yè)面需要跳轉(zhuǎn)回首頁(yè)時(shí)需要借助全局變量來進(jìn)行判斷以確定動(dòng)態(tài)面板的狀態(tài)。所以設(shè)置全局變量arrive_first，以判斷跳轉(zhuǎn)頁(yè)面。

3、內(nèi)容列表頁(yè)

在內(nèi)容列表頁(yè)中我們要實(shí)現(xiàn)頁(yè)面沿Y軸拖拽，向上拖拽、向下拖拽的限制，及拖拽至某一坐標(biāo)自動(dòng)翻頁(yè)的效果等。

1）對(duì)內(nèi)容頁(yè)進(jìn)行拖拽限制，需內(nèi)容頁(yè)只沿Y軸移動(dòng)；

2）需要完成向上和向下拖拽的限制，即拖拽內(nèi)容不能超過內(nèi)容本身，當(dāng)用戶向下拖拽時(shí)我們以“我的圖標(biāo)”為參照，當(dāng)用戶向上拖拽時(shí)我們要建立一個(gè)隱藏的熱區(qū)作為參照，當(dāng)前動(dòng)態(tài)面板沒有接觸該區(qū)域時(shí)，會(huì)自動(dòng)將動(dòng)態(tài)面板恢復(fù)至原有位置，這里有兩點(diǎn)需要注意，第一、向上拖拽、向下拖拽動(dòng)態(tài)面板恢復(fù)的坐標(biāo)是不同的；第二、建議動(dòng)畫效果選擇“彈跳”，這樣既感覺變化不生硬，又可以模擬出手機(jī)動(dòng)效的特點(diǎn)。

3）因?yàn)樵趹?yīng)用中超過一頁(yè)的內(nèi)容，當(dāng)用手指拖動(dòng)超過某個(gè)臨界值時(shí)，頁(yè)面會(huì)自動(dòng)上拉至下個(gè)界面，所以我在此也模擬了該效果。首先需要在頁(yè)面中找一個(gè)坐標(biāo)，即當(dāng)頁(yè)面拖拽到哪個(gè)臨界值時(shí)，頁(yè)面會(huì)自動(dòng)下拉，在此我找的是標(biāo)題作為坐標(biāo)，當(dāng)標(biāo)題接觸到我的圖標(biāo)時(shí)，頁(yè)面會(huì)自動(dòng)上拉到下一界面；當(dāng)標(biāo)題未接觸到我的圖標(biāo)時(shí)，頁(yè)面會(huì)自動(dòng)回到當(dāng)前界面。

?

4、登錄頁(yè)面

1）當(dāng)點(diǎn)擊“我的圖標(biāo)”進(jìn)入我的頁(yè)面時(shí)，系統(tǒng)會(huì)自動(dòng)檢測(cè)用戶是否為登錄狀態(tài)，如果是非登錄狀態(tài)則會(huì)跳轉(zhuǎn)至登錄頁(yè)面，如果是登錄狀態(tài)則會(huì)進(jìn)入我的頁(yè)面。這里就需要引入第二個(gè)全局變量sign_up來判斷用戶是否進(jìn)行登錄。當(dāng)sign_up變量值不等于“已登錄”時(shí)用戶跳轉(zhuǎn)至登錄頁(yè)面，否則則進(jìn)入我的頁(yè)面。

2）在登錄頁(yè)面中，點(diǎn)擊“登錄”按鈕需要對(duì)輸入框中的“手機(jī)號(hào)碼”、“密碼”進(jìn)行判斷，只有當(dāng)手機(jī)號(hào)碼為“13866666666”、密碼為“111111”時(shí)方可成功登錄。

3）其他輸入情況則需顯示錯(cuò)誤提示。

5、找回密碼頁(yè)面

在找回密碼界面中重點(diǎn)要進(jìn)行說明的是計(jì)時(shí)器的使用，當(dāng)點(diǎn)擊“點(diǎn)擊驗(yàn)證”按鈕時(shí)按鈕消失，開啟計(jì)時(shí)器，當(dāng)“計(jì)時(shí)器”數(shù)字為0時(shí)，計(jì)時(shí)器消失、“點(diǎn)擊驗(yàn)證”按鈕恢復(fù)。

1）需要建立一個(gè)動(dòng)態(tài)面板，命名為“坐標(biāo)”并設(shè)置為隱藏，設(shè)置為2個(gè)狀態(tài)，并設(shè)置用例，當(dāng)該動(dòng)態(tài)面板狀態(tài)改變時(shí)，如果“計(jì)時(shí)器”數(shù)字大于等于1則倒計(jì)時(shí)數(shù)字-1，如果為0時(shí)則隱藏計(jì)時(shí)器，恢復(fù)“點(diǎn)擊驗(yàn)證”按鈕；

2）這里涉及到需要建立一個(gè)局部變量，并設(shè)定每觸發(fā)1次，數(shù)字-1的算法；

3）給“點(diǎn)擊驗(yàn)證”按鈕設(shè)置用例，當(dāng)點(diǎn)擊該按鈕時(shí)，動(dòng)態(tài)面板“坐標(biāo)”每1秒鐘更換狀態(tài)1次，這樣通過動(dòng)態(tài)面板“坐標(biāo)”每1秒狀態(tài)的更換可觸發(fā)局部變量的計(jì)算，達(dá)成計(jì)時(shí)器的效果。

6、評(píng)論頁(yè)面

評(píng)論頁(yè)面要說的是，當(dāng)輸入框獲得焦點(diǎn)后彈出鍵盤的實(shí)現(xiàn)方式。

1）需要建立一個(gè)鍵盤及輸入框，將以上部件放置在動(dòng)態(tài)面板中，新建用例，當(dāng)輸入框獲得焦點(diǎn)時(shí)，整個(gè)動(dòng)態(tài)面板向上移動(dòng)216個(gè)像素（鍵盤的高度）；所以當(dāng)點(diǎn)擊輸入框時(shí)整個(gè)動(dòng)態(tài)面板會(huì)上移216像素，這樣在頁(yè)面中就會(huì)顯示鍵盤部件。

2）當(dāng)輸入框失去焦點(diǎn)時(shí)，整個(gè)動(dòng)態(tài)面板向下移動(dòng)216個(gè)像素（鍵盤的高度），所以當(dāng)不再點(diǎn)擊輸入框時(shí)整個(gè)動(dòng)態(tài)面板會(huì)下移216像素，鍵盤便會(huì)移出頁(yè)面之外。

7、搜索頁(yè)面

當(dāng)用戶點(diǎn)擊搜索框時(shí)，搜索圖標(biāo)及搜索文字提示需自動(dòng)移動(dòng)至搜索框左側(cè)，當(dāng)用戶點(diǎn)擊別處時(shí)恢復(fù)。

1）此處需要考慮當(dāng)搜索框獲得焦點(diǎn)時(shí)，搜索圖標(biāo)與文字移動(dòng)的位置，且動(dòng)畫需要選擇線性移動(dòng)，已給用戶實(shí)時(shí)反饋。

以上說明只是針對(duì)該選型中的關(guān)鍵知識(shí)點(diǎn)和重點(diǎn)的交互進(jìn)行說明，有一些細(xì)節(jié)在此沒有說明，還是希望大家能夠下載原型進(jìn)行體驗(yàn)

特別說明：

此原型只是為了學(xué)習(xí)axure軟件，實(shí)際工作中，產(chǎn)品經(jīng)理是在UI之前輸出原型，多為線框圖，既不可能有如此完善的UI素材，也完全沒必要做成這樣，產(chǎn)品經(jīng)理的原型最重要的是體現(xiàn)產(chǎn)品邏輯結(jié)構(gòu)和功能點(diǎn)，工具的作用是為了提供效率達(dá)成目的，切勿陷入追求原型的完美而影響項(xiàng)目進(jìn)度的陷阱中。為了防止給和我一樣的產(chǎn)品初學(xué)者帶來錯(cuò)誤觀點(diǎn)，所以特此說明。

原型分享

作者鏈接: http://pan.baidu.com/s/1eRsFhtg 密碼: 6psw

官方鏈接:?https://pan.baidu.com/s/1sljhAih 密碼: hf9q

作者：小L，一個(gè)熱愛互聯(lián)網(wǎng)產(chǎn)品，學(xué)習(xí)互聯(lián)網(wǎng)產(chǎn)品的非典型產(chǎn)品經(jīng)理。

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