您當(dāng)前位置:圖趣網(wǎng)(Tuquu) >> 網(wǎng)頁設(shè)計(jì)教程 >> 交互設(shè)計(jì) >> 瀏覽設(shè)計(jì)教程

百度輸入法交互體驗(yàn)-你所不知道的iPhone輸入法秘密

 

百度手機(jī)輸入法iPhone版從最初的滿足基本輸入需求,到現(xiàn)在全方位情感化的輸入體驗(yàn),經(jīng)歷了10多個(gè)版本的蛻變。隨著功能和體驗(yàn)不斷提升也得到了越來越多的用戶所喜愛,已經(jīng)成為iPhone上最好用的輸入法。
 

對于它的體驗(yàn)設(shè)計(jì),是一個(gè)逐步完善的過程:

從 基礎(chǔ)體驗(yàn)建設(shè)(可用)——優(yōu)化升級體驗(yàn)(易用)——用戶深層需求滿足(愛用),這是一個(gè)讓用戶從可用到易用,然后到愛用的過程。

輸入法,尤其是iPhone平臺的輸入法是一個(gè)需要高度融合系統(tǒng)的產(chǎn)品,設(shè)計(jì)的過程既要有好的體驗(yàn),同時(shí)又必須遵循各種限制。如何在限制中突破,在限制中做到更好的體驗(yàn)?接下來將從上面三個(gè)層面來說說我們?nèi)绾蚊鎸Ω鞣N限制解決設(shè)計(jì)中的問題:
 

基礎(chǔ)體驗(yàn)建設(shè)(可用)

產(chǎn)品發(fā)展初期,基礎(chǔ)體驗(yàn)最重要,這是保證用戶愿意留在產(chǎn)品中的基礎(chǔ)。

基礎(chǔ)體驗(yàn)的限制

我們在鍵盤方案設(shè)計(jì)之初考慮了很多,說這些是限制,倒不如說是為用戶多想一點(diǎn)點(diǎn)。

1, 減少用戶適應(yīng)成本:因?yàn)檩斎敕ㄊ窍到y(tǒng)工具,在iOS平臺又是越獄后才能安裝的,所以希望用戶使用時(shí)心理負(fù)擔(dān)最小,保持用戶對輸入的專注度,忽略第三方APP的感覺,保證輸入體驗(yàn)。

2, 設(shè)計(jì)上的兼容:輸入法有可能被任何app調(diào)用,所以一定要要保證輸入法在視覺和交互層面都能夠很好的兼容各種app。

站在巨人的肩膀上我們才能站得高,所以初期鍵盤視覺選擇了融合系統(tǒng)鍵盤樣式,然后在此基礎(chǔ)上針對自身特點(diǎn)優(yōu)化。有這樣的方向之后前面的一些問題也都能解決了。從這點(diǎn)出發(fā)我們做了很多設(shè)計(jì)和研究實(shí)踐。

突破點(diǎn):不斷嘗試+研究佐證

9鍵盤設(shè)計(jì)實(shí)驗(yàn):9鍵盤是百度輸入法用戶使用率最高的鍵盤,輸入效率明顯優(yōu)于系統(tǒng)26鍵布局。

所以它的體驗(yàn)精益求精才能給用戶最好的體驗(yàn)。在這里進(jìn)行了大量的設(shè)計(jì)實(shí)驗(yàn),包括鍵盤配色實(shí)驗(yàn),按鍵間距和形態(tài)實(shí)驗(yàn),鍵盤輸入方式指示實(shí)驗(yàn)。


以按鍵間距形態(tài)實(shí)驗(yàn)為例:

鍵盤按鍵可以是圓角,也可以是直角,按鍵與按鍵之間可以有間隙也可以沒有。但是到底什么樣的方式才是又有效率又讓用戶滿意的呢?

這里我們做了大量設(shè)計(jì)實(shí)驗(yàn),嘗試各種形式的排布。最后由用戶研究同學(xué)實(shí)際測試,得到結(jié)論:

1. 熱區(qū)一定的情況下,按鍵形狀越小,按鍵準(zhǔn)確率越高。

2. 按鍵面積越大,用戶輸入的速度就越快。

所以,需要兼顧輸入速度和準(zhǔn)確率,按鍵之間需要有一定的間隔。并且圓角按鍵和系統(tǒng)26鍵盤形態(tài)最接近,輸入感受一致。有明顯分界和凸起的按鍵更有點(diǎn)擊感,能有效的減輕用戶輸入時(shí)心里壓力。

最后,經(jīng)過前面的研究再加上反復(fù)設(shè)計(jì)嘗試之后我們采用了“圓角有間隔的鍵盤”效果。
 

優(yōu)化升級體驗(yàn)(易用)

突破點(diǎn):從用戶痛點(diǎn)出發(fā)

基礎(chǔ)功能已經(jīng)可以滿足用戶的需求,但是基礎(chǔ)功能是否能讓用戶用的舒心?這就需要繼續(xù)不斷優(yōu)化。


圖標(biāo)語義優(yōu)化:

由于輸入法內(nèi)部很多功能的特殊性,用戶在認(rèn)識和理解部分功能圖標(biāo)時(shí)可能會(huì)存在誤區(qū)。在很好的滿足基本輸入需求后就急需對圖標(biāo)做進(jìn)一步優(yōu)化,降低用戶使用和學(xué)習(xí)成本。


