app 可以理解為一個由頁面搭建的抽象空間,充滿了邏輯關系(并列的頁面、連續的頁面、層層深入的頁面,父頁面子頁面),好的頁面交互要符合用戶的心智模型,給用戶足夠的線索,幫助用戶前進和后退,頁面出現和退出的動畫是線索之一
一、生切:
如果是點擊tab切換,生切即可,不會覺得不自然,因為頁面的層級關系是并列的且由tab作為“路標”引導,無需切換動作來暗示頁面間的關系(如下圖)
tab bar
navigation bar
二、動畫切入
(1)右側/下方進入,聯想時看書的場景,人在閱讀的時候已經適應了新的內容從右側/下方出現,所以新頁面出現的時候,最自然的是從右側/下方出現,back的箭頭也是指向左側,進入下一頁的箭頭指向右側
IOS系統沒有固定返回鍵,如果頁面層級超過3級,并且有返回上一級的場景,隨著手機屏幕增大,ios系統的返回按鈕在左上角,非常不方便單手操作,則需考慮手勢返回,頁面出現的方向暗示了返回的手勢方向,左滑手勢與翻書的動作類似,像是進入新的一頁,右滑與返回的動作一致,回到上一頁。
頁面出現的動作對視覺有一定的引導作用,頁面從右側/下方出現,視線跟隨頁面的動作到達左側/底部,即閱讀開始的地方。
(2)其他方向進入,如果新頁面是暫時性的頁面,往往以半屏的方式展示結合蒙層的效果,透出與主頁面的關系,則頁面出現的方向與按鈕的方位保持一致即可,比如滴滴的"我的"從左上角彈出。還有些動作采用懸浮按鈕,點擊后跳轉新頁面,直接從按鈕處擴散開來,給用戶連貫感(如instagram)。
結論:如果是tab生切;如果有前后關系從右側/下方滑入,如果懸浮按鈕可采用擴散的方式。