大屏手機(jī)上的設(shè)計小策略
作者@麥哥鄭 最近網(wǎng)上爆料三星S5即將發(fā)布,手機(jī)尺寸可能將增大為5.3寸。以三星為首的各家安卓手機(jī)廠商,每次手機(jī)版本升級,屏幕尺寸也必然升級,現(xiàn)在大屏似乎已經(jīng)成了安卓手機(jī)的標(biāo)配。其實(shí)一開始安卓手機(jī)做大只是為了更高的分辨率,更大的電池容量,更好的散熱效果等,在商業(yè)營銷的作用下,大屏趨勢愈演愈烈,經(jīng)過市場的選擇,手機(jī)大屏?xí)r代已經(jīng)到來。
手機(jī)從通訊工具變成了互聯(lián)網(wǎng)的入口,在人們生活中的地位越來越重要,人們對手機(jī)的定位也發(fā)生了改變:從簡單的通訊工具變成了生活學(xué)習(xí)工作的身邊小助手,所以單手持握是最自然的使用方式;而且人們使用手機(jī)的場景都是在移動中,所以單手操作也是最方便的。所以,手機(jī)大屏是趨勢,而單手操作最自然。
矛盾來了。由于手機(jī)機(jī)身變大,用戶在單手操作時會出現(xiàn)一些不爽的情況~例如,我們看一個發(fā)微博的例子:(手機(jī)為魅族MX3,使用者為180+男生。)
當(dāng)你一只手浮著地鐵把手,另一只手顫顫巍巍勉強(qiáng)觸碰到頂部的發(fā)微博按鈕以后,是不是覺得有淡淡的憂?!盐淖执a好,準(zhǔn)備發(fā)送的時候,你會發(fā)現(xiàn)世界上最遠(yuǎn)的距離,不是無處尋覓,?而是根本無法相遇。
準(zhǔn)確高效,流暢易用的操作流程會提升用戶的使用體驗(yàn)。單手操作時拇指操作的觸擊熱區(qū)有限,大屏手機(jī)上的非觸擊熱區(qū)面積明顯增大,其區(qū)域內(nèi)點(diǎn)擊正確率會大幅較低,影響操作效率;用戶在與機(jī)器溝通交互過程中?,以視覺輸入,觸摸輸出為主要通道,剛才的例子,在用戶的目光和手指的循跡組成的流系統(tǒng)中,造成視線→操作斷節(jié),影響用戶的操作流暢性。
類似這樣的痛點(diǎn)在大屏手機(jī)上還有很多,人們享受著大屏帶來的暢快體驗(yàn)的同時,也忍受著由于機(jī)身太大帶來的痛楚。這種矛盾可以調(diào)和嗎?答案當(dāng)然是:yes!.還是發(fā)微博的例子,我們看一下Fuubo是如何優(yōu)雅地設(shè)計的:
Fuubo將寫微博?,發(fā)微博等常用操作放置底部,單手操作毫無壓力~簡單優(yōu)雅有木有~高效便捷有木有~同樣是發(fā)微博,這體驗(yàn)的差距咋就這么大呢?
剛才的兩個例子可以看出,在執(zhí)行任務(wù)–完成目標(biāo)這個流程中,后者通過一些小的設(shè)計手段,很優(yōu)雅的解決了用戶因?yàn)榇笃聊缓蛦问植僮鲙淼耐闯?,提升了操作流暢性,操作更方便?/p>
我們在做設(shè)計的時候,也可以使用一些小策略來消除用戶因此產(chǎn)生的痛點(diǎn)~通過以下幾個小例子,可以總結(jié)出一些規(guī)律,為我們此后設(shè)計提供思路。
一.操作位置轉(zhuǎn)移
1.魅族—下拉懸停
下拉懸停是魅族在魅族MX3的發(fā)布會上提出的一項(xiàng)設(shè)計創(chuàng)新,針對的就是大屏手機(jī)單手操作的情況?!绊敳苛斜眄?xiàng)難以觸達(dá)”這是常見的痛點(diǎn)場景,魅族針對這一情景提供了一個大膽的設(shè)計思路,巧妙的將頂部的操作位置下移,方便用戶觸達(dá),滿足單手操作的基本需求。但是,此種設(shè)計方案用戶操作流是:手指上移–按住下滑—手指上移—點(diǎn)擊,操作路徑較長且與用戶想要點(diǎn)擊頂部列表項(xiàng)時下意識產(chǎn)生的操作意向不太一致,所以使用不太自然;而且由于“懸?!钡臅r間較短,用戶在使用時會產(chǎn)生心理負(fù)擔(dān),對用戶體驗(yàn)來說也不太完美,所以有用戶在論壇里吐槽此舉“雞肋“”很少用“。我猜想下拉懸停的使用頻率應(yīng)該不會太高,但是其設(shè)計思路還是值得學(xué)習(xí)的。
2.Fuubo菜單—底部對齊
安卓上很多應(yīng)用都使用導(dǎo)航抽屜這種模式,常見的抽屜列表都是從上到下依次排列項(xiàng)目,即頂對齊。Fuubo匠心獨(dú)運(yùn),將菜單項(xiàng)底部對齊,這樣既能與頂部的個人信息做區(qū)分,也可保證菜單項(xiàng)目輕松觸達(dá)。這種方式也是運(yùn)用了操作下移的思路。不過這種情況適用于抽屜內(nèi)項(xiàng)目較少的情況,如果列表較長也使用此種設(shè)計的話,會造成遮擋,影響信息可見性。
3.百度輸入法“單手模式”
安卓的百度輸入法提供了“單手模式”。單手模式將鍵盤區(qū)域減小,解決了因?yàn)槭謾C(jī)機(jī)身太寬,拇指活動區(qū)域受限帶來的問題。側(cè)邊空白區(qū)提供了切換左右手使用的按鈕(百度的單手模式默認(rèn)是輸入?yún)^(qū)域向右縮小,看來是為右手設(shè)計的)。給身邊的幾個同事上手使用了一下,褒貶不一。有人表示,創(chuàng)新精神可嘉,使用起來還可以;也有同事則覺得邊上的一大塊空白加三個按鈕嚴(yán)重影響了整體美觀性。評價這個設(shè)計優(yōu)劣有兩個考量因素,第一:用戶操作手機(jī)方式是否頻繁切換,(因?yàn)檫@個設(shè)計切換到正常模式比較困難)。
調(diào)查了一下身邊的同事使用輸入法的操作方式,發(fā)現(xiàn)有兩種情況較常見:
(1)無論何種情景,多數(shù)使用單手完成輸入動作;
(2)在移動場景中(坐地鐵,行走等)單手輸入,靜止?fàn)顟B(tài)(坐著)時,用雙手操作。
對于前者,單手模式可以很好地滿足用戶的需求。所以這種模式也只是為了迎合這部分人的使用習(xí)慣。對于單雙手會頻繁切換的用戶,可能還需要再優(yōu)化;另一個考量因素:全鍵盤和九宮格的使用情況:因?yàn)槿I盤切換到單手模式的時候,可點(diǎn)擊區(qū)域就會減?。ㄔ?.7寸屏或者6.1寸屏上或許會稍微好一些),影響輸入效率,所以對于全鍵盤的用戶來說單手模式并不太適合。對此對身邊的人做了個小范圍調(diào)研,發(fā)現(xiàn)用全鍵盤的人不在少數(shù)。所以,單手模式的設(shè)計能滿足部分用戶的需求。對其余的用戶,此項(xiàng)優(yōu)化可能效果甚微。(百度的單手模式只是單純的將操作區(qū)域做了變化,如果在細(xì)節(jié)上再花些心思效果會更好。)
二.轉(zhuǎn)換操作方式
1.360手機(jī)瀏覽器下拉搜索—手勢
在手機(jī)瀏覽器上,搜索框是一個主要的上網(wǎng)入口。但常見手機(jī)瀏覽器的搜索框多數(shù)在頂部,用戶不方便點(diǎn)觸。360針對此種情景,在瀏覽器首頁提供“下拉搜索”,即下拉可激活搜索框。這個操作初衷是好的,和ios7的下拉搜索思路差不多。但360瀏覽器主界面是個長頁面,需要頻繁的上下滑動查看頁面信息,這導(dǎo)致下拉搜索操作經(jīng)常誤操作被觸發(fā);還有一點(diǎn)實(shí)在不能接受:由于此操作隱藏較深,其提供了用戶引導(dǎo),但這個閃啊閃的引導(dǎo)箭頭竟然一直存在,既不美觀,也會影響用戶正常瀏覽信息。
解決痛點(diǎn)的方向是對的,但設(shè)計方案上還需再優(yōu)化。
所以利用手勢解決操作問題時需要注意:避免引起誤操作,且控制用戶學(xué)習(xí)成本。(正面案例:IOS7的返回手勢)
2.海豚瀏覽器—長按搜索
同樣是解決上一個痛點(diǎn),海豚采取的方式是長按菜單中提供搜索按鈕,點(diǎn)擊后觸發(fā)搜索流程。用戶需要采取的操作時:長按-滑動選擇;這個方式減少了誤操作,但是隱藏較深,需要提供合適的用戶引導(dǎo)。且提供的是臨時性操作,用戶心理負(fù)擔(dān)較大。
三.軟硬件結(jié)合
1.OppoN1—軟硬件結(jié)合?背后操作
N1的一大功能就是其背部四向觸控設(shè)計,可以支持滑動、雙擊、長按三種操作,能實(shí)現(xiàn)翻閱照片、更換音樂、上下拖動網(wǎng)頁、調(diào)整音量、打開應(yīng)用等操作。先不說持握時用食指在背面進(jìn)行操作是否方便,這種敢于創(chuàng)新的精神是國產(chǎn)手機(jī)都需要的。官方的說法此舉是方便大屏手機(jī)的單手操作,但為什么我覺得這種方式更適合雙手操作或者在平板上用呢。。人艱不拆啊。。這種方式局限性較大,可能需要深度定制才能與硬件進(jìn)行高契合度配合,且其操作方式并不太方便并,沒有解決大屏手機(jī)上單手操作的痛啊。也就其創(chuàng)新大膽精神可以給一個小贊。
2..其他(傳感器)
其他的方法還有利用傳感器提供的快捷操作:如搖一搖,吹一吹,但我建議這些傳感器要謹(jǐn)慎使用,利用傳感器作為快捷操作觸發(fā)并不自然,找到合適的場景還是比較難的。
反思
總結(jié)上面的例子,可以得出做設(shè)計優(yōu)化時我們的思考方向:
1.操作位置轉(zhuǎn)移:
- ?操作按鈕下移/列表下移:這種優(yōu)化可有效提高操作效率,需要和整體頁面元素配合設(shè)計,可在此基礎(chǔ)上做發(fā)散創(chuàng)新;
- 操作區(qū)域側(cè)移:?削弱了大屏優(yōu)勢,能滿足部分用戶需求,可能會影響雙手操作;
2.轉(zhuǎn)換操作方式:
移動設(shè)備上提供了豐富的手勢操作,手勢操作簡便,不受區(qū)域限制,在設(shè)計中有較高的發(fā)揮空間,但有的手勢可能會與其他操作沖突,需考慮誤操作;若隱藏較深,?則學(xué)習(xí)成本較高。
3.軟硬件結(jié)合(傳感器):
需要深度定制,適用范圍受限制;場景接入不自然。
以上設(shè)計思路是對一些例子做的簡單總結(jié),我們可以根據(jù)實(shí)際的設(shè)計需求來發(fā)散思考。我們還可總結(jié)出一些容易忽視的因素,希望我們在做此類設(shè)計優(yōu)化時考慮:
- 控制學(xué)習(xí)成本;
- 不影響大屏的優(yōu)勢;
- 切換到雙手操作無障礙(不影響雙手操作)。
這篇文章,我希望能給大家提供一些解決問題的思考方向,更重要的是希望設(shè)計師可以意識到為大屏手機(jī)做設(shè)計優(yōu)化的必要性,全面解決痛點(diǎn),為用戶提供更好的設(shè)計。
- 目前還沒評論,等你發(fā)揮!