97色伦97色伦国产,国产中文视频,三人成全免费观看电视剧高清,在线看片免费不卡人成视频

頁面跳轉方式,如何設計更合理?

頁面跳轉在 APP 中屬于最常見,也是最基礎的一個交互細節點。我們常見的跳轉方式有直接跳轉、左右跳轉、上下跳轉、翻轉、聯動。

其它酷炫的效果我們看過很多,但是現實中能做到的又有幾個呢?在設計時需要考慮好其中的關聯性,給出最符合用戶心理預期的過渡方式,從而做出最合適的設計。

視覺順序

首先看一下,我們的視覺「閱讀順序」是:左→右,上→下。因此延伸出目前 APP 最常見的兩種頁面跳轉方式:左右跳轉,上下跳轉。

直接跳轉

直接跳轉是最原始、最簡單的跳轉方式,web端常見,在APP中出現較少,標簽切換常見。

常用于快速開發,Android中常用。

左右跳轉

最常見的跳轉方式。(ios原生效果)

常用場景:

這里有個細節要注意,就是我們的返回鍵在左上角,也就養成了用戶一種習慣,左上角的鍵,與點擊之后的效果,往往就應該是頁面從右側退出,與進入時反向的效果。

這也是為什么大部分 APP 不會把入口按鈕放在左上角的原因。

那么左上角這個位置,除了給返回鍵當做固有的位置外。還常常用于抽屜式導航,因為抽屜式導航的方向,與返回時的移動方向是一致的。常見抽屜式導航的 APP 如:滴滴打車、摩拜單車等。

上下跳轉

相對于左右跳轉,上下跳轉就比較難理解了。

這種跳轉方式也很常見,但是大部分人不清楚什么時候用,這里我們簡單分析下。

運用場景:

比如我們在微信聊天頁,發起一個聊天的時候:

還有新添加群人員,新建筆記本,新建地址時等。

我們用微信聊天頁面舉例:點擊+號離的內容時,圖片、拍照、位置、紅包、收藏等,都是采用下到上的方式呈現,因為這些創建都是對當前聊天窗口一次性產生內容。

下面我們看下百度的設置>地址管理>添加地址:左右>左右>上下。

翻轉

常見的有平安好醫生中間的按鈕,大姨媽APP中間的商城。

聯動性

如 APP store 每日推薦到介紹頁。類似的還有 Behance APP 的作品展示。國內APP 很少有這種聯動效果,因為一旦頁面結構改變,整個效果基本無法復用。

類似于這種強聯動,我們會在很多概念設計稿中看到,但是在實際的 APP 是很少見到的。因為開發成本/維護成本都很高。

搜索頁面打開

這里強調一下搜索頁面。搜索頁面的進入往往有兩種形式。一種是 icon 做入口,另一種是搜索框做入口。

icon做入口:更像是上下級關系,常用左右跳轉來實現。比如:抖音。

搜索框做入口:點擊就獲取光標的感知,是一個簡單的聯動過渡效果。比如:微信、云音樂。

其它方式

關于其它方式,基本上只有極個別的 APP 中可以看到。

其它的方式,要結合實際的情況來考究。一定要注意關聯性。比如微信新出的浮動展開效果,因為元素要浮動,為了更加貼合所以有了收縮的效果。

結語

頁面跳轉形式上其實就是上下左右內外。考慮好之間的關聯性,給出最符合用戶心理預期的過渡方式,就可以幫助我們找到最合適的設計。

0371-65861326
138 3818 8615
lingpaoad@sina.com
鄭州市中州大道晨旭路
瑞銀大廈23樓

Copyright ? 2004-2018
豫ICP備18007656號-1
在線客服
微信公眾賬號