MUJI APP的產(chǎn)品設(shè)計(jì)延續(xù)了MUJI品牌一貫的簡(jiǎn)約風(fēng)格。各個(gè)主要功能模塊均秉承了簡(jiǎn)單易用的思路，同時(shí)在細(xì)節(jié)的交互上不乏亮點(diǎn)。

一、體驗(yàn)環(huán)境

• 體驗(yàn)產(chǎn)品：MUJI passport 1.0.4
• 設(shè)備型號(hào)：ipone 5C
• 系統(tǒng)環(huán)境：iOS 8.4.1

二、需求分析

其實(shí)互聯(lián)網(wǎng)發(fā)展到今天，早已經(jīng)不是新鮮的概念。上至國(guó)際頂級(jí)奢侈品，下到火車站旁的服裝檔口，幾乎所有的服裝零售業(yè)都已經(jīng)直接或間接的參與到其中。然而對(duì)于大多數(shù)傳統(tǒng)的服裝零售業(yè)來說，他們對(duì)于互聯(lián)網(wǎng)的還僅僅還停留在“網(wǎng)上開個(gè)店，能賣更多”的印象中。

絕大多數(shù)“觸網(wǎng)”的服裝零售業(yè)品牌都沒有深入的思考如何處理互聯(lián)網(wǎng)與實(shí)體的關(guān)系，以及如何利用互聯(lián)網(wǎng)來倍增原有的優(yōu)勢(shì)，在殘酷的互聯(lián)網(wǎng)搏殺中脫穎而出。

MUJI可以說是進(jìn)行了深入思考的“少數(shù)派”。

基于以上來分析，MUJI的商品在拼價(jià)格、拼款式的電子商務(wù)市場(chǎng)很難有大的作為，做一款以網(wǎng)銷為目的的APP其實(shí)意義不大。而MUJI的實(shí)體銷售能力很強(qiáng)，用戶身臨高端大氣上檔次的實(shí)體店、享受體貼高效的店員服務(wù)并觸摸到質(zhì)感超群的商品時(shí)，往往會(huì)抑制不住買買買的沖動(dòng)。所以正確的打開方式應(yīng)該是圍繞實(shí)體店銷售來做文章，由此梳理出APP的核心需求是：吸引用戶、協(xié)助到店、促進(jìn)銷售和培養(yǎng)品牌忠誠(chéng)度。

三、用戶分析

1、目標(biāo)用戶：

對(duì)MUJI品牌有一定了解或并對(duì)生活品質(zhì)有一定追求的文藝青年、小資和事業(yè)有成的中年人群。

2、用戶需求：

• 了解商品信息或折扣信息，看看有沒有合適的；
• 獲取實(shí)體店位置，預(yù)備需要的時(shí)候去購(gòu)物；
• 沒事或經(jīng)過的時(shí)候閑逛一下；
• 希望買東西的時(shí)候可以有點(diǎn)優(yōu)惠。

3、使用場(chǎng)景：

店外閱讀產(chǎn)品或折扣信息，經(jīng)過或閑逛的時(shí)候簽個(gè)到累積點(diǎn)里程，買東西的時(shí)候拿出來刷一下獲取里程。

四、APP框架

從APP架構(gòu)可以看出，APP的整體風(fēng)格如MUJI的設(shè)計(jì)一樣比較簡(jiǎn)約。下方的主導(dǎo)航欄只放了5個(gè)最主要的功能模塊，完全聚焦在4個(gè)核心的需求范圍內(nèi)。而大量的被歸為次要的功能都被隱藏到了漢堡菜單中，非常符合簡(jiǎn)約至上的產(chǎn)品設(shè)計(jì)思路。同時(shí)5個(gè)導(dǎo)航欄目也不多不少，恰到好處。

但個(gè)人覺得，優(yōu)惠信息應(yīng)該集成到良品力薦，且應(yīng)優(yōu)先展示，即使優(yōu)惠信息可能不是一直都有。因?yàn)橛脩敉P(guān)心有沒有什么產(chǎn)品正在打折，其次才是有什么新產(chǎn)品上市。在這點(diǎn)上天貓旗艦店就做的比較到位，進(jìn)去就是斗大的“SALE”，占了滿滿一屛……

