作為設(shè)計(jì)師，在拿到產(chǎn)品需求的時(shí)候，所要做的不僅僅是完成產(chǎn)品的設(shè)計(jì)工作，更重要的是要思考如何通過(guò)設(shè)計(jì)的的手段去推動(dòng)產(chǎn)品背后的商業(yè)價(jià)值達(dá)到最大化，提升視覺(jué)體驗(yàn)、增強(qiáng)用戶(hù)的粘性以達(dá)到用戶(hù)轉(zhuǎn)化的目的。不需要我們?cè)O(shè)計(jì)的有多么復(fù)雜，可能是一個(gè)步驟的簡(jiǎn)化、一句打動(dòng)人心的文案、貼心的提示、趣味的動(dòng)效…
1. 產(chǎn)品體驗(yàn)：
打開(kāi)美團(tuán)外賣(mài)APP，在每個(gè)店鋪下方都有突出的滿(mǎn)減提示，進(jìn)入店鋪詳情頁(yè)，在頂部和底部同樣都有，選好商品后，商品的總價(jià)達(dá)到滿(mǎn)減條件，就可以減掉對(duì)應(yīng)的金額。
2. 設(shè)計(jì)思考：
滿(mǎn)20減18，后面還有6元無(wú)門(mén)檻紅包？這已經(jīng)是免費(fèi)的午餐了，而且還賺了4塊錢(qián)。于是進(jìn)入商品列表上下齊開(kāi)「一頓操作猛如虎，定睛一看原地杵」，這里的商品要么就是低于20的，要么就是40左右，免費(fèi)不存在的，要不就在這家隨便吃點(diǎn)吧。
其實(shí)類(lèi)似于這種滿(mǎn)減提示在外面平臺(tái)一點(diǎn)都不稀奇，用戶(hù)也都不傻，也許進(jìn)入店鋪發(fā)現(xiàn)不對(duì)后轉(zhuǎn)身就走，可平臺(tái)還是會(huì)把這種滿(mǎn)減提示作為最耀眼的存在，屢試不爽。
在用戶(hù)完成轉(zhuǎn)化的三要素中，動(dòng)機(jī)、能力、觸發(fā)，缺一不可。店鋪下方的滿(mǎn)減提示則是利用用戶(hù)的貪小便宜的心理，優(yōu)惠的數(shù)值越高，越能引起注意力和購(gòu)買(mǎi)欲望，足以讓用戶(hù)產(chǎn)生下單的動(dòng)機(jī)；進(jìn)入店鋪后，看完所有商品，即使沒(méi)有符合用戶(hù)心理預(yù)期的價(jià)格，因滿(mǎn)減產(chǎn)生的動(dòng)機(jī)逐漸降低，但新的購(gòu)買(mǎi)動(dòng)機(jī)產(chǎn)生了，通過(guò)紅包、好評(píng)、折扣、美圖…等能力依然在提升用戶(hù)的購(gòu)買(mǎi)欲望，觸發(fā)用戶(hù)下單，并最終完成轉(zhuǎn)化。這種選擇「讓利」的方式去吸引用戶(hù)，也是短期內(nèi)也最有效方式。
1. 產(chǎn)品體驗(yàn)：
在體驗(yàn)淘寶簽到功能時(shí)，簽到成功會(huì)出現(xiàn)彈窗提示「簽到成功」，并告知此時(shí)下單紅包即可翻倍，點(diǎn)擊關(guān)閉，彈出二層彈窗「紅包未翻倍」及「限頻道內(nèi)使用」的文字提醒。
2. 設(shè)計(jì)思考：
淘寶通過(guò)二層彈窗提醒用戶(hù)退出當(dāng)前頁(yè)面可能帶來(lái)的影響、后果，讓用戶(hù)判斷當(dāng)前的退出決策是否正確，畢竟相對(duì)于‘收獲’來(lái)說(shuō)，‘損失’更讓人在乎某事物。 同時(shí)告知退出會(huì)讓下次行動(dòng)付出更多的金錢(qián)成本，這種更多成本的投入會(huì)讓用戶(hù)產(chǎn)生顧慮，從而激發(fā)用戶(hù)的情緒并轉(zhuǎn)化為行動(dòng)。
1. 產(chǎn)品體驗(yàn)：
在支付寶的螞蟻莊園喂養(yǎng)小雞，通過(guò)養(yǎng)雞攢愛(ài)心，集滿(mǎn) 5 顆愛(ài)心，即可捐贈(zèng)給公益項(xiàng)目，另外可以完成多種任務(wù)來(lái)獲得飼料來(lái)喂養(yǎng)小雞；
點(diǎn)擊螞蟻莊園左側(cè)的果樹(shù)去種樹(shù)免費(fèi)領(lǐng)取水果，同樣可以完成各種任務(wù)獲得肥料，施肥促使果樹(shù)成長(zhǎng)，最終果實(shí)成熟就可免費(fèi)領(lǐng)取真實(shí)的水果。
2. 設(shè)計(jì)思考：
支付寶通過(guò)公益的方式已經(jīng)讓用戶(hù)對(duì)螞蟻莊園產(chǎn)生了很強(qiáng)的粘性。項(xiàng)目的受益對(duì)象都是弱勢(shì)群體，比如留守兒童、殘疾幼兒、貧困女性等等，并根據(jù)捐贈(zèng)的愛(ài)心進(jìn)行好友排名。雖然有一部分人做好事不留名，但不排除大部分用戶(hù)都喜追求面子心理，總是希望自己最有面子，因?yàn)樗梢詭?lái)一種榮耀和心理上的滿(mǎn)足感，如果做好事能讓他人知曉，會(huì)激勵(lì)更多的人行善，因而用戶(hù)排名起到了極大的用戶(hù)激勵(lì)作用。
最近，螞蟻莊園增加了種果樹(shù)功能，選擇自己喜歡的水果種果樹(shù)，通過(guò)施肥最終讓果樹(shù)成熟就可以免費(fèi)領(lǐng)取真實(shí)的水果，在開(kāi)始出現(xiàn)「免費(fèi)領(lǐng)水果」的時(shí)候就已經(jīng)激起了用戶(hù)的貪婪心理。種植果樹(shù)后，需要通過(guò)施肥促使果樹(shù)成長(zhǎng)，在成長(zhǎng)的不同階段需要的肥料也會(huì)根據(jù)基數(shù)遞增式的增加，需要用戶(hù)完成不同的任務(wù)獲得肥料，可以完成的任務(wù)雖然很多，但大部分都是九牛一毛。
用戶(hù)每天可以通過(guò)逛精選商品獲得大量的肥料，進(jìn)入商品頁(yè)面，系統(tǒng)會(huì)推薦用戶(hù)最近在淘寶瀏覽過(guò)相似類(lèi)型的商品，停留15秒即可領(lǐng)取肥料，同時(shí)如果下單更可領(lǐng)取近乎10倍的肥料，促使水果成熟的更快。根據(jù) 希克定律：用戶(hù)決策所需要花費(fèi)的時(shí)間隨著選擇的數(shù)量和復(fù)雜性增加而增加。系統(tǒng)通過(guò)減少可供用戶(hù)選擇的選項(xiàng)以及為了「免費(fèi)領(lǐng)水果」獲得肥料而可能下單的潛在動(dòng)機(jī)，推薦最近瀏覽過(guò)的類(lèi)似商品，促使用戶(hù)快速做出決策，以到達(dá)成交的目的。（PS：本人為了領(lǐng)取大量的肥料，已經(jīng)買(mǎi)了好幾次之前想買(mǎi)而沒(méi)有買(mǎi)的商品）
1. 產(chǎn)品體驗(yàn)：
進(jìn)入「cctalk」APP首頁(yè)，底部會(huì)自動(dòng)出現(xiàn)最近一次學(xué)習(xí)記錄的彈窗小提示，點(diǎn)擊即可進(jìn)入繼續(xù)學(xué)習(xí)，也可手動(dòng)點(diǎn)擊關(guān)閉，在沒(méi)有任何操作的情況，時(shí)間達(dá)到5s也會(huì)自動(dòng)關(guān)閉。
2. 設(shè)計(jì)思考：
cctall是一個(gè)重量級(jí)的產(chǎn)品，進(jìn)入此應(yīng)用的用戶(hù)通常帶有目的性，都是以學(xué)習(xí)為主，不至于是用戶(hù)在漫無(wú)目的情況下進(jìn)來(lái)娛樂(lè)休閑一番吧。進(jìn)入首頁(yè)的學(xué)習(xí)記錄彈窗是介于toast與snackbar之間，延長(zhǎng)了toast的顯示時(shí)間，并加入了一個(gè)跳轉(zhuǎn)鏈接，同時(shí)也可以關(guān)閉或自動(dòng)消失，起到提醒用戶(hù)作用的同時(shí)，又不影響其他的操作。
一個(gè)好的產(chǎn)品會(huì)在恰當(dāng)?shù)臅r(shí)間給予恰當(dāng)?shù)姆答，不反饋、反饋不及時(shí)、反饋不對(duì)都會(huì)讓用戶(hù)反感你的產(chǎn)品，從而失去用戶(hù)。cctalk的彈窗提示正是在用戶(hù)恰好可能需要的時(shí)間出現(xiàn)，讓用戶(hù)快速的達(dá)到自己的目的，非常的友好，同時(shí)也提升了產(chǎn)品的易用性。
1. 產(chǎn)品體驗(yàn)：
進(jìn)入餓了么首頁(yè)，點(diǎn)擊右下角的購(gòu)物車(chē)入口，即可看到從所有店鋪添加的商品一覽，可進(jìn)行一一結(jié)算。
2. 設(shè)計(jì)思考：
相比以前，用過(guò)餓了么的用戶(hù)都知道，每個(gè)店鋪都是有單獨(dú)的購(gòu)物車(chē)，從對(duì)應(yīng)的購(gòu)物車(chē)進(jìn)去才能完成結(jié)算。大部分用戶(hù)在買(mǎi)商品之前，都會(huì)查看多個(gè)店鋪相同商品的價(jià)格、評(píng)論、綜合評(píng)分…等，根據(jù)性?xún)r(jià)比「貨比三家」，但回過(guò)頭來(lái)，需要來(lái)回切換去找到之前添加過(guò)商品的店鋪，甚至查詢(xún)不到，耗費(fèi)大量的時(shí)間，非常的不便。
餓了么首頁(yè)右下角新增的購(gòu)物車(chē)入口很好的解決了這一問(wèn)題，進(jìn)入購(gòu)物車(chē)，能看到之前添加過(guò)商品到購(gòu)物車(chē)的所有店鋪，可從列表中選擇進(jìn)行結(jié)算，節(jié)省了用戶(hù)大量的時(shí)間成本，入口很巧妙的解決了用戶(hù)在下單流程中可能會(huì)遇到的痛點(diǎn)，提升了產(chǎn)品的易用性。
1. 產(chǎn)品體驗(yàn)：
夸克瀏覽器輸入網(wǎng)址時(shí)，點(diǎn)擊下方控制條圖標(biāo)，會(huì)放大左右控制區(qū)域，左右移動(dòng)即可修改光標(biāo)位置；
地址欄顯示在鍵盤(pán)上方（屏幕中間位置），輸入網(wǎng)址時(shí)的自動(dòng)匹配結(jié)果由下往上的方式排列。
2. 設(shè)計(jì)思考：
我們?cè)谑褂靡苿?dòng)端瀏覽器輸入網(wǎng)址時(shí)，如果需要修改文本框的地址，需要用手指直接在輸入框定位光標(biāo)，相對(duì)很小的地址文本，要想將光標(biāo)精準(zhǔn)的定位在理想的位置，確實(shí)非常難。通過(guò)夸克瀏覽器的控制條左右移動(dòng)定位光標(biāo)，精準(zhǔn)度提升了很多，避免了用戶(hù)因光標(biāo)定位錯(cuò)誤造成的重復(fù)操作，提高了操作效率。
另外所接觸的移動(dòng)端瀏覽器，大部分的地址欄都設(shè)在屏幕的頂部。目前大屏幕尺寸已經(jīng)是趨勢(shì)，單手操作手機(jī)的用戶(hù)比例占據(jù)最大，頂部和最底部的單手最難操作的區(qū)域，而夸克瀏覽器打破常規(guī)，將地址欄放在鍵盤(pán)上方，即屏幕的中間位置，是用戶(hù)單手最容易操作和控制的區(qū)域，非常的便捷。網(wǎng)址匹配結(jié)果根據(jù)精準(zhǔn)度由下往上排列也是非常合理。費(fèi)茨定律告訴我們：需要連續(xù)操作的控件盡可能接近， 任意一點(diǎn)移動(dòng)到目標(biāo)中心位置所需要的時(shí)間，與目標(biāo)距離正相關(guān)， 與目標(biāo)大小負(fù)相關(guān)。
1. 產(chǎn)品體驗(yàn)：
使用朋友圈發(fā)布消息，發(fā)現(xiàn)有錯(cuò)別字，把信息刪除后，點(diǎn)擊重新編輯即可在回到消息未發(fā)布時(shí)的界面修改完成。
2. 設(shè)計(jì)思考：
微信在最近一段時(shí)間真是大招連連，從之前一年一次的昵稱(chēng)修改到后面的拍一拍，接著又上線(xiàn)了朋友圈消息刪除后重新編輯的功能，讓很多網(wǎng)友直呼真香。
我們?cè)诎l(fā)布朋友圈消息之后，發(fā)現(xiàn)有錯(cuò)別字或者需要增減內(nèi)容，可以直接刪除，在規(guī)定的時(shí)間內(nèi)重新編輯再次發(fā)布即可。尤其是對(duì)于發(fā)布長(zhǎng)篇幅消息的用戶(hù)，沒(méi)有復(fù)制消息內(nèi)容就匆忙刪除，再次從0編輯，心里的陰影面積不弱于「一萬(wàn)匹烈馬奔騰」，此時(shí)看到重新編輯的入口，可謂是雪中送炭，不僅簡(jiǎn)化的交互流程，也省去了用戶(hù)重新編輯消息的一系列麻煩操作，深得人心。
1. 產(chǎn)品體驗(yàn)：
在體驗(yàn)58同城APP發(fā)布房源信息時(shí)，需要錄入多種房屋選項(xiàng)，可以在一個(gè)彈窗的多個(gè)Tab欄中完成不同的選項(xiàng)。
2. 設(shè)計(jì)思考：
在我們使用的眾多APP應(yīng)用中，不少接觸關(guān)于信息選擇的頁(yè)面，如：填寫(xiě)地址選擇地區(qū)、購(gòu)物選擇商品類(lèi)型、退貨選擇原因…等，最為常見(jiàn)的操作方式就是選擇完當(dāng)前選項(xiàng)后，需要點(diǎn)擊下一個(gè)選項(xiàng)入口，再次進(jìn)入彈窗選擇，有很多個(gè)分級(jí)。而58同城發(fā)布房源的選項(xiàng)，在進(jìn)行設(shè)計(jì)的時(shí)候?qū)⒍鄠(gè)分級(jí)放在同一選項(xiàng)，多個(gè)選項(xiàng)放在同一彈窗，有效的避免了選項(xiàng)太多造成的信息混亂，同時(shí)也解決了因多次彈窗給用戶(hù)帶來(lái)操作上的不便。節(jié)省時(shí)間操作成本的同時(shí)，也讓路徑變得更加合理簡(jiǎn)單。
1. 產(chǎn)品體驗(yàn)：
進(jìn)入美團(tuán)首頁(yè)，金剛區(qū)面性類(lèi)型的抽象圖標(biāo)給人眼前一亮的感覺(jué)；
金剛區(qū)多種分類(lèi)入口可通過(guò)左右滑動(dòng)切換，能快速找到自己想要的功能。
2. 設(shè)計(jì)思考：
一個(gè)產(chǎn)品最具核心功能的就是首頁(yè)了， 它承擔(dān)了產(chǎn)品最核心的功能，決定了產(chǎn)品的屬性和基調(diào)，而首頁(yè)的金剛區(qū)最能體現(xiàn)產(chǎn)品的「骨骼」（產(chǎn)品架構(gòu)），以方便用戶(hù)快速進(jìn)入對(duì)應(yīng)的需求模塊。通常我們見(jiàn)得最多的金剛區(qū)圖標(biāo)樣式80%都是「底色塊+圖形元素」組合而成，而美團(tuán)APP金剛區(qū)使用的面性圖標(biāo)，通過(guò)對(duì)現(xiàn)實(shí)生活中物體縮影的抽象圖形進(jìn)行色彩填充的圖標(biāo)樣式， 清晰、簡(jiǎn)潔且統(tǒng)一，具有表意能力強(qiáng)、辨識(shí)度高的特點(diǎn)，提升易用性。跟其他產(chǎn)品大眾化的圖標(biāo)樣式相比，做到了差異化。另外通過(guò)單色疊加，更改透明度或疊加圖層樣式設(shè)計(jì)，視覺(jué)上非常通透，有空間感，細(xì)節(jié)豐富，品質(zhì)感強(qiáng)，具有很強(qiáng)的吸引力，稱(chēng)得上是首頁(yè)的顏值擔(dān)當(dāng)。
針對(duì)首頁(yè)眾多的功能入口，無(wú)法全部展示，大部分移動(dòng)應(yīng)用都會(huì)在金剛區(qū)的最后位置設(shè)計(jì)一個(gè)「更多」的入口。而美團(tuán)則通過(guò)左右滑動(dòng)的交互方式將功能分類(lèi)全部展示，在視覺(jué)上更加聚焦。因?yàn)楹芏嗟膱D標(biāo)具備相似性，使用列表展示容易混淆用戶(hù)的視覺(jué)，降低圖標(biāo)的辨識(shí)度以及信息的傳遞速度，所以全部展示并左右滑動(dòng)選擇、分塊瀏覽很好的解決的這一問(wèn)題，不僅操作快捷，而且視覺(jué)傳達(dá)的效率也得到了提升。
1. 產(chǎn)品體驗(yàn)：
使用iPhone移動(dòng)端設(shè)備進(jìn)入App store首次下載該應(yīng)用，頁(yè)面底部提示「通過(guò)側(cè)邊按鈕確認(rèn)」，屏幕右側(cè)按鈕位置備注「按兩下以安裝」，同時(shí)右側(cè)的模擬按鈕色塊以動(dòng)效的方式彈動(dòng)兩次提醒。
2. 設(shè)計(jì)思考：
對(duì)于Apple產(chǎn)品，不管是移動(dòng)端還是桌面設(shè)備，在視覺(jué)和體驗(yàn)上都可稱(chēng)之為魔鬼級(jí)別。下載應(yīng)用時(shí)，右側(cè)的按鈕形狀則是利用視覺(jué)線(xiàn)索進(jìn)行示能，讓用戶(hù)通過(guò)圖形，預(yù)期下一步的行為或感知圖形的作用。通過(guò)動(dòng)效提示方式更能吸引用戶(hù)的眼球，也更能引導(dǎo)用戶(hù)進(jìn)行操作，真正做到的有溫度、有情感的交流。
1. 產(chǎn)品體驗(yàn)：
點(diǎn)擊QQ消息列表進(jìn)入聊天框，長(zhǎng)按聊天窗口空白處，可以切換多窗口，左右滑動(dòng)可切換好友/群聊窗口，上下滑動(dòng)可查看當(dāng)前窗口的更多聊天記錄。
2. 設(shè)計(jì)思考：
雖然現(xiàn)在大部分的用戶(hù)都轉(zhuǎn)戰(zhàn)微信，但QQ作為社交應(yīng)用的翹楚，光輝一直都沒(méi)有退卻，只不過(guò)QQ服務(wù)的用戶(hù)群體較年輕，而且社交群體多樣化，也更符合年輕化的氣質(zhì)。QQ的信息多窗口切換，看起來(lái)也是相當(dāng)炫酷，切換時(shí)只需要在消息列表中，長(zhǎng)按消息的空白處就能快速進(jìn)入切換選項(xiàng)，絲滑般的快感，我們?cè)僖膊恍枰褂梅祷匦畔⒘斜碓僦匦逻M(jìn)入到窗口的多步驟操作了。
為此，你也可能會(huì)聽(tīng)到：「我趙日天表示不服哇」，已經(jīng)不用QQ好多年，微信這么方便，難道它不香嗎？其實(shí)對(duì)于真正需要的用戶(hù)來(lái)說(shuō)，這一功能還是非常的方便。不管是處于學(xué)習(xí)、工作還是閑聊吹水，QQ的群聊功能比較多樣化，我們?cè)跒g覽群聊天記錄、爬樓、查找部分有用信息通過(guò)多窗口切換時(shí)是非常實(shí)用。
1. 產(chǎn)品體驗(yàn)：
進(jìn)入中國(guó)工商銀行APP首頁(yè)，搜索欄里的語(yǔ)音錄入通過(guò)動(dòng)效的形式在麥克風(fēng)圖形與音波圖形之間過(guò)渡來(lái)回切換，提醒用戶(hù)可以使用語(yǔ)音錄入搜索。
2. 設(shè)計(jì)思考：
目前很多移動(dòng)端應(yīng)用的搜索都增加了語(yǔ)音錄入功能，為的是讓用戶(hù)更高效、便捷的完成搜索，不過(guò)大部分只是增加了一個(gè)麥克風(fēng)圖標(biāo)作為提示。工商銀行APP使用動(dòng)效的形式在麥克風(fēng)圖形與音波圖形之間過(guò)渡來(lái)回切換，首先動(dòng)態(tài)的視覺(jué)引導(dǎo)，增添了趣味性的微交互更能吸引用戶(hù)的眼球，也能夠更好的引導(dǎo)用戶(hù)操作。其次使用兩個(gè)圖標(biāo)在識(shí)別性上是具有選擇性的，擴(kuò)大了用戶(hù)在識(shí)別層范圍的認(rèn)知程度，也間接提升辨識(shí)度，兩個(gè)圖標(biāo)過(guò)渡性質(zhì)的切換，也顯得非常柔和，情感化的設(shè)計(jì)細(xì)節(jié)為產(chǎn)品增添了溫度，提高點(diǎn)擊率。
圖標(biāo)是一個(gè)對(duì)象或動(dòng)作的視覺(jué)體現(xiàn)，最重要的意象屬性就是傳達(dá)含義功能，另外也是加深用戶(hù)形象的最主要影響要素。麥克風(fēng)圖標(biāo)是一個(gè)設(shè)備的抽象圖形，音波圖標(biāo)則是使用設(shè)備時(shí)的交互過(guò)程，兩個(gè)圖標(biāo)以動(dòng)效的形式完美過(guò)渡結(jié)合，給我們的第一印象就是感覺(jué)這個(gè)功能再在向我們招手，在和我們對(duì)話(huà)，真正做到了有溫度的交流。
1. 產(chǎn)品體驗(yàn)：
在京東APP商品列表上滑瀏覽商品時(shí)，導(dǎo)航欄和全局篩選欄自動(dòng)隱藏，存在下滑操作后再次展示。
2. 設(shè)計(jì)思考：
一般情況下，當(dāng)一些導(dǎo)航或者操作入口可能會(huì)成為打擾用戶(hù)沉浸體驗(yàn)障礙時(shí)，我們就會(huì)把它隱藏，因?yàn)椴糠衷氐拇嬖，就?huì)分散用戶(hù)的注意力。基于用戶(hù)的需求，京東APP的商品列表頂部有導(dǎo)航欄、全局操作欄、垂直內(nèi)容篩選欄，加上狀態(tài)欄，在移動(dòng)設(shè)備中的縱向占比是相當(dāng)?shù)拇，為了解決這一問(wèn)題，京東通過(guò)改變交互的方式，當(dāng)頁(yè)面上滑，會(huì)隱藏導(dǎo)航欄和全局篩選欄，下滑后則再次顯示。
在交互方面，做了這樣的思考，當(dāng)出現(xiàn)上滑的操作后，可以理解為用戶(hù)已經(jīng)開(kāi)始在挑選商品，這時(shí)候搜索與排序的重要級(jí)下降了，搜索結(jié)果垂直內(nèi)容篩選的重要級(jí)上升了，將等級(jí)較低的操作/信息適時(shí)的隱藏，可以讓用戶(hù)專(zhuān)注于當(dāng)前信息，避免其他多余的內(nèi)容產(chǎn)生干擾，同時(shí)也讓內(nèi)容區(qū)域高度增加，一屏展示的商品信息更多，增大商品觸達(dá)用戶(hù)的可能性以及屏幕的利用率。合理的運(yùn)用了交互設(shè)計(jì)四策略-隱藏：盡可能隱藏需要隱藏的功能，其次在合適的時(shí)機(jī)、位置上顯示相應(yīng)的功能。
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任，
本站有權(quán)保留或刪除有爭(zhēng)議評(píng)論。
參與本評(píng)論即表明您已經(jīng)閱讀并接受
上述條款。