本文將為大家介紹如何在設(shè)計上提升產(chǎn)品的使用體驗，讓用戶更加愿意更新產(chǎn)品。

一個新產(chǎn)品上線之后都會不斷迭代新的版本，版本更新時通常會使用彈窗形式，這類型的彈窗是屬于模態(tài)彈窗，會打斷用戶當(dāng)前的操作行為，強制用戶必須進行操作回應(yīng)，才可以進行其他操作，這種行為一定程度上造成用戶情緒的不爽，降低用戶對產(chǎn)品的好感。那我們?nèi)绾卧谠O(shè)計上提升產(chǎn)品的使用體驗，讓用戶更加愿意更新呢？

1. 巧妙的布局

更新彈窗頁面，用戶只有兩種操作選擇，更新或關(guān)閉，而我們產(chǎn)品的目的是讓用戶去更新，在設(shè)計頁面時設(shè)計師需要有意引導(dǎo)用戶去操作更新按鈕。

1.1 常規(guī)卡片形式

這是很常見的三種更新彈窗類型，布局形式上均是插畫+文字+按鈕。先做一下簡單比較分析：

• 第一種彈窗形式，“立即更新版本”按鈕設(shè)計上和第二種方式一樣，而關(guān)閉按鈕放在卡片下方，用戶很容易會點擊到，同時會讓用戶在短時間內(nèi)去決定是否更新版本，加大心理層面的壓力。
• 第二種彈窗形式，“立即升級”按鈕放在底部，是單手操作很容易觸及的區(qū)域，使用色塊+文字的展示方式是非常顯眼的，將關(guān)閉按鈕放在了彈窗卡片右上角位置，隱藏在了頂部的插畫里，用戶不易發(fā)現(xiàn)且不易點擊。
• 第三種彈窗形式，使用“更新”“跳過”文字形式來操作，通過顏色上的區(qū)別來引導(dǎo)用戶去進行更新，文字形式的按鈕在視覺上是弱于色塊+文字形式。

通過上面的分析，顯然第二種彈窗形式是最合適的設(shè)計方案。接下來，對第二種彈窗形式運用到的設(shè)計理論進行拆解。

1.2 拇指熱區(qū)

上圖是陌陌App更新彈窗的拇指熱區(qū)，根據(jù)手機專家 Steve Hoober 的一項研究，以拇指熱圖的形式來顯示出操作手機屏幕不同區(qū)域難易程度，分為舒適區(qū)、可以觸及區(qū)、無法觸及區(qū)。設(shè)計彈窗頁面時，可以將導(dǎo)向用戶升級的操作放在舒適區(qū)，相反導(dǎo)向的可以放在無法觸及區(qū)。

格式塔理論

格式塔理論（Gestalt）強調(diào)經(jīng)驗和行為的整體性，認(rèn)為整體不等于部分之和，意識不等于感覺元素的集合，行為不等于反射弧的循環(huán)。共包括7個原則，接近性、相似性、連續(xù)性、封閉性、對稱性、主體/背景、共同命運。

陌陌App更新彈窗運用到了主體/背景原則、接近性原則、相似性原則。

主體/背景原則，使用半透明背景遮擋來弱化底層內(nèi)容信息，更新彈窗處于用戶的第一視覺層級，從而達到主次信息的區(qū)分。

接近性原則、相似性原則，彈窗內(nèi)的插畫、文字內(nèi)容、按鈕的相對距離，及其與彈窗的邊距大小，讓用戶感知到這是三個不同的信息內(nèi)容。文字內(nèi)容部分，標(biāo)題、正文通過距離及字號顏色的不同來區(qū)分信息的主次，這里又涉及到了另一個原則，涉及四大基本原則中的對比。

1.3 異形卡片形式

常規(guī)彈窗是以矩形的形狀進行設(shè)計，用戶對于同種類型的已經(jīng)審美疲勞，看到類似彈窗會略過，并不能吸引用戶多大的注意力。

設(shè)計時嘗試使用從另一些角度考慮，像是第一個彈窗以星球火箭為插圖背景，契合了內(nèi)容標(biāo)題“主銀，發(fā)現(xiàn)新大陸”，在形式上比較新穎，一定程度上可以吸引用戶的視線。