此外，我覺得非常有意思的一點(diǎn)是，APP啟動(dòng)后最先到達(dá)的界面不是第一個(gè)導(dǎo)航欄“良品力薦”，而是最后一個(gè)導(dǎo)航欄“passport”。這應(yīng)該由于這個(gè)功能使用頻次很高，用戶總是希望能夠了解目前已經(jīng)積累了多少積分。但是，用戶每次卻只會(huì)停留非常短暫的時(shí)間，因?yàn)楣δ軐?shí)在過于單一。所以導(dǎo)航被排列到了最后一個(gè)，但是卻在啟動(dòng)后第一個(gè)顯示。

1、各模塊介紹

（1）啟動(dòng)

啟動(dòng)頁僅為主色+logo的靜態(tài)組合，一如整個(gè)APP的設(shè)計(jì)風(fēng)格，顯得寧?kù)o淡雅。

啟動(dòng)之后會(huì)首先彈出一個(gè)“重要通知”界面，主要提示用戶更換手機(jī)會(huì)失去相關(guān)信息，建議用戶將信息拷貝到郵箱。這應(yīng)該是因?yàn)橄嚓P(guān)數(shù)據(jù)都存儲(chǔ)到了手機(jī)本地，而沒有與賬號(hào)進(jìn)行關(guān)聯(lián)，實(shí)現(xiàn)云端存儲(chǔ)。

另外， “重要通知”界面在每次APP啟動(dòng)時(shí)都會(huì)彈出，非常影響用戶體驗(yàn)。建議增加拒絕按鈕，用戶點(diǎn)擊后就不再?gòu)棾鎏崾?，如“我知道了”、“不再顯示”之類。

（2）良品力薦

以產(chǎn)品列表的形式展示了推薦商品的相關(guān)信息，包含產(chǎn)品圖片、產(chǎn)品參數(shù)和產(chǎn)品介紹，同時(shí)可點(diǎn)擊收藏商品。商品使用了非常精美的配圖，同時(shí)上下滑動(dòng)時(shí)采用了跳躍式的呈現(xiàn)方式，保證每屏均能呈現(xiàn)一個(gè)完整的產(chǎn)品信息，視覺效果較好。

點(diǎn)擊商品圖片或名稱可進(jìn)入到商品詳情界面，但操作提示不明顯。特別是商品詳情界面的首屏內(nèi)容居然與商品列表一模一樣，只是第二屏多出了尺寸選擇、顏色選擇和通過網(wǎng)絡(luò)商城購(gòu)入三個(gè)項(xiàng)目。這樣一來，用戶甚至有可能不知道界面已經(jīng)發(fā)生了跳轉(zhuǎn)（我頭幾次進(jìn)入時(shí)就是這樣）。而且，在實(shí)際進(jìn)入購(gòu)買流程之前就讓用戶選擇尺寸是非常沒有道理的。因此建議將顏色選擇和購(gòu)買跳轉(zhuǎn)按鈕集成到商品列表，顏色選擇可以直接在商品圖片下方提供色塊切換，這樣可以方便觀察商品不同顏色時(shí)的外觀效果，購(gòu)買跳轉(zhuǎn)按鈕可以酌情弱化，畢竟這屬于APP之外的功能，權(quán)重不高。

此外，點(diǎn)擊“通過商城購(gòu)買”是跳轉(zhuǎn)到官網(wǎng)，而不是更為能被普通網(wǎng)友接受的天貓旗艦店。這應(yīng)該也是因?yàn)榫€上銷售不是主要需求，而基于品宣角度做出的安排。

（3）搜索

分為搜索商品和搜索店鋪兩個(gè)子版塊。

