如何創(chuàng)造流式的產(chǎn)品使用體驗(yàn)

流是“一種深層昼浦、幾近冥想式的投入狀態(tài)”。流通常產(chǎn)生一種“溫和的快感”筒主,讓人感覺(jué)不到時(shí)間的流逝关噪。處于流狀態(tài)的人是非常高效鸟蟹,尤其是投入工程、設(shè)計(jì)使兔、開(kāi)發(fā)或?qū)懽鞯冉ㄔO(shè)性活動(dòng)時(shí)建钥。因此我們?cè)谠O(shè)計(jì)產(chǎn)品時(shí)應(yīng)該促進(jìn)和增強(qiáng)流,還應(yīng)竭盡全力避免任何可能打斷流的行為虐沥。

遵循用戶的心理模型

用戶對(duì)于軟件如何執(zhí)行自己的任務(wù)的判斷基于過(guò)往的經(jīng)驗(yàn)所積累的自然的想法熊经,并非去按照計(jì)算機(jī)的運(yùn)行機(jī)制設(shè)想活動(dòng)的過(guò)程。

如用戶在手機(jī)端購(gòu)買電影票選座時(shí)欲险,他們關(guān)心座位的位置與距離屏幕的距離镐依,因此,如果把座位與屏幕以圖形化的方式顯示出來(lái)天试,并提醒用戶最佳的觀影座位是那些就比較合理槐壳。

電影選座

少就是多

用戶界面中元素的數(shù)量越多,意味著更多選擇喜每,使用難度越大务唐。為了不讓界面成為控件的堆砌,精心編配接界面中的編配就變得很重要带兜。少就是多的核心價(jià)值是目的驅(qū)動(dòng)的極簡(jiǎn)主義枫笛,讓每一個(gè)元素都指向目的。

google

提供選擇刚照,而不是提出問(wèn)題

設(shè)想在開(kāi)車時(shí)刑巧,汽車為用戶提供了完善的選擇,卻從未發(fā)出一個(gè)對(duì)話框无畔,人們依舊可以順暢的駕駛汽車到目的地海诲。因此無(wú)模態(tài)的選擇有助于給用戶帶來(lái)控制感和掌控感,這也正是人們使用數(shù)字產(chǎn)品時(shí)想要的感覺(jué)檩互。

提供選擇

讓必要工具近在咫尺

設(shè)想一位工匠在制作一件作品,他會(huì)把常用的工具擺放在手邊才能專注的工作咨演,而不希望總是去遠(yuǎn)處拿工具中斷眼前的工作闸昨。

sketch

提供無(wú)模態(tài)反饋

當(dāng)用戶在操控產(chǎn)品或使用工具時(shí),清晰的顯示這些操作狀態(tài)和效果非常重要薄风。這些效果必須容易看到饵较,容易理解,不會(huì)阻止或干擾當(dāng)前的工作遭赂。進(jìn)度反饋是流的一個(gè)關(guān)鍵元素循诉。

如網(wǎng)易云音樂(lè)在成功開(kāi)始播放一首歌曲后會(huì)提供反饋。

網(wǎng)易云音樂(lè)

設(shè)計(jì)要以防萬(wàn)一撇他,但應(yīng)預(yù)測(cè)其可能性

設(shè)計(jì)產(chǎn)品不應(yīng)把可能性和概率等同視之茄猫,如用戶6小時(shí)工作后狈蚤,會(huì)選擇保存工作或直接結(jié)束程序,雖然每個(gè)選擇都有可能划纽,但放棄工作結(jié)果的概率非常低脆侮。若這時(shí)出現(xiàn)一個(gè)對(duì)話框詢問(wèn)用戶是否保存更改,則屬于冗余的交互設(shè)計(jì)勇劣。

冗余設(shè)計(jì)

量化呈現(xiàn)信息

數(shù)字化的呈現(xiàn)信息難以閱讀和理解靖避。

微信顯示內(nèi)存占用

反應(yīng)對(duì)象和應(yīng)用程序的狀態(tài)

在觀察我們身邊的人時(shí),會(huì)發(fā)現(xiàn)人們工作比默、休息幻捏、走路或在運(yùn)動(dòng),我們能看到每個(gè)人給其他人的反饋命咐,也依靠這樣的反饋進(jìn)行社交篡九。

同樣,程序也應(yīng)給用戶提供所處狀態(tài)的線索侈百。當(dāng)程序休眠瓮下、恢復(fù)或運(yùn)行時(shí),都應(yīng)給用戶相應(yīng)的反饋钝域。

簡(jiǎn)書在寫文章時(shí)的反饋