限制:這里最大的限制在于輸入法的功能特殊用戶沒有認(rèn)知,且顯示空間局限可能無法圖標(biāo)配合解釋文字出現(xiàn)。

突破方式:在優(yōu)化圖標(biāo)本身可識別性的基礎(chǔ)上建立規(guī)則幫助用戶理解。

1,位置空間允許的情況下有限采用圖標(biāo)與文字結(jié)合的方式.

2,對于用戶常用的圖標(biāo)和熟悉的圖標(biāo)采用圖標(biāo)的方式.

3,對于不常用的圖標(biāo)及不熟悉的圖標(biāo),以保證用戶辨識為優(yōu)先,加入文字指示。

重要功能前置設(shè)計(jì):

輸入法的功能逐漸強(qiáng)大,但是在做這項(xiàng)設(shè)計(jì)之前好多功能還埋在深深的設(shè)置項(xiàng)里,用戶好難找到。拿換膚操作來舉例:

優(yōu)化后比優(yōu)化前減少了4部操作,以后我們還要做的更簡單。


限制:越來越多的功能和有限的空間之間的矛盾。輸入法面板承載不了過多內(nèi)容。


突破方式:根據(jù)功能的使用頻率和重要程度選擇他們的展現(xiàn)形式和前置程度。

第一層級(最常用):cand區(qū)工具欄。是用戶使用頻率最高的,也是最直接點(diǎn)擊到的。

第二層級(常用):logo菜單面板。這里放置了也很常用,但是沒有第一級那么重要的功能,操作也相對容易。

第三層級(很少用但是必須有):設(shè)置項(xiàng)。所有的功能設(shè)置都能在這里找到,但是很多不需要經(jīng)常設(shè)置的功能就只出現(xiàn)在這里不必出現(xiàn)在前兩個(gè)層級。

 

用戶深層需求滿足(愛用)

突破點(diǎn):換一種思路,不可能就能實(shí)現(xiàn)

當(dāng)滿足用戶的使用需求后,就需要滿足他的心靈需求,才能牢牢鎖住用戶。個(gè)性化和情感化是給用戶最貼切的心靈滿足。


皮膚商店和批量主題上線:

我們通過皮膚商店來滿足用戶對輸入法個(gè)性化的需求,皮膚商店的前提就是需要大批量精美的皮膚和主題。


限制:如何快速上線大量皮膚。

最初皮膚設(shè)計(jì)成本很高,不能快速量產(chǎn)。一套完整皮膚需要設(shè)計(jì)大大小小36個(gè)界面,加上切圖開發(fā)實(shí)現(xiàn),一套皮膚至少需要 半個(gè)月/1人 的時(shí)間。

突破方式:技術(shù)+設(shè)計(jì)通過創(chuàng)意改變世界。

設(shè)計(jì)可以由程序?qū)崿F(xiàn)換膚的皮膚資源,使用單一顏色設(shè)計(jì)出有層次感的界面。


表情和表情商店設(shè)計(jì):

輸入的內(nèi)容只能是干巴巴的枯燥文字嗎?顯然我們要為用戶想的更多。要進(jìn)一步為用戶的情感表達(dá)找到出口,誕生了表情輸入和表情商店。通過各種賣萌表情,讓用戶愛上輸入。

限制:賣萌也必須要和輸入法視覺統(tǒng)一,必須以用戶輸入體驗(yàn)為先。


突破方式: 界面風(fēng)格統(tǒng)一,但是個(gè)別地方有亮點(diǎn)。

通過小細(xì)節(jié)賣萌,比如入口icon的眨眼效果和鯨魚表情icon還原了系統(tǒng)氣泡形態(tài)。


結(jié)合以上,從基礎(chǔ)體驗(yàn)建設(shè)(可用)->優(yōu)化升級體驗(yàn)(易用)->用戶深層需求滿足(愛用)三個(gè)方面,我們可以總結(jié)好的設(shè)計(jì)其實(shí)就是在不斷突破限制的過程中逐漸被認(rèn)可的,好的產(chǎn)品設(shè)計(jì)理念也是循序漸進(jìn)逐步被驗(yàn)證的。從輸入法的設(shè)計(jì)過程中可以總結(jié)出幾個(gè)有效的突破方式:

1, 不斷嘗試+研究佐證:反復(fù)的設(shè)計(jì)嘗試加實(shí)際調(diào)研,一定能找出最適合的設(shè)計(jì)方式。

2, 從用戶痛點(diǎn)出發(fā)做設(shè)計(jì):找到用戶最關(guān)注的問題點(diǎn),解決它,能讓你的產(chǎn)品提升一大步。

3, 換一種思路,不可能就能實(shí)現(xiàn):你認(rèn)為不可能做到的事,總有很多人能。換個(gè)思路可能就是突破口。

[教程作者:admin]
免責(zé)聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉(zhuǎn)載,請注明出處,素材資料僅供個(gè)人學(xué)習(xí)與參考,請勿用于商業(yè)用途!
本文地址:http://m.likemindfilms.com/tutorial/id1942.html
新移動(dòng)應(yīng)用的廣告模式-幫你賺錢
三大移動(dòng)平臺上的交互設(shè)計(jì)差異
圖趣網(wǎng)微信
建議反饋
×