用ZARA的優(yōu)化案例,教你學(xué)會(huì)把「設(shè)計(jì)思維」運(yùn)用到實(shí)戰(zhàn)過程中!

2017-4-19    周周

 

如果您想訂閱本博客內(nèi)容,每天自動(dòng)發(fā)到您的郵箱中, 請點(diǎn)這里

沒看錯(cuò),就是你們熟悉的那個(gè)服裝品牌 Zara,這篇文章作者 William Ng 運(yùn)用了「設(shè)計(jì)思維 」的模式,分析了 Zara手機(jī)應(yīng)用的可用性,并提出了改進(jìn)建議。算是對(duì)設(shè)計(jì)思維的具體案例運(yùn)用。

Zara 是我最愛的服裝品牌之一。但每次使用他們的軟件,我都感覺有各種問題。所以我做了一個(gè) Zara 的可用性測試與分析,來看看是不是別的用戶也和我一樣有同樣的煩惱。結(jié)果我發(fā)現(xiàn)了許多用戶痛點(diǎn),并提出了一些提升用戶體驗(yàn)的方案。

共情

用戶畫像

第一步,我對(duì) Zara 的用戶進(jìn)行了在線調(diào)查。然后我創(chuàng)建了一組預(yù)估的用戶畫像,并包含了假設(shè)的最大一組用戶群:20 – 30 歲左右的中產(chǎn)收入工作者。

△  工作故事

除了用戶畫像以外,我也花了一些時(shí)間了解用戶使用應(yīng)用的場景,從而更深入探究他們的動(dòng)機(jī)和期待的結(jié)果。

可用性測試

對(duì)用戶有了一點(diǎn)了解之后,我去商場找了一個(gè)逛街的人進(jìn)行可用性突擊測試。我在給用戶做測試之前,保證了用戶至少是頻繁的在線購物消費(fèi)者。最終,我測試了七個(gè)用戶。

每個(gè)用戶都被問到想象自己在一個(gè)場景里面,進(jìn)行以下任務(wù):

  • 最近天氣很冷,你在給自己找一件冬大衣,你會(huì)怎么做?
  • 你看到了一件你可能會(huì)喜歡的大衣,可以跟我重現(xiàn)一下你會(huì)怎么決定這是不是你要的那件大衣?
  • 你把大衣放進(jìn)了購物車,但發(fā)現(xiàn)尺碼錯(cuò)了,你會(huì)怎么做?

定義和分析

親和圖

我瀏覽了所有測試,并仔細(xì)地把每個(gè)用戶遇到的問題和抱怨都列了出來。接下來,我通過分類把這些痛點(diǎn)進(jìn)行了分類和歸組。

2 * 2 分析

為了排定這些信息的優(yōu)先級(jí),我創(chuàng)建了一個(gè) 2*2 的圖表,以對(duì)商業(yè)重要性作為 X 軸,對(duì)用戶的重要性作為 Y 軸來排列這些信息。假設(shè)最重要的商業(yè)模板是增加應(yīng)用的收入,那么在購物車?yán)锞庉嫍l目就成為了對(duì)商業(yè)和用戶都是最重要的一點(diǎn)。所以這也成為我重新設(shè)計(jì)的著眼點(diǎn)。

定義問題

我仔細(xì)分析了用戶與購物車有關(guān)的行為和模式,以便找到更好的解決方案。

當(dāng)他們試圖在購物車?yán)锞庉嬌唐返臅r(shí)候:

  • 只有 1/7 的人沒有遇到問題
  • 7人中 6 人都點(diǎn)了該商品條目,但只跳出來一個(gè)圖片
  • 7 人中 4 人選擇了向左滑動(dòng)商品,卻沒有出現(xiàn)預(yù)期的編輯選項(xiàng)
  • 7 人中 2 人不小心刪除了他們的商品

其他問題:

  • 不能在購物車?yán)镏苯泳庉嬌唐返念伾统叽?,也就是說用戶必須再瀏覽一遍商品來修改商品信息
  • 在購物車?yán)镉脩糁荒芸吹缴唐返膯螐垐D片

方案和改造

低保真手繪

在研究了用戶的購物車使用過程中遇到的問題之后,我列出了一些針對(duì)痛點(diǎn)的潛在解決方案,并使用手繪的低保真原型來表達(dá)。

△  高保真原型

在把低保真手繪轉(zhuǎn)為高保真原型之前,我讓一些在線購物用戶走了一遍我的流程來驗(yàn)證想法,并收到了一些建設(shè)性意見,我把這些意見融入了最終的設(shè)計(jì)里。

以下是我的一些建議:

新的編輯按鈕替換了舊的「之后再買 」; 但這是個(gè)有意的選擇. 最開始,當(dāng)用戶想把一個(gè)商品保存以供以后查看的時(shí)候, 他們只能先把商品放進(jìn)購物車.所以我會(huì)在瀏覽頁面加一個(gè)「收藏 」功能,這樣用戶想收藏的時(shí)候不用先把商品放進(jìn)購物車。

在購物車頁面添加了垂直的圖片組,這樣用戶可以查看商品的多張圖片。在最開始的用戶測試中,用戶傾向于水平滑動(dòng)去瀏覽更多的商品圖片。所以,我增加了更多的元素來引導(dǎo)用戶進(jìn)行正確的操作。

原型

想像一下你已經(jīng)把商品選好放進(jìn)了購物車,這時(shí)候才發(fā)現(xiàn)需要修改尺寸……

試試我做的原型吧。

驗(yàn)證

我把自己設(shè)計(jì)的原型拿給七個(gè)用戶進(jìn)行測試,目標(biāo)也是讓他們在購物車?yán)镞M(jìn)行商品尺寸和數(shù)量的修改。所有用戶都順利地完成了任務(wù)。

作為重新設(shè)計(jì)的結(jié)果,用戶在購物車?yán)镄薷纳唐沸畔⒌某晒β侍嵘?30%。

總結(jié)

通過用戶可用性的突擊測試,我了解到用戶對(duì)于修改已放入購物車的商品信息存在很大困難。另外,一般的購物應(yīng)用都會(huì)有的功能(比如查看商品更多圖片或是修改商品尺寸)在 Zara 應(yīng)用內(nèi)缺失。我的設(shè)計(jì)讓用戶可以在結(jié)賬的時(shí)候更加方便地修改信息。增強(qiáng)用戶體驗(yàn)意味著減少用戶摩擦,也就意味著帶來銷量上的提升。

感謝閱讀!

藍(lán)藍(lán)設(shè)計(jì)m.820esy.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)

 

分享本文至:

日歷

鏈接

個(gè)人資料

存檔