在輸出低保真原型的時候,配合動效的演示及說明能使團隊成員更直觀的了解最終需要實現的效果,整理了近期項目中比較通用簡單的原型,在不同的項目原型中如何展示和說明自己的交互需求,還需要配合項目需求和團隊的風格求同存異。
整理幾個常用的低保真交互說明及演示效果
【左右滑動類別】
1、左右滑動查看類別
2、向左滑動到顯示“查看更多課程”繼續(xù)向左滑動,自動跳轉“更多”列表頁
3、左滑自動跳轉列表頁時。列表頁從左側滑動進入

【簽到日歷】
顯示內容:
1、顯示從活動開啟月份共12月時間,默認顯示當前月日歷,歷史日期置灰顯示
2、當前月份已簽到>=1,顯示已簽到xx天,未簽到或簽到天數為0 ,不顯示
3、標記已簽到日期
上下滑動效果:
1、點擊【累計獲得分值】,頁面中間彈出簽到日歷,點擊關閉/日歷其他區(qū)域關閉彈窗
2、上下滑動查看簽到日期,月份和簽到天數吸附頂部,滑動到下一月時切換吸頂日期

【表單輸入框】
1、顯示標題+提示語 ,必填項/選填項
2、用戶獲取焦點,輸入內容后隱藏默認文案,顯示清除圖標
3、用戶已輸入內容,重新獲取焦點,修改,顯示清除圖標,不自動清除已輸入內容
4、用戶已輸入內容,失去焦點,隱藏清除圖標,校驗輸入框內容,校驗失敗,顯示對應的提示語,提示語顯示在文本框下方,自動調整文本框上下間距。
5、清空文本框,顯示默認文案,隱藏清除圖標
6、已校驗失敗情況,文本框再次獲取焦點輸入任意內容,隱藏提示語,失去焦點再次校驗(同4)
7、獲取焦點,彈出輸入鍵盤遮擋了輸入框內容,頁面內容自動上移

【選擇地址區(qū)域】
彈窗顯示內容:所在區(qū)域、關閉按鈕、請選擇tab、省、市、區(qū)內容
1、省、市、區(qū)tab,點擊左右切換查看,tab最多顯示6個字,超過顯示…tab類別間距自適應
2、已選擇某一級,自動跳轉選擇下一級內容
3、已選擇區(qū)/縣,自動關閉彈窗,“所在區(qū)域”顯示已選中的區(qū)域
4、已選擇區(qū)域,當前頁再此點擊所在區(qū)域,保留已選擇的區(qū)域,可重新選擇區(qū)域,重新選擇少于三級,選擇無效,關閉彈窗,仍顯示之前已選擇區(qū)域
5、點擊關閉和彈窗其他區(qū)域,關閉彈窗
6、僅選中省、或省/市,關閉彈窗,選擇無效,關閉彈窗,再次點擊顯示彈窗,已選擇不保留

【頁面右下角懸浮導航】
1、點擊導航按鈕,旋轉同時向上彈出菜單圖標,導航選擇變成關閉按鈕
2、點擊關閉收起菜單,顯示導航圖標
3、按鈕顯示規(guī)則:
當前有音頻在播放隊列中顯示播放按鈕,無則不顯示
關閉網頁清除播放隊列
主頁與個人中心頁僅顯示播放按鈕(若有)
其他頁:顯示導航按鈕,點擊顯示關閉、主頁、賬號、播放圖標按鈕
音頻播放時,用戶另外點擊播放視頻,音頻自動暫停,播放按鈕顯示為“暫?!睉B(tài),視頻播放停止或關閉,音頻會自動播放,播放按鈕顯示播放態(tài)

【所有分類】
1、顯示一級分類名稱,點擊切換
2、點擊一級分類,對應右側顯示當前一級分類下二級分類信息及商品信息
3、當前二級分類滑動到底部,顯示“進入xxx模塊”點擊跳轉當前一級分類全部類別模塊


【滾動列表】
1、顯示內容:用戶頭像、昵稱、引導詞、**狀態(tài)
2、向上滾動消失,最多同時顯示3條數據
3、進入當前頁自動加載數據,2s循環(huán)滾動