商品搜索從上到下分別是搜索欄和商品類型選擇。用戶可以直接搜索所有類型，或者通過三級(jí)分類菜單實(shí)現(xiàn)精確搜索。同時(shí)，點(diǎn)擊最后一級(jí)分類菜單可以直接呈現(xiàn)對(duì)應(yīng)的產(chǎn)品列表，整個(gè)流程比較流暢。

同時(shí)，搜索欄右側(cè)有一個(gè)小的掃碼按鈕。用戶點(diǎn)擊后可以掃描店內(nèi)商品的標(biāo)簽跳轉(zhuǎn)到商品詳情界面，方便用戶查看更多的介紹和進(jìn)行收藏。這塊建議不要放在搜索板塊，因?yàn)閺氖褂脠?chǎng)景來說，用戶使用搜索功能時(shí)一般都是在店外。在店內(nèi)尋找產(chǎn)品時(shí)，用戶會(huì)更加傾向自己去逛（實(shí)體店真的不大），而掃碼則必須要在店內(nèi)才能實(shí)現(xiàn)。建議將掃碼按鈕放到收藏板塊處，使用場(chǎng)景是用戶在實(shí)體店看到心儀的商品，但可能暫時(shí)不方便購(gòu)買，因此通過掃碼的方式進(jìn)行收藏，提示自己下次購(gòu)買。

店鋪搜索從上到下分別是搜索框、地圖、附近店鋪和按地區(qū)搜索。主要用途是讓用戶找到實(shí)體店的位置。

搜索欄沒有做模糊搜索功能，必須精確輸入店鋪名稱，搜索“無印良品”都找不到結(jié)果,而且未搜索到結(jié)果的提示界面也比較粗糙。建議能增加模糊搜索功能，并優(yōu)化結(jié)果提示UI。

地圖默認(rèn)顯示用戶當(dāng)前的位置，用戶產(chǎn)生搜索結(jié)果后會(huì)直接在地圖上顯示，方便用戶查看。用戶可以點(diǎn)擊撥打店鋪電話進(jìn)行咨詢，并可以或者使用百度地圖進(jìn)行路徑規(guī)劃。

附近店鋪會(huì)直接在地圖上呈現(xiàn)區(qū)域內(nèi)所有的店鋪，直觀的方便用戶選擇。同時(shí)下方會(huì)按照距離近-遠(yuǎn)出現(xiàn)店鋪列表，并告知用戶地理距離。用戶點(diǎn)擊進(jìn)入店鋪詳情可以點(diǎn)擊撥打電話進(jìn)行咨詢，或者使用百度地圖規(guī)劃前往的路徑，功能比較完善。

地區(qū)搜索則是按地區(qū)呈現(xiàn)所有的店鋪列表，供用戶了解全國(guó)范圍的店鋪分布情況。方便了解外地的店鋪并在可能的出行途中前往。

（4）簽到

簽到作為核心和亮點(diǎn)功能，是吸引用戶到店的重點(diǎn)手段之一。主要是基于物理定位的方式來對(duì)用戶到店的行為進(jìn)行記錄。

當(dāng)用戶到達(dá)店鋪附近時(shí)，APP就會(huì)給出可供簽到的附近店鋪選項(xiàng)。同時(shí)下方有一個(gè)搜索輸入框，供用戶找到店鋪。

另外，點(diǎn)擊右上角的簽到冊(cè)按鈕，可以查看到簽到的記錄。簽到記錄里面的簽章樣式略有不同，貌似不同的旋轉(zhuǎn)度表示不同的店鋪，而不同的顏色代表不同的月份。這樣用戶可以一目了然地知道自己在大體什么時(shí)間，在什么店鋪進(jìn)行了簽到。

有幾點(diǎn)建議：簽到結(jié)果的店鋪動(dòng)態(tài)，如果沒有發(fā)布的話，右側(cè)的箭頭icon應(yīng)該去掉。否則可能會(huì)給用戶造成可以點(diǎn)擊的假象，形成無用的操作。

其次，根據(jù)設(shè)計(jì)的重復(fù)原則，簽到界面和簽到結(jié)果界面的店鋪名稱字號(hào)建議統(tǒng)一。

