我們?cè)谠O(shè)計(jì)產(chǎn)品的時(shí)候，有時(shí)不知道如何提升產(chǎn)品使用路徑的體驗(yàn)，如何設(shè)計(jì)適應(yīng)不同設(shè)備不同場(chǎng)景的統(tǒng)一性。此篇文章會(huì)通過(guò)設(shè)計(jì)騰訊文檔在線收集表，介紹我們通過(guò)「角色體驗(yàn)地圖」提升產(chǎn)品體驗(yàn)路徑，并且如何搭建多設(shè)備多場(chǎng)景的響應(yīng)式框架的方法。期待給大家?guī)?lái)啟發(fā)幫助。

騰訊文檔收集表作為騰訊文檔的重要品類，為用戶提供基礎(chǔ)收集、打卡、接龍、試卷等多樣的信息收集模式，可收集百萬(wàn)份信息。并且在疫情期間發(fā)揮了信息收集的作用，培養(yǎng)了一批忠實(shí)用戶。

如何優(yōu)化產(chǎn)品體驗(yàn)路徑

學(xué)校老師使用收集表統(tǒng)計(jì)學(xué)生信息, 公司秘書使用收集表統(tǒng)計(jì)員工健康情況、個(gè)人信息。他們究竟是如何使用收集表，在使用過(guò)程中又遇到了哪些問(wèn)題是我們急需了解的。此階段我們分別使用遠(yuǎn)程田野調(diào)查法了解用戶訴求，劃分用戶角色法拆解核心體驗(yàn)路徑，繪制分角色體驗(yàn)地圖歸納用戶痛點(diǎn)。

1. 遠(yuǎn)程田野調(diào)查探索用戶訴求

在疫情期間，雖然不能和用戶見(jiàn)面，我們自研了特殊的調(diào)研方法「遠(yuǎn)程田野調(diào)查」來(lái)探索用戶的訴求。我們建立了很多用戶反饋群和典型用戶一對(duì)一交流，通過(guò)聊天的即時(shí)性第一時(shí)間掌握用戶反饋。雖然不如面對(duì)面交流生動(dòng)，但是也提升了訪談的效率。

我們通過(guò)多個(gè)渠道收集到了大量的體驗(yàn)問(wèn)題，并將這些體驗(yàn)問(wèn)題初步匯總?cè)缦隆＿@使得我們對(duì)收集表的基礎(chǔ)體驗(yàn)問(wèn)題有了全局性感知。我們匯總的時(shí)候會(huì)把用戶行為、用戶問(wèn)題和訴求區(qū)分開來(lái)，為進(jìn)一步的整理做準(zhǔn)備。

2. 劃分用戶角色，拆解用戶核心體驗(yàn)路徑

用戶在使用產(chǎn)品時(shí)都有一定的使用路徑和習(xí)慣，了解用戶的使用行為對(duì)提升體驗(yàn)至關(guān)重要。在一些產(chǎn)品中，還要注意不同的身份角色在使用產(chǎn)品時(shí)的不同表現(xiàn)。因此我們需要先劃分用戶角色，再根據(jù)不同角色拆解用戶核心體驗(yàn)路徑，分析關(guān)鍵節(jié)點(diǎn)下的用戶行為以及他們可能遇到的問(wèn)題。

在收集表中，根據(jù)身份角色，使用收集表的用戶可以劃分為創(chuàng)建人和填寫人兩類。因此我們以身份角色為劃分維度，用戶的核心體驗(yàn)路徑可以分為創(chuàng)建收集表和填寫收集表。這種粗略的行為無(wú)法定位問(wèn)題，因此我們將創(chuàng)建收集表和填寫收集表的環(huán)節(jié)進(jìn)一步拆解如下：

• 創(chuàng)建收集表細(xì)化為：新建收集表-創(chuàng)建/編輯題目-收集表設(shè)置-發(fā)布并分享-查看詳情和結(jié)果。
• 填寫收集表細(xì)化為：打開分享的收集表-填寫收集表-提交收集表-查看上次填寫內(nèi)容-再次填寫。

