中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

神殿級App開發(fā)導航欄架構(gòu)設(shè)計必看攻略

2022-08-14    分類: App開發(fā)

一款小小的手機APP應(yīng)用,卻包羅萬象,融合這復雜的信息內(nèi)容或功能邏輯。要讓用戶在使用中獲得的體驗,迅速掌握應(yīng)用的框架結(jié)構(gòu),其導航的設(shè)計是一個重要的環(huán)節(jié)。由于移動設(shè)備特別是智能手機的屏幕尺寸有限,設(shè)計者們通常會將屏幕空間盡量留給主體內(nèi)容,優(yōu)秀的APP開發(fā)導航設(shè)計會讓用戶輕松到達目的地而又不會干擾和困惑用戶。下面我們先來看3種具有代表性的導航模式。

經(jīng)典導航:tabbar

蘋果大力推薦應(yīng)用開發(fā)者優(yōu)先采用這種方式,tabbar 基本就是導航的標準設(shè)計。Tabbar 的優(yōu)點很明顯,用戶完成切換的成本很低,只需要一次點擊操作,而放在屏幕底部對主體內(nèi)容的視覺沖擊可以說是最小的,這樣用戶就不會在瀏覽主體內(nèi)容時受到過多的干擾。至于缺點也同樣明顯,那就是受制于屏幕寬度的限制,通常4到5個功能項的切換會比較合適,過多的話將會顯著提高用戶的切換成本。

優(yōu)秀的挑戰(zhàn)者:抽屜式導航

Tabbar 并不是好的,它并不適用于過多的切換項。抽屜式導航通過縱向排列切換項解決了這一問題。不過這也意味著它不能和主體內(nèi)容同時出現(xiàn)在屏幕上。

在大部分的設(shè)計當中,通過點擊屏幕左上角的按鈕喚出切換項,有些也可以通過向右滑動手指來完成。一個簡單的滑動動畫,就像拉出一個抽屜,抽屜式導航這個名稱應(yīng)該就是來源于此。突破了數(shù)量的限制,更大程度上釋放了主體空間,也因此提高了操作成本。如果主要功能項組織在4 到5 項,tabbar 的設(shè)計方式會更好,否則,就應(yīng)該優(yōu)先考慮抽屜式導航了。

為頻繁操作設(shè)計:滑動式的導航

導航并不一定只發(fā)生在功能項之間。例如新聞類應(yīng)用需要在不同類別的新聞之間進行切換瀏覽,這種切換的頻率要比功能項切換更高,切換項的數(shù)量也會比較多,像常見的新聞類別就有 7,8 種。網(wǎng)易新聞早期的 iOS 版本中采用了抽屜式導航的方式進行新聞類別的切換,由于高頻率切換時需要過多的操作次數(shù),因而缺乏操作的連續(xù)性。而滑動式導航的用戶體驗則便捷了很多,尤其在連續(xù)切換時其操作方式的連續(xù)性比較強,主體頁面的過渡也更加平滑,會產(chǎn)生更加流暢的體驗。當然也會有一些缺陷,比如一次滑動只能切換到相鄰的類別,要想直接切換到對應(yīng)類別可以點擊上方的類別列表,不過由于類別過多,有時候可能需要滑動一下類別列表才能完成操作。不過總體而言,當需要在具有相似屬性類別之間進行較頻繁切換時,這種設(shè)計方式很值得參考。

如何走得更遠?

手機APP應(yīng)用的導航和現(xiàn)實世界中的路標地圖的作用很類似。它是應(yīng)用軟件的虛擬框架,對用戶具有指示標識以及識別的功能。如同路標,導航能在使用中,定位用戶當前在哪兒,為用戶突出當前視圖重要的功能,在不同的視圖和區(qū)域迅速地切換信息,記錄使用的操作軌跡防止用戶迷失等。那么在具體實踐中導航如何設(shè)計才能讓我們走得更遠呢?

APP導航設(shè)計的步驟主要為以下三步:

1. APP框架整理:信息架構(gòu)or任務(wù)分析

2. 框架層級判斷: 扁 平vs 樹狀

3. 導航具體表現(xiàn)形式:控 件形式and擺放位置

Step1: APP框架整理: 信息架構(gòu)or任務(wù)分析

App設(shè)計的最初階段,需要先建立一個App藍圖,來確保在之后軟件導航的設(shè)計過程中,設(shè)計人員能對功能產(chǎn)品所屬層級以及需要兼顧的前后關(guān)系進行宏觀的掌控。然后通過任務(wù)分析,能讓設(shè)計師清晰地了解到當前APP將要實現(xiàn)的功能層級順序以及信息在系統(tǒng)中傳遞的狀態(tài),使其在設(shè)計中能全局地把握住產(chǎn)品的結(jié)構(gòu)以及用戶當前所需要進行的操作。

Step2 : 功能層級判斷: 扁平 VS 樹狀

再分析了App的框架結(jié)構(gòu)后,產(chǎn)品功能的邏輯層次也就基本確定??梢岳靡恍┛蚣芾L制軟件將分析整理的框架記錄下來,形成一張大的藍圖。在后期的導航設(shè)計中,許多功能的安排以及排布可以直接從圖中所示的位置關(guān)系進行設(shè)計。

在導航的設(shè)計中,經(jīng)常遇見的功能層級主要是兩種:一種是扁平層級,即所屬功能在框架藍圖中屬于同一層級的并列關(guān)系,這種主要出現(xiàn)在信息架構(gòu)較為扁平化,同級別任務(wù)功能較多的視圖;另外一種則是樹狀層級,即信息架構(gòu)較為層次化或者任務(wù)之間有從屬關(guān)系,需要用戶逐層深入的視圖中,如iOS中的單進單出式層級導航。

Step3: 導航具體表現(xiàn)形式:控件形式and擺放位置


通過前面兩個步驟的分析與設(shè)計,App的導航結(jié)構(gòu)可以算是基本完成。但因為現(xiàn)在手機平臺眾多,用戶使用習慣各不相同。所以在產(chǎn)品的具體設(shè)計中,為了給產(chǎn)品提供的用戶體驗,還需要把握平臺特性,選擇合適的控件形式,并且根據(jù)用戶手持設(shè)備的操作系統(tǒng),為用戶設(shè)計導航最易操作的位置。

綜上,手機產(chǎn)品的導航設(shè)計需要在明確了設(shè)計的總體框架和結(jié)構(gòu)后,根據(jù)硬件的特點和用戶的使用習慣進行設(shè)計。通過理性的架構(gòu)分析,感性的體驗設(shè)計,好的導航結(jié)構(gòu)能讓你的App開發(fā)設(shè)計事半功倍。

文章名稱:神殿級App開發(fā)導航欄架構(gòu)設(shè)計必看攻略
文章轉(zhuǎn)載:http://m.rwnh.cn/news/189843.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營銷seo公司;服務(wù)項目有App開發(fā)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)公司
磴口县| 建水县| 平果县| 临高县| 扶余县| 手机| 诏安县| 文昌市| 湘乡市| 涿州市| 民丰县| 乌兰察布市| 高州市| 明星| 蚌埠市| 乌鲁木齐县| 双牌县| 京山县| 卢龙县| 舒兰市| 郎溪县| 诸城市| 额济纳旗| 哈密市| 武乡县| 宁波市| 宁武县| 齐齐哈尔市| 建水县| 云和县| 永吉县| 峨边| 泽州县| 和平县| 耒阳市| 长治市| 武山县| 南召县| 酉阳| 沁阳市| 桐城市|