（5）收藏

用戶在商品詳情頁面點(diǎn)擊收藏按鈕，可以將相關(guān)商品收藏到此版塊。同時(shí)，在收藏版塊中可以選擇收藏列表的排序規(guī)則，分別是：收藏日期從早到晚、收藏日期從晚到早和商品類別三種。

此模塊的功能顯得過于單一，僅是對(duì)用戶收藏的商品進(jìn)行單純的呈現(xiàn)，建議能增加更多的功能。比如收藏的商品降價(jià)或者活動(dòng)時(shí)，可以進(jìn)行相關(guān)的提示。

另外，點(diǎn)擊收藏時(shí)的動(dòng)效被設(shè)計(jì)為全屏顯示，而且紅白配色的設(shè)計(jì)顯得有些刺眼。建議優(yōu)化為局部的動(dòng)效設(shè)計(jì)。

（6）Passport

包含動(dòng)態(tài)、積分信息和條形碼。積分信息是顯示用戶當(dāng)前的里程、積分和等級(jí)，而條形碼是結(jié)賬時(shí)出示給售貨員產(chǎn)生積分用。動(dòng)態(tài)則與漢堡菜單中的動(dòng)態(tài)重復(fù)了，建議可以取消。

另外，還有一個(gè)與此模塊有關(guān)的隱藏功能：當(dāng)用戶在任何界面進(jìn)行橫屏?xí)r，界面均會(huì)變?yōu)闀?huì)員名片，包含用戶的基本信息和條形碼，以供用戶快速進(jìn)行結(jié)賬。但隱藏的太深，沒有任何提示。特別對(duì)于有設(shè)置手機(jī)橫向搜定的用戶來說，幾乎不可能知道會(huì)有這個(gè)功能

（7）其他

包含左上角漢堡菜單和右上角消息中心入口。漢堡菜單主要是隱藏起來的低頻次功能，包含個(gè)人信息、優(yōu)惠信息、歷史信息、兌換、使用方法、無印良品的網(wǎng)站和設(shè)置/其他。

五、總結(jié)和建議

總體來說，MUJI APP的產(chǎn)品設(shè)計(jì)延續(xù)了MUJI品牌一貫的簡(jiǎn)約風(fēng)格。各個(gè)主要功能模塊均秉承了簡(jiǎn)單易用的思路，同時(shí)在細(xì)節(jié)的交互上不乏亮點(diǎn)。

更重要的是，整個(gè)產(chǎn)品戰(zhàn)略層的設(shè)計(jì)定位可謂匠心獨(dú)運(yùn)，一改商店搬上網(wǎng)的俗套而采用了更加符合品牌定位的深耕線下的思路。采用線上線下相結(jié)合的方式，走出了一條特色的道路。

我也曾經(jīng)思考過電子商務(wù)與實(shí)體專賣店之間的關(guān)系。是否電子商務(wù)的興盛一定要以犧牲實(shí)體商業(yè)的利益為代價(jià)。以至于眾多實(shí)體商家視網(wǎng)絡(luò)為洪水猛獸？以至于專賣店群體關(guān)閉的新聞數(shù)見不鮮？或許MUJI給出了一個(gè)可供思考的方向，采用這種“線上拉客，線下宰客”的方式，或許正可以平衡這種矛盾。

但是，同時(shí)也應(yīng)該認(rèn)識(shí)到，此APP也存在一些問題。特別是運(yùn)營(yíng)方面，非常多應(yīng)有的實(shí)體店相關(guān)信息為空；與用戶的互動(dòng)極少；版本相當(dāng)長(zhǎng)時(shí)間沒有迭代。這些都制約了產(chǎn)品進(jìn)一步的發(fā)展和狀態(tài)，需要予以重視和改進(jìn)。

作者：迎頭一板磚（微信號(hào)wuofpla），野生產(chǎn)品經(jīng)理，期待與大家共同交流進(jìn)步。

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