毛片不卡永久免费无码,国精品片在线视频,桃色国产精品站一桃色阁,亚洲黄色av成人在线观看,91总久久久国产精品,有奶水哺乳期无码AVAV,一区二区视频国产电影在线,日韩欧洲无码精品直播久久

知識(shí)分享

iOS當(dāng)中UI元素頁碼指示符(小圓點(diǎn))的優(yōu)化。

發(fā)表日期:2015/8/12 11:45:29 文章編輯: 瀏覽次數(shù):2963

iOS的頁碼指示符,在形式上就是橫排的圓點(diǎn),用來表示一系列可以通過橫滑瀏覽的分頁視圖。其中,代表當(dāng)前視圖的圓點(diǎn)處于高亮狀態(tài),其他的則是灰暗的半透明狀態(tài)。

01-ios-design-guideline-mode-break-usability-test.png

      iOS系統(tǒng)首屏,頁碼指示符用來表示頁面總數(shù)以及當(dāng)前所在位置。我們時(shí)常見到這種通過系統(tǒng)首屏來演示頁碼指示符使用方式的范例,實(shí)際上,頁碼指示符能完美適用的界面環(huán)境并不多,而系統(tǒng)首屏正是其中之一,因?yàn)橛脩裘鞔_的知道自己的手機(jī)里裝有很多app以至于第一屏無法完整呈現(xiàn),需要通過橫向滑動(dòng)查看更多。

      網(wǎng)站建設(shè)過程中,很多app或網(wǎng)頁都會(huì)使用這種元素來暗示用戶可以通過橫向滑動(dòng)來查看同級(jí)的其他頁面,也有一些是將其用在界面中特定的區(qū)域來暗示其中存在更多內(nèi)容。不能否認(rèn),這種形式的頁碼指示符在app和移動(dòng)Web的界面設(shè)計(jì)當(dāng)中都很流行,但是要知道,它同時(shí)也是用戶最容易忽略掉的界面元素之一。在我們所做的一系列可用性測試當(dāng)中,用戶經(jīng)常難以發(fā)現(xiàn)這些在尺寸上過于微小的圓點(diǎn),進(jìn)而錯(cuò)失了那些可以通過橫滑來查看到的內(nèi)容或功能入口。所以,我們認(rèn)為圓點(diǎn)形式的頁碼指示符至少不能被用作關(guān)鍵功能和內(nèi)容的唯一導(dǎo)航方式。

      雖然iOS允許你將這些圓點(diǎn)渲染成其他顏色,但想要使如此微小的元素一目了然的突顯在界面當(dāng)中還是非常困難的,除非你能確保將其置于高對(duì)比度的純色背景上。很多產(chǎn)品會(huì)將圓點(diǎn)們放置在五顏六色的banner圖上,使這些本就難以被留意到元素不知不覺的融入到背景當(dāng)中,進(jìn)一步降低了可發(fā)現(xiàn)性。如果一定要這樣做,那么必須確保圓點(diǎn)和背景色之間始終具有較高的對(duì)比度,最好是使用純色背景。

02-ios-design-guideline-mode-break-usability-test.png

iOS的Zappos,在第一張底圖上,頁碼指示符已經(jīng)很弱了,而在右側(cè)第二張底圖上,幾乎完全消失了。

      有一部分產(chǎn)品則在iOS的基礎(chǔ)上進(jìn)一步自由發(fā)揮,將圓點(diǎn)改為方形或其他形狀,布局上也更加隨意。不妨設(shè)想,即便用戶已經(jīng)習(xí)慣了iOS的小圓點(diǎn)模式,現(xiàn)在他們就算發(fā)現(xiàn)了界面中的這些小元素,還要猜想這些方塊會(huì)不會(huì)就是代表著以前的那些小圓點(diǎn) - 可發(fā)現(xiàn)性沒有顯著提升,同時(shí)還造成了認(rèn)知上的困難。如果要使用頁碼指示符,盡可能使用用戶已經(jīng)熟悉的圓點(diǎn)模式,并將其居中的置于對(duì)應(yīng)內(nèi)容的下方。

03-ios-design-guideline-mode-break-usability-test.png

Android中的Fab,借鑒了iOS模式的小圓點(diǎn),但將其置于了內(nèi)容的右側(cè),相比于居中的位置,更難被發(fā)現(xiàn)。

即便用戶能夠注意到頁碼指示符,這里還有一些潛在問題,譬如小圓點(diǎn)們可以讓用戶知道有多少同類型的信息視圖以及當(dāng)前所處位置,但無法提供任何與內(nèi)容本身相關(guān)的信息。此外,用戶對(duì)互動(dòng)的控制權(quán)也非常弱,必須按照次序逐一瀏覽,無法直接跳轉(zhuǎn)。所以,如果在你的需求當(dāng)中這些體驗(yàn)要素比較重要,那么小圓點(diǎn)恐怕不是你的最佳選擇。

鑒于小圓點(diǎn)頁碼指示符所存在的一些可用性問題,我們建議:

  • 首先考慮你的內(nèi)容是否適宜通過橫滑的方式依次瀏覽,還是可以通過更復(fù)雜同時(shí)也更靈活的其他導(dǎo)航方式進(jìn)行架構(gòu)。

  • 對(duì)于橫滑瀏覽的內(nèi)容,盡量采用右邊緣露出一部分內(nèi)容的方式來加強(qiáng)對(duì)于“更多”的暗示,而不要單純依靠頁碼指示符。

04-ios-design-guideline-mode-break-usability-test.png

-------北京網(wǎng)站建設(shè)公司   北京傳誠信------

將文章分享到..
相關(guān)新聞
全新新聞
隨機(jī)新聞
最新網(wǎng)站設(shè)計(jì)案例
Hi,我來幫您!