BAT云盤體驗(yàn)報告先行篇——表現(xiàn)層

0 評論 7140 瀏覽 20 收藏 17 分鐘

編輯導(dǎo)讀:市面上的云盤應(yīng)用層出不窮,也有很多人都在用云盤,云盤在一定程度上大大的方便了我們的工作;云盤除了功能性以外,在交互設(shè)計(jì)上也要著重注意用戶體驗(yàn);本文作者分享了關(guān)于BAT三家云盤的體驗(yàn)報告,我們一起來看一下。

信息爆炸的今天,云盤是眾多馬(下)來(以后再看)人的心頭好。

班門弄斧分析一下百度、阿里、騰訊三家云盤的體驗(yàn)。

體驗(yàn)環(huán)境:iphone XR 跟隨系統(tǒng)暗黑模式。

首先,明確使用場景,云盤的核心功能是資料存儲,聯(lián)系現(xiàn)實(shí)場景體驗(yàn):多、雜亂、無序(假裝這里有情緒板)。

所以,好的云盤體驗(yàn)第一要求是整潔有序,即統(tǒng)一性,這里請出兩大法寶:

  • 版式設(shè)計(jì)的四大基本原則:對齊、對比、親密、重復(fù);
  • 奧卡姆剃刀原理:如無必要,勿增實(shí)體(這都是很基礎(chǔ)常見的設(shè)計(jì)原理,但正是因?yàn)樵票P的屬性,越基礎(chǔ)就越重要?。?/li>

視覺層面的大約在第三篇分析,這里先mark一下,百度云盤個人頁面的線形圖標(biāo),和阿里云盤fluent design深得我心。

一、痛點(diǎn)1:選擇

先引用專利鎮(zhèn)樓(生態(tài)學(xué)研究生寫論文啥也不學(xué)就學(xué)會引用了,轉(zhuǎn)行UX,下次用生態(tài)學(xué)理論寫一篇分析吧。)

「背景技術(shù):復(fù)選框本身技術(shù)含量不高,但基于傳統(tǒng)的操作方法,用戶在批量選擇數(shù)據(jù)時,必須手動逐個選擇,整個過程過于繁瑣,工作效率較低。」

云盤作為「文件備份、分享、同步工具」(百度云盤定義),根據(jù)交互設(shè)計(jì)三要素——目標(biāo)、任務(wù)、行為。

選取目標(biāo)是進(jìn)行操作的第一步,但是BAT三家云盤在列表中均采用點(diǎn)擊選取,即單次點(diǎn)擊選取或取消,但騰訊微云在切換成縮略圖展示后,可以進(jìn)行滑動多選,不是很明白為什么在默認(rèn)列表顯示中不使用滑動多選。

建議:直接顯示選擇圈或長按選擇,滑動多選;在iPhone自帶照片選取可以滑動多選或取消,iPhone點(diǎn)擊右上角選擇文字,(短快)點(diǎn)擊進(jìn)行單次選擇,滑動進(jìn)行批量選擇,長按放大。

菲茲定律的核心應(yīng)用:

  • 降低操作復(fù)雜度——通過改變對象的尺寸;
  • 提高效率——改變對象距離光標(biāo)的位置;

上圖均為百度云盤

二、痛點(diǎn)2:排序展示

上圖百度云盤的排序是在三個點(diǎn)(一般代表更多,屬于較弱的圖標(biāo)),還出現(xiàn)了選擇文件的選擇,不屬于一個信息層,而且界面已經(jīng)提供了表示可選擇的小圈。

建議:【選擇文件】這一項(xiàng)完全可以省略。

百度只有列表一個視圖展示,一屏幕是十個文件,騰訊微云列表是九個文件,縮略圖是最多是十二個,但從視覺上有些擁擠了;且切換視圖后,搜索欄自動上移,是否是為了留出更多文件展示空間。

但值得注意的是,排序的圖標(biāo)也隨之上移,是否會讓用戶產(chǎn)生迷茫的體驗(yàn),建議:搜索欄應(yīng)停留在原位。

排序方面:

上圖均為騰訊微云

阿里云盤啟動進(jìn)入后是“文件”界面,而不是“首頁”這里不知道是主動引導(dǎo)用戶,還是設(shè)置出了問題,暫且不提。

但在文件界面,排序按鈕放在左上角,選擇菜單是從左下角出現(xiàn),也就是說用戶視線要來回切換,騰訊微云也是一樣的問題;而阿里云盤較大的問題在于設(shè)置了從高到低/從低到高,那選擇菜單命名就可以是【修改時間】【創(chuàng)建時間】減少理解時間。

而右上角視圖和選擇按鈕很小,給人一種不想點(diǎn)擊的感覺,且阿里云盤,列表和縮略圖每屏均是十個,就功能而言設(shè)置切換視圖似乎可有可無。

上圖均為阿里云盤