第二個彈窗使用信封郵件的展示形式，和傳統(tǒng)形式打開信封的情景相似，容易引起用戶的共性經(jīng)歷，調(diào)起用戶的情感。用戶對產(chǎn)品會更有信任感，也會更加愿意更新。

2. 文案的魅力

• WiFi環(huán)境下更新不到30秒哦~
• 90%的小伙伴已經(jīng)更新升級，你還在等什么？
• 省流量升級（21.8M 11.6M）
• 恭喜獲得內(nèi)測體驗資格，搶先體驗新版內(nèi)容
• 「全新UI」輕盈靈動，給你更清爽的視覺感受、更便捷的操作體驗
• 【體驗新升級】修復(fù)已知bug，追劇觀影流暢加倍
• ……

這些都是我整理收集的一些市面上產(chǎn)品更新時使用的優(yōu)秀文案，當(dāng)更新彈窗內(nèi)容信息出現(xiàn)這些文字的時候，會更加吸引用戶去更新。這些文案并不是簡單的直接闡述更新的功能點，而是點到用戶的痛點。

WiFi環(huán)境下更新不到30秒哦~，提醒用戶更新的用時很短，不需要等待很多時間，減少用戶的顧慮。

省流量升級（21.8M 11.6M），不僅寫出此次版本更新的文件大小，而且和原本更新需要的文件進行對比（更少了）。這種情況下，給了用戶一個心理預(yù)期，可以預(yù)計更新時間的。同時，更新所需要的流量還少了，給了用戶一種占便宜的感覺。達到了產(chǎn)品目的，也提升了用戶對于產(chǎn)品的好感。

90%的小伙伴已經(jīng)更新升級，你還在等什么？這是利用從眾心理，很多人選擇的好的概率是非常大的，同時也暗示用戶進行這個更新操作是安全的。

這里的痛點是用戶不知道更新之后可以得到什么，更新需要等待需要多長時間，更新需要耗費多少流量，簡要來說就是：得到價值、所用時間、耗費流量，在思考版本更新文案的時候可以著重從這三個方面出發(fā)考慮。得到價值不僅僅是全新功能、全新視覺，還可以是尊貴感優(yōu)越感體現(xiàn)這些心理層面的感受，等等。

3. 貼心的交互

更新功能可以從兩個點設(shè)計來提高產(chǎn)品的交互體驗，我會以實例來說明這部分內(nèi)容。

3.1 充分從實際場景中的用戶角度出發(fā)，用戶關(guān)閉更新彈窗之后，進行二次提示

這里可以支付寶為例：

支付寶更新彈窗，點擊右上角關(guān)閉之后，會在首頁出現(xiàn)一個更新提示條，這個提示是一直存在的，但是用戶可以手動關(guān)閉。

這里以一個使用場景來猜測一下支付寶這樣設(shè)計原因，小林早上上班途中去便利店買了一份早餐套餐，柜臺前結(jié)賬時打開支付寶出示付款碼給店員，但是打開之后首頁彈出了一個版本更新彈窗，在這種情況下她點擊關(guān)閉了彈窗，出示付款碼完成支付。

類似這種場景的還有很多，用戶通常是需要使用到App才會打開，而彈窗直接打斷了當(dāng)前的操作，此時用戶更多的選擇關(guān)閉彈窗。

支付寶這里設(shè)計了一個更加合適的交互方案，在用戶關(guān)閉更新彈窗，在首頁出現(xiàn)一個版本更新的快捷入口提示，充分的考慮到了實際使用場景下的產(chǎn)品交互，設(shè)身處地的為用戶考慮，從微小細(xì)節(jié)方面提升產(chǎn)品的使用體驗。

3.2 更新之后，進入App首頁引導(dǎo)用戶快速的了解更新的功能

上圖是馬蜂窩App更新之后的新功能引導(dǎo)。通過這樣的設(shè)計交互方式，用戶能夠了解到新功能及一些功能的位置變化等等。這樣設(shè)計的好處是在進行更新操作之后，用戶可以收到反饋，幫助用戶更深入的了解產(chǎn)品功能，可以加深用戶對于產(chǎn)品的印象。

這是我對更新彈窗的一些理解，歡迎有不同想法的小伙伴評論區(qū)交流。

作者：小葫圖，微信公眾號：YI易設(shè)計

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

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