移動(dòng)場景中的產(chǎn)品設(shè)計(jì)(4)
設(shè)計(jì)啟示:高對(duì)比度
大家覺的下圖這樣的設(shè)計(jì)方式有什么問題嗎?問題是這樣的設(shè)計(jì)容易讓用戶較難發(fā)現(xiàn)其他幾個(gè)入口,特別是在昏暗的環(huán)境下,和手機(jī)低亮度底下,可見度是非常差的。
設(shè)計(jì)師們是配置了最好的顯示器,在寬敞明亮的燈光下工作的,所以這樣的設(shè)計(jì)是好看的。但實(shí)際的應(yīng)用場景是,用戶在各種各樣的環(huán)境底下使用,可能特別昏暗也可能特別刺眼,所以設(shè)計(jì)師可以考慮在設(shè)計(jì)完畢后,放在手機(jī)上調(diào)節(jié)各種亮度或則在太陽底下看看實(shí)際的效果。所以提高前后元素的對(duì)比度,可以適應(yīng)各種場景。
設(shè)計(jì)啟示:快速調(diào)節(jié)亮度
現(xiàn)在很多瀏覽器和閱讀器,如ZAKER,QQ/UC瀏覽器等,都直接配置夜間模式,和屏幕亮度調(diào)節(jié)。讓我們?cè)谌鯇?duì)比度中,感受到產(chǎn)品對(duì)我們的體貼的一面。這些也都是考慮到移動(dòng)產(chǎn)品場景的復(fù)雜性和變化。
聲音提示,也是對(duì)環(huán)境的一種擬補(bǔ)。在昏暗的環(huán)境下,一個(gè)丁的聲音,讓你立刻直到短消息來。還有在操作的過程中,一些反饋不能及時(shí)看到,聲音就能將這部分的視覺死角給擬補(bǔ)過來。
場所/時(shí)段/注意力—碎片化時(shí)間
Web場景:場所較固定,每次使用時(shí)間段長,注意力集中
移動(dòng)場景:隨時(shí)隨地,碎片化時(shí)間使用,注意力分散
設(shè)計(jì)啟示:注重核心點(diǎn)表達(dá),顯示操作結(jié)果,高效信息傳達(dá)…
是否有這樣一種體驗(yàn):當(dāng)早上出門忘記帶手機(jī),就感覺這一天過的特不踏實(shí),對(duì)大部分人來說都有這樣的感受。當(dāng)移動(dòng)設(shè)備能裝入口袋的那天起,就已經(jīng)融入了我們的身體。所以任何時(shí)間,任何地點(diǎn),承載著強(qiáng)大功能的手機(jī),都可能被我們拿起,然后因?yàn)楦鞣N原因又快速收起。移動(dòng)產(chǎn)品的特性,就決定了它碎片化時(shí)間的使用。我們看看碎片化時(shí)間主要產(chǎn)生在哪些產(chǎn)所:步行中,坐公交,擠地鐵,逛商場,工作中,睡前睡醒,旅游出差,無聊寂寞,聯(lián)系他人,拍照,玩游戲。。。
手機(jī)總能出現(xiàn)在我們產(chǎn)生的碎片時(shí)間里,這個(gè)過程是沒法做到聚精會(huì)神的,從頭到尾好好干完一件事的。周邊各種環(huán)境永遠(yuǎn)在影響著你,思路常常被打斷,操作常常會(huì)停止,任務(wù)中斷后,還需要繼續(xù),于是設(shè)計(jì)就要考慮聚焦核心點(diǎn),考慮中斷后的連續(xù)性。所以在產(chǎn)品的信息布局上就需要將這樣的場景考慮進(jìn)去,讓這樣的布局減輕用戶的記憶負(fù)擔(dān)。
我們?cè)谠O(shè)計(jì)搜索結(jié)果頁的時(shí)候,原來的界面是這樣的。
層級(jí)過多,排序全部展示出來,分類篩選全部隱藏。排序和分類篩選的展現(xiàn)方式,一個(gè)過多展示,一個(gè)只有入口,沒有操作后的結(jié)果顯示。在碎片化的時(shí)間里,當(dāng)用戶使用了分類篩選后,過段時(shí)間再回到這個(gè)頁面,估計(jì)基本就忘記剛剛的選擇了。我們不可能讓用戶再這里還承擔(dān)上記憶負(fù)擔(dān),所以根據(jù)這一點(diǎn),和產(chǎn)品的意愿,我們后面改版成如下方式,提升了用戶訪問深度。
本文地址:http://pkvc.cn/tutorial/wd1309.html
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問題
- 網(wǎng)頁設(shè)計(jì)精粹 網(wǎng)頁中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁UI - 原子設(shè)計(jì)理論(上)
- 如何通過設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺設(shè)計(jì)系列文章(二):全屏