在APP設(shè)計(jì)中如何正確管理滾動(dòng)頁(yè)面

2016-12-16    分類: App設(shè)計(jì)

移動(dòng)端設(shè)計(jì)對(duì)于大家來(lái)說(shuō),總覺(jué)是一件挺容易的事,畢竟移動(dòng)端的界面就只有那么大,但事實(shí)上若要做好用戶體驗(yàn),不讓用戶產(chǎn)生不必要的時(shí)間成本,每一個(gè)細(xì)節(jié)都必須多次嘗試尋求方式,前面我們通過(guò)航菜單設(shè)計(jì)過(guò)程中一些實(shí)用理論,接下來(lái)由成都app開發(fā)公司創(chuàng)新互聯(lián)網(wǎng)絡(luò)UI設(shè)計(jì)師向大家接著介紹頁(yè)面中的滾動(dòng)如何正確控制,絕對(duì)不是越多越好。

在移動(dòng)終端上瀏覽頁(yè)面不一定是從一個(gè)頁(yè)面跳到另一個(gè)頁(yè)面,有時(shí)也像閱覽 卷軸一樣,向頁(yè)面底部展開。屏幕寬窄有限,但滾動(dòng)頁(yè)面的長(zhǎng)度可以加長(zhǎng),加載 更加豐富的內(nèi)容。下文會(huì)給出一些建議,正確管理在移動(dòng)終端上的滾動(dòng)頁(yè)面。

提示用戶使用滾動(dòng)頁(yè)面

首先,設(shè)計(jì)者必須想辦法提示用戶可以向頁(yè)面底端拖動(dòng)。設(shè)計(jì)者需要向用戶 表明:當(dāng)前頁(yè)面下方,屏幕沒(méi)有展示出來(lái)的部分仍然存在內(nèi)容。最常見(jiàn)的方法就 是前文提到過(guò)的切斷設(shè)計(jì)。

定位錨點(diǎn)

處在頁(yè)面底部的元素?zé)o法顯示在屏幕上。為了彌補(bǔ)這個(gè)缺點(diǎn),設(shè)計(jì)者可以采 用定位錨點(diǎn) :用戶點(diǎn)擊定位錨點(diǎn)后,自動(dòng)跳轉(zhuǎn)到相關(guān)頁(yè)面。

固定元素

移動(dòng)終端屏幕最主要的缺點(diǎn)是長(zhǎng)度和寬度都有限。鑒于寬度很難再擴(kuò)大,設(shè) 計(jì)者只能設(shè)計(jì)很長(zhǎng)的滾動(dòng)頁(yè)面,以便添加更多內(nèi)容。所以,設(shè)計(jì)者應(yīng)該把重要元 素始終留在屏幕上,讓用戶在不斷下拉頁(yè)面時(shí)仍然能夠看到它們。

根據(jù)不同內(nèi)容,重要元素也不一樣。重要元素在總體上分為以下三種。

◎ 行為召喚:不論位于頁(yè)面何處,都能鼓勵(lì)用戶采取行動(dòng)。行為召喚如果始 終顯示在屏幕上,還能起到建議作用。

◎ 導(dǎo)航元素:“返回”或“關(guān)閉”、跨越頁(yè)面的“下一頁(yè)”“上一頁(yè)”等元素。 同類鏈接還包括“返回頁(yè)面頂端”,讓用戶快速回到頁(yè)面頂端,彌補(bǔ)屏幕 長(zhǎng)度不足的缺陷。根據(jù)系統(tǒng)和設(shè)備的不同,此類導(dǎo)航命令不一定從開始就被采用。

◎ 指示當(dāng)前情況的元素和標(biāo)題,幫助用戶時(shí)刻記得自己正在瀏覽的內(nèi)容。

頁(yè)面頂端和底端固定不變,讓標(biāo)題和關(guān)鍵的行為召喚始終顯示在屏幕上。在頁(yè)面很長(zhǎng)的情 況下(如 COS 的網(wǎng)站),“返回頁(yè)面頂端”的鏈接能幫助用戶迅速返回頁(yè)面頂端。

在用戶下拉演出介紹的頁(yè)面時(shí),頁(yè)面頂端的節(jié)目日程欄始終固定不變,點(diǎn)擊進(jìn)入后會(huì)顯示 演出的時(shí)間和票價(jià)。其實(shí),這是此類頁(yè)面最關(guān)鍵的行為召喚。

通常來(lái)說(shuō),設(shè)計(jì)者會(huì)在頁(yè)面的頂端和底端放置固定元素,但現(xiàn)在越來(lái)越多的 應(yīng)用程序和網(wǎng)站開始使用懸浮窗。而安卓系統(tǒng)的《Mateiral Design 設(shè)計(jì)規(guī)范》或 許在某種程度上助推了這種趨勢(shì)。

創(chuàng)建新文件的行為召喚作為懸浮窗始終位于屏幕右下方,無(wú)論用戶處在文檔清單上的什么 位置上,都能使用懸浮窗。

我們常常會(huì)見(jiàn)到,很多應(yīng)用程序上雖然設(shè)計(jì)了固定元素,但給人的感覺(jué)是設(shè) 計(jì)者沒(méi)有經(jīng)過(guò)認(rèn)真考慮,僅僅是為了照搬設(shè)計(jì)規(guī)范而已。不要忘記,固定元素必 須有資格占據(jù)屏幕上的固定位置!如果設(shè)計(jì)者拿不定主意, 那么可以采取折中的 辦法:在用戶下拉頁(yè)面時(shí)隱去這些元素,一旦用戶采取任何操作(尤其是點(diǎn)擊), 這些元素會(huì)再次重現(xiàn)!

分享標(biāo)題:在APP設(shè)計(jì)中如何正確管理滾動(dòng)頁(yè)面
轉(zhuǎn)載來(lái)于:http://www.bm7419.com/news/71225.html

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

廣告

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

h5響應(yīng)式網(wǎng)站建設(shè)