避免不必要的報(bào)告

不需要把與用戶無(wú)關(guān)的信息以對(duì)話框的形式報(bào)告給用戶讽坏,這會(huì)影響流式的使用體驗(yàn)±ぃ可以通過(guò)在軟件中建立狀態(tài)指示器路呜,使感興趣的用戶得知問(wèn)題,而忙于其他任務(wù)的用戶也不會(huì)感到突兀织咧。

避免空白狀態(tài)

對(duì)于大部分來(lái)說(shuō)胀葱,從空白開(kāi)始很難,而在別人做好的基礎(chǔ)上開(kāi)始會(huì)簡(jiǎn)單很多笙蒙。因此軟件再提供功能時(shí)抵屿,可以做一些預(yù)設(shè),然后讓用戶根據(jù)自己的需要調(diào)整捅位,避免出現(xiàn)完全空白的狀態(tài)轧葛,讓用戶解決所有的問(wèn)題。多數(shù)情況下艇搀,軟件可以按照過(guò)往經(jīng)驗(yàn)和多數(shù)用戶的偏好做出相應(yīng)假設(shè)尿扯。

Sketch顏色邊距預(yù)設(shè)

區(qū)別命令和設(shè)置

在工具欄上放上快速訪問(wèn)功能的按鈕,把功能配置用戶界面放在菜單中焰雕。配置工具更適合用戶學(xué)習(xí)和配置衷笋,而按鈕則為用戶提供快速簡(jiǎn)單的動(dòng)作。

命令和設(shè)置

隱藏較少使用的功能

對(duì)于會(huì)造成程序嚴(yán)重的視覺(jué)錯(cuò)位或執(zhí)行了不可逆的動(dòng)作的功能要隱藏起來(lái)矩屁。

優(yōu)化響應(yīng)辟宗,容許延遲

產(chǎn)品設(shè)計(jì)的關(guān)鍵一點(diǎn)是要有足夠的響應(yīng)能力爵赵,否則再豐富的視覺(jué)樣式都不會(huì)打動(dòng)人。如果延遲不可避免慢蜓,理想情況下是讓用戶等待時(shí)執(zhí)行其他工作亚再,延遲的進(jìn)程在線下或后臺(tái)進(jìn)行。這時(shí)向用戶明確交代狀態(tài)和進(jìn)度晨抡,以及剩余時(shí)間氛悬,同時(shí)取消機(jī)制在這時(shí)也非常重要。

如經(jīng)典的instagram上傳照片的設(shè)計(jì)耘柱,用戶點(diǎn)擊上傳后無(wú)需等待如捅,并可以繼續(xù)執(zhí)行其他的操作,同時(shí)軟件會(huì)在后臺(tái)完成照片的上傳工作调煎。

instagram

動(dòng)作镜遣、時(shí)間與過(guò)渡

第一臺(tái)把動(dòng)作動(dòng)畫過(guò)渡當(dāng)做用戶體驗(yàn)核心元素的計(jì)算設(shè)備是蘋果的麥金塔電腦,而現(xiàn)在動(dòng)作士袄、動(dòng)畫已經(jīng)成了數(shù)字產(chǎn)品體驗(yàn)不可或缺的關(guān)鍵部分悲关。

由于動(dòng)作是表達(dá)和說(shuō)明對(duì)象之間關(guān)系的強(qiáng)大機(jī)制,因此在移動(dòng)設(shè)備有限的屏幕空間下娄柳,動(dòng)畫的切換幫助用戶創(chuàng)造了一個(gè)強(qiáng)烈的心理模型寓辱,把呈現(xiàn)在視野里的東西與上一個(gè)視圖內(nèi)容聯(lián)系起來(lái)。動(dòng)畫的使用使軟件看起來(lái)是響應(yīng)式的赤拒、沉浸式的秫筏,讓人們忘記屏幕上的彈、捏挎挖、轉(zhuǎn)動(dòng)和滑動(dòng)只是像素提供的物理幻想这敬,拉近人們與數(shù)字世界之間的距離。

動(dòng)畫的設(shè)計(jì)目標(biāo):

1蕉朵,短暫和響應(yīng)崔涂,動(dòng)畫的時(shí)間是程序響應(yīng)用來(lái)完成目標(biāo)的時(shí)間。

2始衅,意義恰當(dāng)堪伍,避免用戶錯(cuò)誤的理解了動(dòng)畫的含義。

2觅闽,盡量模擬真實(shí)世界的物理交互,如彈性涮俄、動(dòng)力蛉拙。

動(dòng)畫

總結(jié)