三、痛點(diǎn)3:反饋

交互設(shè)計(jì)三個基本要求是:

  • 操作前可以預(yù)知;
  • 操作中有反饋;
  • 操作后可撤銷;

三個云盤均有移動文件到另一個文件夾到操作,但百度云盤和阿里云盤在操作中會有進(jìn)度條反饋;但無法取消,移動后均無操作提示可撤銷。

阿里云盤(下圖)在文件和照片頁面缺乏滑動塊,且右側(cè)滾動進(jìn)度條無法調(diào)整位置。

阿里云盤和騰訊微云都采用了舵式導(dǎo)航,個人認(rèn)為在破壞導(dǎo)航欄流暢體驗(yàn)和懸浮+按鈕破壞界面整體,兩害取其輕,舵式確實(shí)較好(也許今后會有更好的解決辦法也說不定)。

但阿里云盤舵式功能僅為新建,主要應(yīng)用于文件界面,而如果在其他界面新建,會有非模彈窗提示;但仍會留在原有頁面,騰訊微云則直接進(jìn)入文件,這點(diǎn)可能更好。

左側(cè)兩圖為阿里云盤,右側(cè)兩圖為騰訊微云

1. 吐槽

騰訊微云(下圖)一打開界面,這個彈窗和之后每個界面都有的提示,并沒有讓我有一絲絲想要充會員的感受;雖然營銷的本質(zhì)是恐懼和貪婪,但是云盤的產(chǎn)品體驗(yàn)?zāi)艿讲皇强煽亢陀斜U蠁幔?/p>

畢竟眾多轉(zhuǎn)存的文件中也有重要文件,給用戶焦慮感實(shí)在不是明智的做法。

百度云盤首頁照片故事個人非常不建議,因?yàn)樵票P有時需要在工作場合使用,而手機(jī)上自動上傳會有很多生活照,在工作場合打開有一種非常不專業(yè)的體驗(yàn)(如果照片比較難看,自己看也想馬上退出)。

建議:【照片故事】和【最近】調(diào)換一下順序,露出1/2可能會更好。

這里再提一下場景,百度云盤和阿里云盤都提供免費(fèi)的保險文件(需要輸入密碼才能查看)、(騰訊微云需要開通會員,在我的界面中);這對應(yīng)現(xiàn)實(shí)場景,就是保險箱了吧,但是,誰家會把保險箱放在最醒目的位置呢?和設(shè)計(jì)此功能要給予用戶隱私保密的體驗(yàn)是不是想違背呢?

個人建議,常規(guī)可以放在我的界面,非常規(guī)可以嘗試在文件頁面下拉到底彈出保險箱(拉一下就松是刷新)。

四、體驗(yàn)分好壞,交互有對錯

大佬,我覺得你錯了!

百度云盤是三者中資歷最深的云盤了,目前是11.3.1的版本,同時也是app store效率應(yīng)用第一(也是我充會員最多的云盤);在做出版本優(yōu)化時必然會考慮諸多問題,但在最簡單也最基礎(chǔ)的問題即刻便能處理,別忘了馬蹄釘?shù)墓适隆?/p>

1. Baidu

百度云盤標(biāo)簽欄一共五個一級頁面(這里再mark一下,標(biāo)簽欄小圖標(biāo)畫的真的牛!其實(shí)中間的信息提示和個人信息的小皇冠已經(jīng)有點(diǎn)貼邊了,但是不論是黑色主題還是白色主題,都不會感覺很擠;雖然我一直不是很能理解什么是呼吸感,這大約就是了,不生硬,good!但是其他部分小圖標(biāo)的使用簡直是重災(zāi)區(qū),有點(diǎn)難過。)

(再M(fèi)ark一下,百度云盤在標(biāo)簽欄用用共享,發(fā)現(xiàn)兩項(xiàng)展示互聯(lián)社交屬性,共享部分的信息架構(gòu)個人體驗(yàn)一般,在下一篇結(jié)構(gòu)層的報告中詳寫;戰(zhàn)略層面咱也不太懂,也不太會寫,就在這說一說:是不是和微信搜一搜(連接萬物)的戰(zhàn)略布局有點(diǎn)相似呢?但講道理“功能型”和“信息型”產(chǎn)品本身似乎兼容性并不好。)

But,請看看各個一級頁面的導(dǎo)航欄:

且不說黑色模式下左邊搜索框和圖標(biāo)離左邊距視覺距離不一樣(白色模式下,圖標(biāo)下墊了一層磨砂效果,距離會統(tǒng)一;但是白底黑線的圖標(biāo)何必墊底呢?沒有強(qiáng)化對比的硬性需求,剃刀出現(xiàn)!是否可以不用)。

要說的是,問題來了:

問題一:對齊!

分享頁面“分享”文字是左對齊,而共享頁面“共享”是中間對齊(這個問題騰訊和阿里都是左對齊)。

