閒魚互動玩法標準化建設
背景
現在大家對互動玩法應該已經司空見慣,很多APP或多或少都會在業務場景中採用各式各樣的互動玩法來吸引使用者,讓使用者在參與互動的同時,得到平臺權益,進而提升平臺心智,達到促活拉新目的。隨著閒魚規模變大,平臺權益擴充套件,基於任務+抽獎的互動玩法在日常以及大型營銷活動中應用越來越多。
痛點分析
對於活動中的互動玩法,從設計到研發再到驗收上線的流程大致如上,在具體實踐過程中,我們經常會遇到以下問題:
-
底層能力抽象不夠:業務開發同學需要關注玩法底層互動邏輯,不同活動需重複開發,開發成本高;
-
問題難排查:互動玩法的配置包含抽獎、任務、積分等多個平臺,鏈路複雜涉及資料互動多,其中一個環節配置錯誤,都有可能出現任務完成不了、抽獎次數不增加、抽獎不成功等問題,鏈路複雜無疑給排查問題增加了不少困難;
-
配置問題後知後覺:抽獎、任務、積分等配置問題運營無法自助排查,往往需要在測試過程中由測試或者技術同學介入排查,佔用開發時間,嚴重影響活動上線效率。
技術方案
針對上面的痛點,對問題進行抽象,我們期望建設互動玩法標準化,當前階段關鍵解法主要是以下三點:
-
抽象互動能力:實現互動玩法標準化互動,沉澱面向開發者的互動玩法SDK,提高開發效率;
-
建設自助排查能力:在實現玩法在互動配置平臺自測環節中,提供問題除錯排查能力,引導運營自助解決配置問題,只有自測通過後才能提測,從而降低測試成本;
-
統一互動配置平臺:通過統一的閒魚互動配置平臺串聯抽獎、任務、積分配置,建立標準流程,校驗關鍵配置的準確性,讓運營在提測前保證玩法整個流程順暢。
互動任務標準化
大多數情況下,抽獎活動中都會有任務玩法,使用者需要通過完成任務來增加抽獎次數。閒魚的任務體系是使用淘系任務中心進行搭建的。任務與抽獎的鏈路如下圖所示。
閒魚的互動任務有以下幾種型別:
-
僅跳轉:點選任務按鈕,進行頁面跳轉,並將任務引數以url引數形式帶到後鏈路,後鏈路在特定操作後進行任務上報;
-
完成並跳轉:點選任務按鈕,在頁面跳轉同時進行任務上報;
-
瀏覽任務:瀏覽任務與僅跳轉任務類似,除了可以在後鏈路進行任務上報之外,也可以在當前頁面進行任務上報。
關於任務上報,目前閒魚主要有兩種方案:前端上報、事件採集上報。
-
前端上報:當用戶領取任務後,在定製場景下請求任務中心上報服務,完成任務;
-
事件採集上報:閒魚通用事件採集系統對使用者特定行為進行採集,採集到行為資訊後請求任務中心上報服務,完成任務。
下面以兩個典型的任務來介紹任務上報鏈路,分別是會場瀏覽任務和關注閒魚號任務,前者是前端進行任務上報,後者是事件採集進行上報。
在互動任務標準化建設過程中,前端在淘系任務中心的列表元件基礎上,進行二次封裝,簡化元件配置,並且加一些閒魚的定製能力,最終形成閒魚通用的任務列表元件。
互動抽獎標準化
前端在實現抽獎標準化中,主要是抽象抽獎能力,將抽獎通用邏輯封裝成SDK,提高業務開發效率。
-
需求分析
-
在進行抽獎之前,先初始化活動資料,獲取使用者在當前活動中的狀態以及活動本身的相關資料;
-
支援登入狀態校驗,允許使用者未登入時訪問頁面,當用戶進行抽獎時,執行登入邏輯,並且登入返回活動後重新進行活動初始化;
-
支援頁面聚焦後,自動重新整理活動資料,重新初始化活動;
-
抽獎之後,在展示當前抽獎結果的同時,支援自動更新中獎紀錄,並且重新整理活動資料;
-
測試過程中,當抽獎出現異常時,可以及時排查出問題,提供解決問題方法。
-
SDK API
-
初始化
SDK初始化時,除活動配置平臺生成的活動ID外,其他都是選傳。
import Oliver from "@ali/pcom-fin-oliversdk";
const oliverSdk = new Oliver({
/**
* 抽獎活動Id
*/
activityId: '544',
/**
* 其他選項
*/
options: {
/**
* 活動引數
*/
oliverParams: {
/**
* 是否需要權益的詳情,預設false
*/
needBenefits: false,
/**
* 否需要權益詳情,只有抽取的情況下才生效,預設false
*/
needDetails: false,
/**
* 否需要是否已經中獎過的資訊,只有 needDetails 為true時候生效 非必須不要使用效能及其差,預設false
*/
needHadWin: false,
/**
* 擴充套件引數,用於服務端能力擴充套件
*/
extend: {}
},
/**
* 是否需要頁面聚焦後自動重新整理活動資料,預設true
*/
autoUpdate: true,
/**
* 是否需要判斷登入態,預設true
*/
checkLogin: true
},
/**
* 活動資料返回回撥
*/
dataWatcher: (data) => {}
});
-
抽獎
oliverSdk.draw(params: {
// 抽取擴充套件引數
extend?: PlainObject;
// 指定權益抽取
idleOliverBenefitCode?: string
}).then(res => {
// do some things
})
-
獲取權益列表
oliverSdk.getLogs(params: {pageSize: number; curPage: number}).then(res => {
// do some things
})
-
更新活動資料
oliverSdk.update();
-
Hooks
為了降低業務上層開發同學對SDK的使用成本,考慮提供基於集團Rax方案的Hook能力。
業務層開發只需在呼叫方法時,依據資料變化來進行互動展示。這樣既減少了上層程式碼量,同時降低開發成本。下面是Hook的使用程式碼示例:
import useOliver from '@ali/pcom-fin-oliver-raxhook';
// 使用hook
const { oliverData, drawResultData, draw } = useOliver({
activityId: '544'
});
// 監聽活動資料
useEffect(() => {
const availableTimes = oliverData?.availableTimes || 0;
// do some things
}, [oliverData]);
// 監聽抽獎結果
useEffect(() => {
// do some things
}, [drawResultData]);
// 抽獎
draw();
-
自助排查
以往在抽獎活動測試驗收過程中,服務端返回的異常code對於運營和測試同學來說非常不友好,沒有直接展示異常原因,每次都需要技術同學介入來排查問題。為了快速定位問題解決問題,我們考慮提供問題除錯能力,讓運營和測試同學可以自助排查問題。
抽獎SDK中有一個日誌儲存功能,在測試環境中將使用者操作記錄和服務端返回的資料儲存在本地,另外提供一個日誌列表頁面,在頁面中對日誌進行解析,提供異常code的具體原因並提供解決方法,展示給運營和測試同學。自助排查功能使用流程如下圖所示。
互動配置標準化
互動玩法配置鏈路複雜,為了降低配置成本,減少配置錯誤,我們提出配置標準化方案。標準化配置主要解決以下三個問題:
-
標準流程配置:引導運營一步一步進行配置,將複雜的配置鏈路流程化,避免有所遺漏;
-
配置校驗:在配置過程中,會拉取當前步驟中對應的配置進行校驗,提示錯誤配置;
-
完整鏈路測試:在活動提測之前,需要運營自測活動配置,在通用測試頁面中,完成做任務增加抽獎機會到抽取獎勵減少抽獎機會這一完整鏈路,只有自測通過後才能提測。
目前建設的抽獎標準化配置流程如下:
-
選擇投放計劃:拉取當前運營同學在抽獎配置平臺中配置的投放計劃列表,選擇投放計劃後展示投放計劃中的權益配置;
-
權益確定:選擇投放計劃中的權益,並進行限制規則配置;
-
選擇兜底投放計劃:支援選擇當前投放計劃的兜底計劃;
-
高階配置:確定權益發放安全碼配置以及抽獎後扣減的積分配置。
效果
-
互動玩法的標準化實現在閒魚內多個互動場景中落地,如雙11的節後魚生活動、五福主題的魚生有福活動、閒魚幣狂歡日、天天賺錢等。
-
前端對互動邏輯的封裝抽象,互動模組開發效率有顯著提升,開發工時相對減少50%;
-
運營和測試同學使用SDK除錯能力,實現了快速定位問題,開發零成本介入問題排查;
-
運營按照標準流程對互動活動進行配置,在配置過程中,提前檢驗配置的正確性,降低了後續活動測試成本。
總結
互動玩法已然成為一種常用的運營手段,在玩法落地過程中,我們分析痛點,不斷探索,以技術手段降低互動玩法上線成本,並且取得了顯著效果。
在實現互動玩法標準化後,我們會繼續抽象基礎互動玩法,搭建一個玩法模組化的互動玩法平臺,抽象基礎玩法,如抽獎、簽到、抽籤、投票等。在互動玩法平臺上,運營同學可以自助配置玩法,無需開發和測試同學高成本投入,活動上線效率與質量也可以得到有效保障。
- Kraken中事件通道原理分析
- 我在閒魚做搭建——魔魚搭投編輯器介紹
- Flutter富文字編輯器系列文章3——互動篇
- Flutter富文字編輯器系列文章3——互動篇
- 打造Flutter高效能富文字編輯器——渲染篇
- 節日獻禮:Flutter圖片庫重磅開源!
- 節日獻禮:Flutter圖片庫重磅開源!
- 關於閒魚測試資料構造,我有幾條心得
- 關於閒魚測試資料構造,我有幾條心得
- 打造Flutter高效能富文字編輯器——協議篇
- 打造Flutter高效能富文字編輯器——協議篇
- 閒魚前端技術體系的背後——魔魚(良心推薦,從思路到實踐)
- 閒魚如何保障交易鏈路質量
- Flutter 音影片開發的新思路
- 實效性與準確性的背後:多系統資料聚合展示
- Flutter滑動體驗對齊原生-滑動曲線篇
- 閒魚搜尋-成交寬度優化實踐
- 閒魚策略中樞業務擴充套件模組實現
- 閒魚互動玩法標準化建設
- 一條慢SQL引發的改造