3. 繪制「角色體驗(yàn)地圖」歸納用戶痛點(diǎn)

根據(jù)身份角色拆分體驗(yàn)路徑后，可將收集到的問(wèn)題歸納到不同身份角色下的相應(yīng)節(jié)點(diǎn)，以便我們更清晰的了解用戶遇到的問(wèn)題。

在收集表中，我們分別從創(chuàng)建人和填寫人的角度繪制角色體驗(yàn)地圖，更方便我們清晰地了解不同身份角色的用戶在使用產(chǎn)品時(shí)遇到的問(wèn)題。通過(guò)歸納角色體驗(yàn)地圖我們發(fā)現(xiàn)：

創(chuàng)建人：創(chuàng)建發(fā)布時(shí)操作路徑冗余、界面信息復(fù)雜。我們給用戶設(shè)計(jì)的操作路徑并不是用戶期望的，用戶在使用時(shí)會(huì)有“復(fù)雜感”和“迷茫感”，影響創(chuàng)建效率。

填寫人：填寫提交時(shí)交互細(xì)節(jié)缺失、透?jìng)餍畔⑦^(guò)多。我們?yōu)橛脩粽宫F(xiàn)的內(nèi)容用戶可能并不需要，用戶在使用時(shí)會(huì)有“冗余感”，影響填寫效率。

4. 設(shè)計(jì)實(shí)現(xiàn)

縮短路徑快速添加問(wèn)題

我們分析了創(chuàng)建路徑上的用戶行為，發(fā)現(xiàn)收集表的用戶使用模板比較多，使用模板后會(huì)進(jìn)行調(diào)整和修改。大部分用戶修改問(wèn)題需要到半屏頁(yè)面比較繁瑣，手機(jī)屏幕較小，頻繁的切換頁(yè)面，很容易迷失。

探索新的解決方案，每個(gè)問(wèn)題的編輯無(wú)需跳轉(zhuǎn)，可以在當(dāng)前頁(yè)面進(jìn)行編輯，即點(diǎn)即編，減少跳轉(zhuǎn)，減少輸入的層級(jí)。編輯題目提升效率2倍，提升了用戶價(jià)值。

直接觸達(dá)填寫

我們分析填寫路徑上的用戶行為和問(wèn)題，發(fā)現(xiàn)創(chuàng)建者創(chuàng)建收集表后，無(wú)法直接進(jìn)行填寫，需要點(diǎn)擊填寫收集表進(jìn)入新頁(yè)面進(jìn)行填寫，流程繁瑣。

新的解決方案，創(chuàng)建者創(chuàng)建后可以直接填寫，提升了填寫效率。

對(duì)比之前方案，新的方案有更方便的創(chuàng)建路徑，編輯題目效率提升2倍，分享流程效率提升2倍，填寫效率提升2倍，查看結(jié)果更加流暢。

如何建立適應(yīng)多場(chǎng)景多設(shè)備的統(tǒng)一框架

我們?cè)谠O(shè)計(jì)一個(gè)產(chǎn)品框架的時(shí)候既需要有場(chǎng)景的擴(kuò)展性，為未來(lái)更多能力打下基礎(chǔ)，并且可以做到響應(yīng)式設(shè)計(jì)，響應(yīng)多個(gè)設(shè)備，響應(yīng)式的設(shè)計(jì)不僅可以為用戶建立統(tǒng)一的認(rèn)知，也可以減少開發(fā)成本和未來(lái)的修改成本。

