當前位置:編程學習大全網 - 遊戲軟體 - APP導航和頁面設計樣式

APP導航和頁面設計樣式

頁面導航的分布如下所示

?將入口放在頁面的底部,形成標簽導航。目前這種導航的設計方式在app設計中非常常見,其優點十分明顯,即用戶可以非常直接的看到該app的功能結構。而缺點是這些功能並沒有非常清晰的主次關系,同時擴展性差。因此目前標簽導航建議底部的標簽不超過5個,如果超過5個建議使用其他方式。

該類導航與標簽導航相似,不同的是中間的導航標簽會蘊含更多的操作選項,即該標簽中包含了更多的二級導航。以小紅書為例,其底部導航就是典型的舵式導航,點擊“+”標簽會直接喚醒相機並可以導入圖片/視頻等內容

對於舵式導航裏的擴展二級標簽,這些二級標簽可以形成壹種單獨的導航- 點聚導航 ,從Bilibili的底部導航可以看出,點擊中間的導航會彈出4個二級標簽:開直播、拍攝、上傳和模板創作。舵式和點聚導航的方式往往適用於產品需要特殊引導或者是凸顯核心功能的場景。其缺點是功能之間無主次,擴展性差,不利於後期的功能拓展。

將標簽放到界面的上方,就會形成tab標簽導航,這種導航適用於類目較多的APP作為二級導航梳理頁面邏輯,布局清晰。作為壹個二級導航,頂部標簽導航應用於多種情境下,可以固定數量,展示有限的幾個標簽。也可以擴大壹定的數量,變成向左滑動展現更多標簽,十分靈活,但是因為在手機中左右滑動不如上下滑動方便,因此,個人認為還是不要展開太多標簽。以微博和下廚房為例,這兩個APP都采用了Tab頁導航。

抽屜導航是將菜單隱藏在當前頁面後,點擊導航入口即可像拉抽屜壹樣拉出菜單。抽屜導航壹般用來放置對用戶而言不太常用或者對於產品而言不太核心的功能,優點是可以節省頁面空間,比較適合於不那麽需要頻繁切換內容的應用,例如對設置、關於、個人信息等內容的隱藏。以網易雲音樂為例,其采用了非常標準的抽屜式導航,目前更多APP會采用抽屜導航的變式,即點擊導航入口以後,以向右滑動的方式,整個抽屜頁將滑動出現並且占據整個屏幕,例如小紅書app的抽屜導航。

壹般位於產品頂部,通過點擊呼出導航菜單。導航菜單以浮窗形式位於界面上層,可通過點擊導航菜單以外的區域使其收起。下拉導航的菜單與界面的連貫性比抽屜式要好,容易讓用戶感知當前位置。但由於是位於屏幕上方,相對隱蔽而且不能結合手勢操作,所以該菜單形式也不適合於頻繁的切換功能使用。考慮到導航菜單的可用面積較小,所以壹般采用列表的形式展示菜單內容。下拉導航還有壹種變式,就是下來菜單中展示兩級甚至多級,壹般在電商產品中比較常見,因為品類和篩選條件眾多。

主要功能入口全部聚合在頁面,讓用戶做出選擇。這樣的組織方式雖然無法讓用戶第壹時間看到內容或執行操作,用戶的選擇壓力也比較大。但卻能夠讓用戶整體上了解APP提供的服務,從而選擇自己所需要的那個服務。這種導航於壹些提供的服務較多或者類目較多的APP,例如支付寶、淘寶等。

宮格導航的應用很廣泛,也產生了很多變種,以百度貼吧為例,其在應用宮格導航的時候,將功能進行了分類並且用標題加以區分,使用戶更容易從眾多功能中找到需要使用的功能。

還有壹種變式,是可滑動的宮格,這種設計適合於宮格內容較多,但是不想占用太多屏幕空間,於是用戶可以左右滑動來查看功能內容。以小米app為例,由於功能較多,但是不希望占用較多屏幕面積,因此導航只放了兩行功能,但是用戶可以向右滑動找到更多的功能。在宮格區域下方采用了指示器來告知客戶滑動的範圍。

通過列表指示類目,在右側顯示箭頭表示有二級內容,列表導航通常用於二級頁,由於它與宮格導航壹樣,不會默認展示任何實質內容,所以通常app不會在首頁使用它。這種導航結構清晰,易於理解,冷靜高效,能夠幫助用戶快速的定位去到對應的頁面。

同樣可以對列表進行分類產生變式,這樣邏輯會更清晰,不知道如何確定分類名稱。把分類名稱去掉也是可以的。只是用間距將每壹組列表隔開也能起到梳理邏輯的作用。

每壹個頁面就代表壹個導航入口,這就是輪播導航,適用於比較簡單或者結構比較扁平的APP。輪播導航能夠最大程度的保證應用的頁面簡潔性,操作也是最方便的,只需要手指左右滑動。缺點也很明顯:承載入口的數量有限,超過10個可能就多了。這種導航常見於查看圖片,也經常與其他導航模式結合,作為banner廣告呈現。

  • 上一篇:壹個好的數據庫加密系統壹般應滿足哪些方面的要求
  • 下一篇:全球化是什麽
  • copyright 2024編程學習大全網