設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

去宜家買過東西的人,大都會有這樣的體驗:將訂購的傢俱零件從包裝裡面拿出來,花上一下午組裝起來,然後大汗淋漓地坐在沙發上高興地盯著這個看起來平淡無奇的新玩意,然後發上一條朋友圈。

這是「勞動的果實」。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

作為一家成立於1943年的企業,宜家從瑞典走出到家喻戶曉花費了幾十年的時間。從2008年開始,宜家就已經是全球最大的家居零售商了。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

在宜家,傢俱大都需要用戶買回去之後自己組裝起來,這種組裝之後產生的一系列的心理學效應雖然並不只由宜家的產品帶來,但是最終還是因為宜家的名氣,而最終使用它來定名。

人們對於自己所構建起來的東西,會更加看重和著迷,哪怕別人所做的完全一樣的東西,也很難在自己這裡產生情感羈絆。這種完成感和成就感,源自於「向別人發出你有能力」的信號。嚴格意義上來說,這種心理學現象是一種認知偏差,而宜家的創始人 Ingvar Kamprad 正是在這個基礎上構建起宜家的整個家居帝國。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

即使死侍本人也沉迷於這種成就感。

一、宜家的用戶歷程

在宜家的用戶歷程當中,毫無疑問是存在「摩擦」和「障礙」的,但是這種設計是故意為之的。

在宜家的實體店當中,用戶在各種「障礙」的包圍下,按照規劃者的路徑來行動。而購買了產品之後,又可以回家在「摩擦」中享受「自己組裝的樂趣」。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

「每個人在宜家,都經歷著屬於自己的恐怖故事。」

用戶進入宜家之後,會發現自己幾乎只能按照規劃的路徑將所有的地方都逛到。在我看來,宜家這種精心設計的用戶瀏覽路徑是天才的設計,但是對於一部分用戶而言可能會帶來混亂和挫折感。

「瑞典的一家報紙認為,宜家是一種介於土木工程和潛水艇之間的東西,我覺得這種描述很準確。」

二、讓人又愛又恨的說明書

另一方面,雖然宜家的產品組裝起來要費點勁,但是說明書本身的設計並不差。

根據宜家設計師 Jan Fredlund 的說法,說明書每一頁都是在兩個原則之下設計完成的:清晰和連貫。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

1. 清晰

宜家的用戶手冊的設計,從來都是從「用戶測試」這個環節開始的。在此基礎上,他們足以設計出清晰的裝配手冊。

讓用戶來測試安裝,會幫助我們發現潛在出錯的地方。這些錯誤在前期不明顯,但是在安裝後期可能是致命的。——Jan Fredlund

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

2. 連貫

宜家的說明書中的插畫,是完全從用戶的視覺角度來繪製的,完全3D建模,從頭到尾完全按照順序來製作的。這樣避免了用戶在裝配過程中出錯。

三、依然存在問題

工具和組件都逐個列舉了出來,每個步驟都獨立了出來,清晰的線條勾勒出操作的細節,因為沒有多餘的文字說明,所以全世界各地的用戶應該都能看懂其中的示意。

整個說明書已經做的足夠條理清晰,其中的同理心和邏輯性幾乎達到了令人難以置信的程度。儘管如此,面對沒有文字的純指示性的說明,依然有用戶感到困惑不能理解。

撇開網上的吐槽和玩笑,對於這個狀況,我開始提出問題:

對於一個設計得已經比較清晰的系統,依然有人為之感到困惑,那麼要怎樣設計得更清晰一些呢?

四、調研

1. 與用戶交流,量化問題

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

我創建了一個問卷,包含三個問題,然後在線隨機發給了40個人。前兩個問題分別是:

  • 「你以前有沒有用過需要組裝的組合傢俱?」
  • 「你有沒有購買過或者組裝過宜家的產品?」

這兩個問題只需要簡單的「是/否」來確定,並且這兩個問題是我用來確認這些用戶是否有過相關經驗,如果有,我才會發送第三個問題:

  • 「按照宜家的家居說明書來裝配,對你而言有多容易?」

第三個問題包含5個不同的選項,從「非常清晰」到「非常困難」劃分了5個等級。事實上,我隨機選取的樣本當彙總,絕大多數的用戶在按照裝配說明書的要求裝配的時候,遭遇了相當的困難,或者感到了混亂。

2. 定性分析

在調研的過程中,我通常在獲得答案之後,會更進一步採訪用戶。

通過誘導,我開始瞭解到他們各自的經歷,而之前我所想知道的問題,在這裡得到了某種意義上的驗證:

我把所有的東西差不多都組合到了一起。最初我認為最糟糕的情況是缺少一些組件,甚至會漏掉重要的大部件,實際的情況是,我為了組合這個包含收納箱的床,花費了整整一天時間,中間經歷了好幾百萬個步驟。

很多回答和這個差不多。訪談中透露了一個事實,那就是絕大多數用戶其實根本不知道完成裝配要多長時間,需要多少步驟,他們壓根一點準備都沒有。正如同他們所說的,通常他們會在這個事情上,耗費一整天時間。

週末我把宜家買的傢俱組裝了起來,按照說明來做的,比其他的同類組裝傢俱要方便不少。

我想我可能是個怪人,我非常喜歡組裝宜家的傢俱!我發現他們的傢俱組裝說明書非常明確,並且非常喜歡這個過程。

訪談過程中我還發現,有過組裝宜家和其他同類的組合傢俱經驗的用戶,對於說明書和產品本身有相對明確的預期,對於注意事項也更加了解,對於整個組裝流程的理解也更加深入。

