QQ截圖20171115091721.jpg

編者按:iPhoneX 發(fā)布之后,全新的屏幕和為之適配的iOS系統(tǒng),為我們呈現(xiàn)出全新的交互。之前我們習(xí)慣了的交互,在這塊帶著劉海的屏幕上,不再完全相同,之前恰到好處的設(shè)計(jì),在這塊屏幕上似乎也沒(méi)法完美的運(yùn)作了。產(chǎn)品設(shè)計(jì)師Daniel Korpai 發(fā)現(xiàn)了在iPhoneX移動(dòng)端網(wǎng)頁(yè)導(dǎo)航上存在的交互上的問(wèn)題,并撰寫(xiě)此文。

使用漢堡菜單還是使用標(biāo)簽式導(dǎo)航,是移動(dòng)端UI設(shè)計(jì)師常常會(huì)糾結(jié)的問(wèn)題。就目前來(lái)看,隨著手機(jī)屏幕尺寸不可控制的逐步膨脹,標(biāo)簽式導(dǎo)航似乎越來(lái)越受歡迎。

不過(guò)值得注意的是,在移動(dòng)端上APP會(huì)更加傾向于使用標(biāo)簽頁(yè)導(dǎo)航,而絕大多數(shù)的移動(dòng)端網(wǎng)站仍然會(huì)使用漢堡菜單作為主要的導(dǎo)航工具。值得注意的是,漢堡菜單這種設(shè)計(jì)在目前越來(lái)越大的手機(jī)屏幕上,可用性正在逐漸降低。

關(guān)鍵的痛點(diǎn)

絕大多數(shù)的時(shí)候,我們會(huì)在行進(jìn)中使用手機(jī),在地鐵上,超市里,在下班路上,這個(gè)時(shí)候我們常常無(wú)法雙手操作,手上提著袋子,或者拿著一杯咖啡,或者握著地鐵上的扶手。但是往往這個(gè)時(shí)候,我們更需要同界面進(jìn)行快速的交互。

多數(shù)傳統(tǒng)的移動(dòng)端網(wǎng)站導(dǎo)航,要么在頁(yè)面的最頂端,要么在最底端,可是問(wèn)題在于,手機(jī)屏幕太大了。網(wǎng)頁(yè)的漢堡菜單圖標(biāo)卻常常位于手機(jī)的左上角或者右上角,恰好是距離拇指最遠(yuǎn)的位置。

面對(duì)的挑戰(zhàn)

面對(duì)這種痛點(diǎn),UI和UX設(shè)計(jì)師們并沒(méi)有忽略。有不少設(shè)計(jì)師會(huì)和開(kāi)發(fā)者協(xié)同,在網(wǎng)站界面的底部放置一個(gè)小尺寸的固定導(dǎo)航欄。在桌面端上瀏覽的時(shí)候,它看起來(lái)是懸浮在頁(yè)頭的導(dǎo)航,在移動(dòng)端上,它是懸浮固定在頁(yè)面底部的快速訪問(wèn)式的小的導(dǎo)航按鈕組合。

隨后,這種嘗試逐步演變成了靠近漢堡圖標(biāo)的一系列快速訪問(wèn)功能按鈕,這些按鈕代表著這個(gè)網(wǎng)站的重要、常用的功能元素,可能是導(dǎo)航、電話、特定頁(yè)面的鏈接等等。

更多資訊關(guān)注巨推傳媒:http://www.jutui360.com/list-8/ 聯(lián)系電話:400-606-5558 qq/微信:shijianyingxiao8