收集表場(chǎng)景的多樣性決定了信息收集模式的豐富性。為滿足不同場(chǎng)景下的收集訴求，早期我們快速上線了習(xí)題、打卡、接龍等輕量級(jí)收集模塊，但這些模塊與基礎(chǔ)收集的框架不統(tǒng)一。不統(tǒng)一的框架導(dǎo)致收集表的體驗(yàn)性、擴(kuò)展性較差，用戶會(huì)有使用“多個(gè)產(chǎn)品”的錯(cuò)覺(jué)，同時(shí)也為后期擴(kuò)展更多收集場(chǎng)景帶來(lái)不便。

除了不具備多場(chǎng)景的統(tǒng)一性，收集表的多設(shè)備體驗(yàn)也不具備統(tǒng)一。疫情期間用戶養(yǎng)成了移動(dòng)端的使用習(xí)慣，移動(dòng)端體驗(yàn)的重要性也隨之增加。不具備統(tǒng)一性和通用性的多設(shè)備體驗(yàn)，大大增加了用戶的認(rèn)知負(fù)荷，同時(shí)也增加了收集表的維護(hù)成本。

因此除了優(yōu)化收集表的路徑體驗(yàn)，建立跨場(chǎng)景、跨設(shè)備的收集體系也尤為重要。我們的基礎(chǔ)框架設(shè)計(jì)需要具有場(chǎng)景擴(kuò)展性，并且可響應(yīng)多設(shè)備的動(dòng)態(tài)響應(yīng)。

1. 建立適應(yīng)多場(chǎng)景的框架

要找到適應(yīng)多場(chǎng)景的框架，首先要找到不同場(chǎng)景下的共性能力，并且抽象共性能力為共性模塊。我們發(fā)現(xiàn)收集表大部分場(chǎng)景分為三個(gè)模塊：概述、設(shè)置、內(nèi)容。我們建立由這三個(gè)模塊組成的新框架，將新框架重新適配到收集表上。新框架也重新適配到打卡、習(xí)題、接龍上面進(jìn)行框架的統(tǒng)一，強(qiáng)化用戶對(duì)產(chǎn)品的統(tǒng)一認(rèn)知，同時(shí)也為未來(lái)場(chǎng)景奠定擴(kuò)展基礎(chǔ)。

2. 建立適應(yīng)多設(shè)備的框架

在《騰訊文檔全平臺(tái)系統(tǒng)設(shè)計(jì)》中，我們?yōu)榇蠹以敿?xì)介紹了布局動(dòng)態(tài)響應(yīng)的設(shè)計(jì)方法。收集表作為騰訊文檔中的一個(gè)品類，同樣將頁(yè)面定義為寬松和緊湊兩種布局，開發(fā)人員使用一套代碼便可維護(hù)各平臺(tái)產(chǎn)品，保證體驗(yàn)一致性的同時(shí)也大大降低了維護(hù)成本。為了建立適應(yīng)多設(shè)備的框架，我們以640pt為界限，Phone適配緊湊布局，Pad、PC、Mac適配寬松布局，內(nèi)容區(qū)域拉伸變化。

不僅適配多端也是適應(yīng)多場(chǎng)景的框架，響應(yīng)式的框架適配到打卡、習(xí)題、接龍等其他場(chǎng)景上。做到了多端和多場(chǎng)景的響應(yīng)適配。

設(shè)計(jì)成果

改版后的收集表目前已全面上線，此次改版極大的提升了用戶的使用效率，用戶量有很大提升。在設(shè)計(jì)的過(guò)程中我們緊緊圍繞“效率升級(jí)”，在提升收集表基礎(chǔ)體驗(yàn)的同時(shí)，也著力于打造多場(chǎng)景多端統(tǒng)一的收集體系。體驗(yàn)設(shè)計(jì)沒(méi)有終點(diǎn)，我們希望在未來(lái)歲月為用戶提供更加卓越的收集服務(wù)，讓騰訊文檔收集表與用戶更好相遇。

以下是騰訊文檔APP和小程序二維碼鏈接，歡迎大家掃碼體驗(yàn)！

歡迎關(guān)注作者微信公眾號(hào)：「騰訊ISUX」