好的產(chǎn)品不只有所實(shí)現(xiàn)的功能,它更能讓用戶執(zhí)行任務(wù)時(shí)像流水一樣毫不費(fèi)力彻亲,感覺(jué)不到設(shè)計(jì)的存在孕锄。而實(shí)現(xiàn)這樣的流式體驗(yàn)需要精心設(shè)計(jì)符合用戶心理模型的功能布局與過(guò)渡動(dòng)畫吮廉。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市畸肆,隨后出現(xiàn)的幾起案子宦芦,更是在濱河造成了極大的恐慌,老刑警劉巖轴脐,帶你破解...
    沈念sama閱讀 206,602評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件调卑,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡大咱,警方通過(guò)查閱死者的電腦和手機(jī)恬涧,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,442評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)碴巾,“玉大人溯捆,你說(shuō)我怎么就攤上這事∠闷埃” “怎么了提揍?”我有些...
    開(kāi)封第一講書人閱讀 152,878評(píng)論 0 344
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)煮仇。 經(jīng)常有香客問(wèn)我劳跃,道長(zhǎng),這世上最難降的妖魔是什么欺抗? 我笑而不...
    開(kāi)封第一講書人閱讀 55,306評(píng)論 1 279
  • 正文 為了忘掉前任售碳,我火速辦了婚禮,結(jié)果婚禮上绞呈,老公的妹妹穿的比我還像新娘贸人。我一直安慰自己,他們只是感情好佃声,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,330評(píng)論 5 373
  • 文/花漫 我一把揭開(kāi)白布艺智。 她就那樣靜靜地躺著,像睡著了一般圾亏。 火紅的嫁衣襯著肌膚如雪十拣。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書人閱讀 49,071評(píng)論 1 285
  • 那天志鹃,我揣著相機(jī)與錄音夭问,去河邊找鬼。 笑死曹铃,一個(gè)胖子當(dāng)著我的面吹牛缰趋,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 38,382評(píng)論 3 400
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼秘血,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼味抖!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起灰粮,我...
    開(kāi)封第一講書人閱讀 37,006評(píng)論 0 259
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤仔涩,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后粘舟,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體熔脂,經(jīng)...
    沈念sama閱讀 43,512評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,965評(píng)論 2 325
  • 正文 我和宋清朗相戀三年蓖乘,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了锤悄。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,094評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡嘉抒,死狀恐怖零聚,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情些侍,我是刑警寧澤隶症,帶...
    沈念sama閱讀 33,732評(píng)論 4 323
  • 正文 年R本政府宣布,位于F島的核電站岗宣,受9級(jí)特大地震影響蚂会,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜耗式,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,283評(píng)論 3 307
  • 文/蒙蒙 一胁住、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧刊咳,春花似錦彪见、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書人閱讀 30,286評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至跷坝,卻和暖如春酵镜,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背柴钻。 一陣腳步聲響...
    開(kāi)封第一講書人閱讀 31,512評(píng)論 1 262
  • 我被黑心中介騙來(lái)泰國(guó)打工淮韭, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人贴届。 一個(gè)月前我還...
    沈念sama閱讀 45,536評(píng)論 2 354
  • 正文 我出身青樓靠粪,卻偏偏與公主長(zhǎng)得像足丢,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子庇配,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,828評(píng)論 2 345

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 171,512評(píng)論 25 707
  • (是的捞慌!這只是一個(gè)讀書摘錄,里面沒(méi)有一句話是我自己的<砼) 第一部分 研究 第一章 用戶研究 問(wèn)題:如何才能發(fā)現(xiàn)人...
    LEEKAI閱讀 1,416評(píng)論 0 5
  • 一啸澡、Robomongo 連接MongoDB報(bào) Authorization failed。操作步驟:1氮帐、刪除用戶:d...
    法式大面包閱讀 872評(píng)論 0 1
  • 經(jīng)常地會(huì)有錯(cuò)覺(jué)嗅虏。 一閃而過(guò)地,你的身影會(huì)出現(xiàn)上沐。 我很動(dòng)情也很難過(guò)皮服,動(dòng)情地是過(guò)了八年我也沒(méi)把你忘記,難過(guò)地是過(guò)了八年...
    乃生閱讀 266評(píng)論 9 4
  • 我在自愛(ài)力學(xué)習(xí)的群里,課后看到很多人釋放自己的情緒蕴侧,把自己不開(kāi)心的事說(shuō)出來(lái)择同,群友們紛紛幫助梳理和安慰。 每個(gè)人都有...
    林夕楓起閱讀 209評(píng)論 0 0