圖標(biāo)大小不一致,左側(cè)是首頁的傳輸圖標(biāo),右側(cè)是文件頁面的傳輸圖標(biāo),雖然文件頁面有三個圖標(biāo),但左側(cè)有多余空間,沒必要縮小圖標(biāo)。

在不同頁面,同一圖標(biāo)同一位置,有助于用戶習(xí)慣的養(yǎng)成,同時降低用戶認(rèn)知成本;同一大小和風(fēng)格不僅是在視覺層面表達(dá)出嚴(yán)謹(jǐn)統(tǒng)一,更是體現(xiàn)出整齊的產(chǎn)品調(diào)性,即產(chǎn)品體驗(yàn)設(shè)計(jì)就是為產(chǎn)品定義風(fēng)格(原句不知道出自哪里,個人十分認(rèn)同)。

問題二:對比!

圖標(biāo)的意義在于用圖案代替文字,除非圖標(biāo)能準(zhǔn)確使得用戶理解含義,但顯然,并沒有;比如這個小飛機(jī)的圖標(biāo),我點(diǎn)進(jìn)去之前從未想過是二級界面是網(wǎng)盤小飛機(jī);而且這個界面,還是個小程序,返回鍵還在右上角,分享還是豎著的三個點(diǎn),關(guān)鍵是百度云盤系統(tǒng)也沒有其他的小程序提供啊,是為了給微信小程序宣傳嗎?!

(現(xiàn)在絕大多數(shù)app二級頁面返回鍵都在左上角,而且其他二級頁面返回也是左上角,Plus:我個人非常喜歡右滑返回上個界面。)

統(tǒng)一性在哪里!不知道小飛機(jī)用戶點(diǎn)擊率后臺AAARR數(shù)據(jù)怎么樣,一般般的話(不要你覺得,我要我覺得:應(yīng)該一般般),剃刀快來!

同理,這個沒對齊咱們先不說,就是這兩個人物圖標(biāo),進(jìn)入的是不同的界面,但是僅僅款式不一樣,線段粗線不一樣(這真的是視覺設(shè)計(jì)問題,視覺統(tǒng)一性在哪里?。蛔阋詷?gòu)成用戶認(rèn)知的區(qū)別,同時很可能會產(chǎn)生疑惑,同時,這個四段豎線的圖標(biāo)的確可以表示音頻播放,但和人物放在一起,真的不像排行榜嗎?【格式塔原理】

2. Ali

阿里云盤真是長在我審美點(diǎn)上的界面!粉Fluent Design已經(jīng)很久了,奈何沒太多大量運(yùn)用的app,阿里云用實(shí)力證明了自己!(fluent design組件可以了解一下)。

五、腦洞時刻

選擇是云盤操作的核心步驟,引導(dǎo)用戶點(diǎn)擊左上角選擇再移動到文件,再依次選擇(一般全選也很少用到),光點(diǎn)擊這一操作就延長了時間,長按加滑動是最具效率的選擇;但考慮到新用戶的使用習(xí)慣未建立,可視化的選擇圈是很好的選擇。

個人不成熟的建議在一個文件上同時加上太多交互,比如長按和點(diǎn)擊沒必要導(dǎo)向不同的結(jié)果,(都指向選中),查看詳情考慮用雙擊(和web使用習(xí)慣相似),圖片放大則考慮雙指縮放(這個騰訊微云在照片欄有設(shè)計(jì);但個人認(rèn)為應(yīng)該先選中再縮放,整體視圖雙指縮放意義不大,不是用選擇卡選擇大中小視圖)。

把最大的腦洞放在這里,因?yàn)樯鷳B(tài)學(xué)轉(zhuǎn)行設(shè)計(jì)師,我一直在考慮功能的用進(jìn)廢退;不知道有沒有哪位同行考慮過,能不能統(tǒng)計(jì)某一客戶使用情況,為其提供動態(tài)頁面、小例子。

比如,使用時間長了,文件按鈕可以換成圖標(biāo)按鈕、常用功能保留,也可以自定義圖標(biāo);不常用功能不定期推薦一到兩個,實(shí)在不使用就從這位用戶的界面刪除,實(shí)現(xiàn)方面可能桌面端會更好實(shí)現(xiàn)一點(diǎn);辦公類或則adobe全家桶都可以試試,通過統(tǒng)計(jì)群體最常用功能,方便推出web應(yīng)用。

(個人認(rèn)為隨著網(wǎng)絡(luò)技術(shù)發(fā)展,web應(yīng)用不限制操作系統(tǒng)、平臺;即用、不占用內(nèi)存的屬性更符合萬物互聯(lián)的趨勢,這個是個人感受,不做任何參考。)

 

本文由 @兌 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自 Unsplash,基于CC0協(xié)議。

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發(fā)揮!