五、宜家是怎麼解決用戶的這個問題?

為更多人創造更美好的日常生活——宜家的使命宣言

宜家的業務看起來很簡單——為用戶提供更加經濟實惠的傢俱。但是他們真實的目標其實更高,要為用戶提供可持續性的、功能性強的高品質傢俱,不是為少數人,而是為所有人。

可是,如果用戶連裝配的問題都解決不了,就更談不上使用了。所以宜家也在儘量解決這個問題。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

2017年9月,宜家收購了 TaskRabbit ,希望以此為跳板,提升傢俱裝配服務。

可是問題在於,將用戶自己裝配從宜家產品中移除,是不是也會同時降低用戶和傢俱之間的情感聯繫,將「宜家效應」徹底從產品中去掉?

六、為宜家的APP改版

這個項目並不是宜家的官方項目,而是一個我自己創建的項目,作為我在 Codaisseur 設計學院的個人項目和作業。

基於我的採訪的樣本和調研,我最終梳理出來下面這張價值主張的圖:

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

解決方案從桌面端的信息架構開始做。線框圖則是從宜家官方網站開始,按照搜索 – 購買的流程來梳理。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

我的解決方案主要從3個不同的領域入手。

1. 切換

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

切換的功能其實並不複雜,它是一個功能切換的按鈕。在搜索結果頁面當中,用戶點擊了「切換」按鈕,每個產品底部的「購買」按鈕就會變成「教你組裝」按鈕。

其實,選擇從這個地方入手,有一個非常重要的原因,那就是用戶。當我在梳理流程的早期階段,注意到宜家網站上的一個重要的數據:

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

網站首頁的瀏覽量高達21億。而搜索引擎又是用戶獲取信息的主要入口,因此我相信在宜家的首頁上應用這個設計會是比較合理地優化。如果在後期能夠蒐集數據,並不斷迭代這一功能,應該能帶來更好的效果。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

這個圖標的設計,來自於宜家的說明書,說明書中所繪製的「助手」這一角色,而這一設計也算是向傳統內容媒介的一個回應和致敬。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

2. 播放器

播放器的設計成敗直接影響到整個解決方案的效果。需要考慮到的因素非常之多:

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

移動端快速預覽的功能;

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

桌面端和移動端的縮略圖,搜索和過濾的早期草圖:

  • 如何以視頻的方式來呈現內容,又同時清楚地向用戶表明這不是傳統的視頻教程呢?
  • 如何在 UI當中向用戶反映當前的步驟、上一步和下一步呢?步驟之間的過渡是什麼樣的?
  • 如何讓用戶瞭解到到底有多少步驟呢?用麵包屑可以嗎?

用戶訪談中所凸顯的問題:

我在宜家所作的最後的嘗試是一款木質高腳凳。我開始以為這個2英尺高的高腳凳很好處理,誰知道到手之後太過於零碎,說明書也看不太明白。

為什麼你覺得說明書的指示不夠明確?

我很想跳過開頭檢查手頭全部零件的部分,但是跳過之後就很難按照順序來操作了,到後面我就忍不住即興發揮了,最後就沒法做出來。

通過這些訪談,簡單的講,我就是讓說明書製作成易於消化的短動畫,通過特定的播放器循環播放。這樣用戶會更容易確知怎麼操作,以及他們做到了什麼程度,以及具體要做什麼。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

在這個階段,使用原型來進行可用性測試之後,得到了不少反饋,其中最重要的一個反饋,是前一步和後一步的短視頻都使用縮略圖的形式展現,而不是不能預覽的模式。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

檢查工具和配件,確保沒有缺損,用戶可以正確裝配。所有的這些都應該包含在視頻當中,這些對應的是傳統紙質的宜家說明書中的檢查的部分。

為什麼不做簡單的完整視頻教程?

當我查看教程的時候,必須全程注意屏幕內容,暫停視頻,再返回操作,再看視頻,這樣太容易分心了,很容易錯過一些步驟,如果沒有適時的暫停,還得倒回去看……

相反,製作成易於消化的短動畫,一個步驟一個步驟地瀏覽,用戶更容易掌控,這是更合理的補救措施。

3. 播放控件

當然,我的這些都還只是視覺稿,並未通過開發落地。

整個設計方案最後的環節,是使用類似動畫的教程模式,教授用戶如何正確裝配傢俱的功能。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

傢俱到貨之後,用戶可以在 APP 的搜索欄當中,快速點選條形碼掃描按鈕,掃描條形碼,定位到產品頁面,通過切換按鈕,觸發教程模式。

它的核心是讓用戶通過 UI控件點擊切換步驟,或者使用語音指令,諸如「上一步」和「下一步」來快速切換步驟。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

在可用性測試中發現,通過移動端設備來呈現的動畫教程,比起帶縮略圖的視頻要更加方便。最初我還構思過更加複雜的方案,比如通過 APP 將教程投射到電視或者桌面端上來瀏覽,後來發現這樣太複雜了。

設計實戰!怎麼改版才能讓宜家產品的用戶體驗更好?

參與測試的人員,還提出使用手勢交互可以更快切換。你可以戳這裡試試桌面端的高保真原型。

七、反思

在整個項目當中,最重要的經驗是「任何設計方案都不可能做到全部的事情,優先級很重要。」當我開始策劃解決方案的時候,一瞬間有很多想法,但是真正落地能做的事情始終有限。

這是有必要的嗎?必須的還是可能的?這個方案是用來解決問題的,還是單純的看起來很酷?

儘可能少的修改來解決問題,高效,有效,這可能是更好的。


分享到:


相關文章: