隨著AI技術(shù)的發(fā)展，越來越多的產(chǎn)品嘗試結(jié)合AI進(jìn)行功能升級，作為設(shè)計(jì)師的你是否也在面臨這樣的問題：如何將AI技術(shù)與場景需求更好的結(jié)合，為用戶提供順暢的AI原生設(shè)計(jì)體驗(yàn)?zāi)兀?/div>
本文將以AI裝扮項(xiàng)目為例，分兩部分介紹我們是如何通過深入分析用戶痛點(diǎn)與需求，結(jié)合公司內(nèi)部能力支持，找到AI創(chuàng)新突破口。同時(shí)發(fā)揮設(shè)計(jì)優(yōu)勢，在沒有行業(yè)參考前提下，探尋出一條AI創(chuàng)新實(shí)踐之路，設(shè)計(jì)主導(dǎo)創(chuàng)新方案優(yōu)化落地。
裝扮是百度APP的一個(gè)基礎(chǔ)能力，支持用戶設(shè)置頭像、皮膚、主頁背景、套裝等，以滿足用戶個(gè)性化訴求為目標(biāo)，對設(shè)計(jì)有著較高的依賴。當(dāng)前主要面臨兩個(gè)問題：
-
功能缺少吸引力：
各類裝扮操作流程為選擇→預(yù)覽→裝扮，體驗(yàn)單一，缺乏趣味性和吸引力
-
裝扮資源迭代慢：
裝扮資源更新對設(shè)計(jì)師依賴度較高，但手工繪圖的成本高且周期長
通過用戶調(diào)研和數(shù)據(jù)分析，對裝扮用戶有以下兩點(diǎn)發(fā)現(xiàn)：
-
個(gè)性化需求難以滿足：
通過裝扮調(diào)研問卷發(fā)現(xiàn)，用戶沒有佩戴裝扮的大部分原因是由于現(xiàn)有的免費(fèi)裝扮資源無法滿足用戶個(gè)性化需求
-
年輕群體對AI的喜愛：
裝扮用戶趨于年輕化，而年輕群體對智能化、趣味性產(chǎn)品有濃厚興趣，同時(shí)對個(gè)性化、定制化也有著更高的要求
百度文心AI生圖技術(shù)較為成熟，支持輸入描述詞后免費(fèi)生成多張圖片。
通過前面的分析，我們提出一個(gè)洞察思考：
裝扮是否可以接入文心AI生圖的能力，讓用戶自主生圖并用于裝扮？
我們從用戶、業(yè)務(wù)、設(shè)計(jì)三方視角分析裝扮中心接入文心AI生圖能力的可行性和價(jià)值：
-
用戶側(cè)：豐富裝扮玩法，提升裝扮體驗(yàn)的趣味性和吸引力
-
業(yè)務(wù)側(cè)：吸引更多用戶裝扮，提高裝扮用戶量和滲透率
-
設(shè)計(jì)側(cè)：探索AI能力實(shí)際應(yīng)用場景，積累AI原生設(shè)計(jì)經(jīng)驗(yàn)；同時(shí)降低設(shè)計(jì)師生圖成本，降本增效
作為AI創(chuàng)新型項(xiàng)目，我們經(jīng)歷了三期迭代嘗試，不斷打磨升級AI裝扮體驗(yàn)：1期快速試水驗(yàn)證效果，2期創(chuàng)新突破交互體驗(yàn)，3期結(jié)合數(shù)據(jù)持續(xù)優(yōu)化，下面會(huì)從以下3個(gè)階段講述設(shè)計(jì)創(chuàng)新思考過程。
首先我們快速調(diào)研了國內(nèi)外具有AI生成能力的產(chǎn)品做為體驗(yàn)摸底，發(fā)現(xiàn)競品在AI生圖的創(chuàng)作體驗(yàn)上趨于雷同，創(chuàng)作頁主要分為描述詞輸入框、選擇風(fēng)格、尺寸及張數(shù)等操作模塊，對于普通用戶來說
創(chuàng)作體驗(yàn)復(fù)雜、輸入門檻高
。
在項(xiàng)目初期，我們希望能夠快速驗(yàn)證用戶對這套新玩法是否感興趣，所以目標(biāo)是低成本快速上線驗(yàn)證玩法。
我們將AI裝扮流程分為4步：點(diǎn)擊入口→開始創(chuàng)作→生成圖片→預(yù)覽裝扮效果及裝扮。
結(jié)合一期目標(biāo)我們有兩個(gè)設(shè)計(jì)難點(diǎn)：1.如何簡化創(chuàng)作流程；2.如何精簡步長減少折損
解決思路：
在創(chuàng)作流程上我們決定簡化方案，采取讓用戶選取關(guān)鍵詞組合的簡化方式來生成圖片，簡化創(chuàng)作流程快速上線驗(yàn)證。
解決思路：
在圖片生成與裝扮預(yù)覽步驟中，通過縮短路徑讓用戶快速直達(dá)裝扮預(yù)覽頁，減少折損。
在方案選擇上，我們基于
路徑更短、突出裝扮預(yù)覽效果
的目標(biāo)，選擇了方案1進(jìn)行深化：
一期上線后裝扮中心的日均設(shè)置量提升近3倍，AI裝扮各環(huán)節(jié)轉(zhuǎn)化漏斗較高，在各商城中，AI裝扮設(shè)置量位列第二，僅次于頭像，驗(yàn)證AI裝扮對用戶的吸引力較大，于是我們開始啟動(dòng)二期優(yōu)化。
對比一期直接讓用戶選取主體詞和風(fēng)格詞的半自動(dòng)化方式生成圖片，雖然自定義能力較弱，但是生圖方式更容易；二期希望增加用戶自行輸入生成圖片，滿足用戶更加個(gè)性化和多樣性的需求，但同時(shí)輸入門檻對用戶來說也更高。
現(xiàn)有AI生圖輸入門檻之所以較高，是因?yàn)橐粡埜哔|(zhì)量圖片對生圖描述詞有很高的要求。我們分析發(fā)現(xiàn)，高質(zhì)量描述詞需要從畫面風(fēng)格、色彩、細(xì)節(jié)、光影效果、構(gòu)圖比例、畫質(zhì)甚至是相機(jī)設(shè)置等多維度來描述，專業(yè)詞匯多，對于普通用戶來說撰寫門檻高、難度大。
這就留給我們一個(gè)難題：
如何讓用戶低門檻生成一張高質(zhì)量圖片？
結(jié)合二期目標(biāo)我們有兩個(gè)設(shè)計(jì)難點(diǎn)：1.如何創(chuàng)新突破生圖體驗(yàn)；2.裝扮流程整體重構(gòu)
方向1：提供高質(zhì)量描述詞范例讓用戶直接使用
方向2：輔助用戶寫出高質(zhì)量描述詞，比如提供描述詞潤色功能、高級描述詞庫疊加、按公式引導(dǎo)用戶選擇詞組組合等形式輔助創(chuàng)作
如果創(chuàng)作頁要給用戶提供豐富的引導(dǎo)內(nèi)容，同時(shí)兼顧輸入面板的穩(wěn)定露出，基礎(chǔ)平鋪框架承載力有限，無法兼顧豐富引導(dǎo)內(nèi)容的展示和輸入功能的穩(wěn)定露出。我們提出使用雙層框架的形式，將承載“引導(dǎo)內(nèi)容”和“輸入功能”的容器拆分相互獨(dú)立，在承載“引導(dǎo)內(nèi)容”的容器中支持用戶像刷feed一樣上滑，同時(shí)頂層容器穩(wěn)定置底展示輸入功能。
我們圍繞以上兩個(gè)方向進(jìn)行了創(chuàng)作頁從基礎(chǔ)到高階的多套方案探索。
方案收斂過程中，我們決定進(jìn)行用戶測試，觀察用戶對不同方案的理解與接受程度。
我們找了多名不同類型的用戶，觀察他們對各個(gè)方案的理解和使用情況，了解用戶在使用過程中遇到的問題和痛點(diǎn)，并制作表格記錄每一位用戶的反饋與建議。
匯總后得到以下發(fā)現(xiàn)點(diǎn)：
1.用戶對點(diǎn)擊推薦描述詞的生成圖片效果沒有預(yù)期，且表示操作難以理解
2.有配圖會(huì)增強(qiáng)吸引力，文字或步驟多會(huì)有負(fù)面影響
3.用戶對風(fēng)格選擇沒有強(qiáng)烈訴求
根據(jù)測試結(jié)論1&2我們想到，能否結(jié)合方案2-1與2-2，采用圖片范例代替純文字范例，這樣用戶對生成效果就有了直接的預(yù)期，同時(shí)提高了點(diǎn)擊吸引力和可玩性；根據(jù)結(jié)論3我們對現(xiàn)有步驟進(jìn)行了簡化，省略風(fēng)格選擇步驟，采用智能識別描述詞風(fēng)格或默認(rèn)智能推薦生圖風(fēng)格，來減少用戶生圖步驟。
最終方案與競品對比生圖難度更低、生圖步驟更短，同時(shí)我們也進(jìn)行了新方案的回訪，所有用戶均表示新方案更簡單直接，且吸引力更強(qiáng)。
在入口頁和生成圖片&裝扮預(yù)覽流程我們也發(fā)散了多個(gè)方案，同樣通過用戶測試選出最優(yōu)方案。
用戶在裝扮中心點(diǎn)擊入口進(jìn)入創(chuàng)作頁，點(diǎn)擊圖例或輸入內(nèi)容后點(diǎn)擊底部生成按鈕，跳轉(zhuǎn)AI生成圖片頁面，支持用戶在當(dāng)前頁面預(yù)覽圖片、重新生成、修改描述、保存圖片及分享等操作，底部按鈕強(qiáng)引導(dǎo)進(jìn)入裝扮預(yù)覽頁進(jìn)行裝扮。
AI裝扮2期上線后，在入口、輸入頁和裝扮預(yù)覽頁轉(zhuǎn)化較1期均有大幅提升，在輸入難度大于1期的前提下，輸入轉(zhuǎn)化依然高于1期。
以下是一些真實(shí)用戶生成的圖片，不同風(fēng)格的生成質(zhì)量都能達(dá)到理想效果。
3）數(shù)據(jù)指導(dǎo)持續(xù)優(yōu)化
同時(shí)，進(jìn)一步分析漏斗數(shù)據(jù)發(fā)現(xiàn)，雖然整體漏斗數(shù)據(jù)優(yōu)于以往，但是在圖片生成頁的用戶流失較大，于是我們開始探索在滿足用戶預(yù)覽圖片訴求的同時(shí)，是否存在能夠快速進(jìn)入裝扮預(yù)覽頁的方案。
3期我們以簡化操作流程，提升裝扮轉(zhuǎn)化率為目標(biāo)進(jìn)行設(shè)計(jì)方案探索，結(jié)合用戶在創(chuàng)作頁點(diǎn)擊生成按鈕后希望先看到生成圖片的訴求，我們3期的設(shè)計(jì)難點(diǎn)是：
如何在預(yù)覽圖片和減步長中尋找平衡？
考慮到用戶想要先看到生成圖片的訴求，所以在思考方案過程中引入動(dòng)效來銜接頁面之間的變化，減少用戶跳轉(zhuǎn)的可行性。
方向1:縮短主操作路徑，次要功能建立預(yù)期，后置操作；優(yōu)勢是層級簡單，核心操作聚焦
方向2:僅預(yù)覽圖片結(jié)果，后置操作；優(yōu)勢是操作路徑短
根據(jù)框架探索我們細(xì)化了3個(gè)方案：
為了更直觀的展示，我們制作了3個(gè)方案的Demo并進(jìn)行用戶測試，大部分用戶認(rèn)為方案1更直觀且簡潔。
生成中：展示重新生成、保存等相關(guān)操作，建立用戶預(yù)期
生成后：展示生成圖片并自動(dòng)上滑，同時(shí)調(diào)起裝扮預(yù)覽面板，縮短裝扮路徑
對比2期方案，優(yōu)化后方案點(diǎn)擊生成按鈕直達(dá)裝扮預(yù)覽頁，縮短裝扮路徑，上線后日均裝扮成功轉(zhuǎn)化率顯著提升。
本文以百度APP裝扮體驗(yàn)AI創(chuàng)新探索為例，分享了從設(shè)計(jì)視角出發(fā)，設(shè)計(jì)師如何結(jié)合AI能力進(jìn)行設(shè)計(jì)創(chuàng)新，為用戶提供順暢的AI原生體驗(yàn)，并分三步推動(dòng)項(xiàng)目落地與優(yōu)化的思考過程。通過本次項(xiàng)目，我們也積累了一些經(jīng)驗(yàn)分享給大家：
作為設(shè)計(jì)師，可能我們已經(jīng)看過、使用過很多AI類產(chǎn)品，對它的玩法非常熟悉。在設(shè)計(jì)前期，我們常常理所當(dāng)然的認(rèn)為用戶已經(jīng)理解掌握生圖的方法，結(jié)果在測試階段發(fā)現(xiàn)即便是公司內(nèi)部互聯(lián)網(wǎng)員工，理解使用起來也有一定門檻。所以我們一定要避免慣性思維，注意時(shí)刻抽身站在用戶視角，多問問自己：我們的用戶群體是否能夠快速理解并掌握設(shè)計(jì)方案。
2.用戶測試是有效的工具，可以幫助設(shè)計(jì)師獲得更深入的用戶反饋，并將其轉(zhuǎn)化為理想方案設(shè)計(jì)點(diǎn)
整個(gè)過程中，我們遇到了很多困難與挑戰(zhàn)，尤其是在2期輸入體驗(yàn)的優(yōu)化上，在競品創(chuàng)作體驗(yàn)千篇一律且都不理想的情況下，初期思考的方案均沒有達(dá)到簡單且能直接輸入高質(zhì)量描述詞的理想效果，設(shè)計(jì)思路此時(shí)也達(dá)到了瓶頸。這時(shí)候引入用戶測試是一種很好的幫助設(shè)計(jì)師“換腦”的方式，用戶不會(huì)直接告訴我們理想方案是什么，但是我們可以從用戶的反饋中抽絲剝繭，轉(zhuǎn)化成理想方案的設(shè)計(jì)點(diǎn)。
3.設(shè)計(jì)方案應(yīng)盡量簡單直觀，避免需要用戶進(jìn)行過多的思考和轉(zhuǎn)換
通過我們多次的用戶測試發(fā)現(xiàn)，除了大家熟知的設(shè)計(jì)方案應(yīng)該盡量簡單清晰、避免過多的復(fù)雜步驟和操作以外，還應(yīng)該盡量避免用戶需要思考轉(zhuǎn)化的步驟：比如給一段純文字示例讓用戶來生成圖片，這個(gè)文字與圖片生成的效果是需要用戶通過思考并轉(zhuǎn)換的，也許生圖結(jié)果與用戶預(yù)期天差地別。所以在調(diào)研后我們采取了“圖生圖”的方式，用戶喜歡哪張圖片，就使用它的描述詞來生成相似，這樣更加直觀，減少在大腦里轉(zhuǎn)換思考的過程。
以上就是我們的思考全過程與全部心得，希望對大家做類似AI創(chuàng)新型項(xiàng)目有所幫助。百度AI裝扮項(xiàng)目依然在持續(xù)優(yōu)化與完善，歡迎有興趣、有建議的小伙伴，來找我們一起溝通交流～
MEUX,百度移動(dòng)生態(tài)用戶體驗(yàn)設(shè)計(jì)中心，負(fù)責(zé)百度移動(dòng)生態(tài)體系的用戶/商業(yè)產(chǎn)品的全鏈路體驗(yàn)設(shè)計(jì)。服務(wù)的產(chǎn)品包括百度APP、百度搜索、百度百科、百度貼吧、百度商業(yè)產(chǎn)品等。MEUX以「簡單極致」為設(shè)計(jì)理念，創(chuàng)造極致用戶體驗(yàn)的同時(shí)賦能商業(yè)，推動(dòng)設(shè)計(jì)行業(yè)的價(jià)值和影響力，讓生活因設(shè)計(jì)而更美好。
