每當我們將公司網站推出上線後,負責產品的PO同事,就開始進入了反覆的優化改善程序,其中,肯定會使用的一項工具當屬「產品實驗」—一般常見的分為A/B版本測試(A/B tests)與多變數測試(MVT, Multivriate tests)。實驗的目的為,只要透過不同的變數修改(例如標題、顏色、圖片以及排版...等),進行分群測試後,就能以數據觀察與佐證,得出一個更佳解,進而優化整體產品體驗。
其實早在2017年時,Google就已推出了Google Optimize的最佳化工具,在免費的版本底下,藏有豐富的實驗測試功能,以及可與Google分析工具進行整合匯入,包含了受眾定位、Ads廣告、目標轉換...等。Google Optimize由於具備以上這些優勢,所以就成為了我在「貪小便宜,與不想花錢買工具」心態下的首選了!
下面我就針對Google Optimize來進行簡單的教學示範,涵蓋了建立Google Optimize容器、導入到GTM、與GA4整合、開啟實驗、檢視實驗數據等五個構面。
建立Google Optimize容器
在GA4剛推出時,Google Optimize還無法整合到GA4資源裡,好消息是目前Beta版已經可以進行連結,而關於GA4與Unversal Analytics的整合功能差異,官方有清楚的說明。
接下來,就可進入我們創建好的容器,點選網頁右上方的「設定」,複製容器ID。
另外,有一個容易忽略的細節,就是我們還需要在頁面上安裝
Optimize anti-flicker(防網頁閃爍)代碼,
此代碼片段可確保非同步載入Optimize容器,使得用戶在通過實驗修改前,不會看到初始頁面內容---
官方安裝說明文件。
以GTM導入安裝Google Optimize
上述的作業都完成後,就可以打開我們平常在使用的GTM,新增一個標籤,於標籤模板中選擇Google Optimize,並貼上我們剛剛複製的容器ID,儲存後不要添加任何的觸發條件。
再來,我們返回去選擇原先GA4的Configuration主設定代碼,在進階設定->代碼觸發順序中,勾選在GA4的Configuration設定代碼觸發前,需先觸發前面設定的Google Optimize代碼。
保存代碼並進行預覽,都沒有錯誤後,就可將更改發布到正式環境中。
Google Optimize連結到GA4
同樣地,我們到Google Optimize介面,點選容器後,開啟容器設定->評估->連結至Analytics(分析),接下來,選擇我們要連結的GA4資源與串流。
按下連結,一切大功告成,我們接著就可正式透過Google Optimize進行優化實驗了。
創建我們的第一個實驗
創建實驗第一步,建立實驗,並為實驗命名,填入實驗編輯頁網址,然後我們這次示範的是最基本的「A/B版本測試」。
進入實驗建立頁面後,首先必須滑鼠滾輪到最底部「設定」區域,檢查「最佳化工具」安裝狀態,看到顯示綠色勾勾後,代表著安裝是沒有問題的。
新增變化版本,並替其命名。
這時候我們會有兩種網頁版本,「原始網頁」是默認狀態下用戶看到的版本,而「變化版本1」則是我們可做修改的內容,如何優化使用介面並非此篇的重點,所以我們點選「編輯」按鈕,簡單修改了H1的位置,將H1從置中換成靠左。
完成後,進行到第三步驟,檢查有正確連結到我們所要觀測的Google Analytics資源,並選取預計評估優劣比較的衡量目標,此時可透過GA4內建的系統清單中做選擇,或者是建立自訂目標,這裡我們選擇「購買」事件。
確認完成全部的設定後,就可按下右上角的開始鍵,讓實驗正式啟動。
目前GA4的實驗進行時間限制最多為35天,但我認為之後應該會增加,所以建議大家還是要偶爾查看Google的官方消息或文檔,去了解GA4的功能更新狀態。
檢視實驗數據
關於在Google Optimize介面上檢視實驗數據這部分,由於
官方文件都有清楚的說明,我這邊就不再針對此處進行教學,換個角度思考,反而想示範一下如何利用GA4的自訂報表來整合Google Optimize的數據,來吧,我們一步步解決這問題。
首先,需知道當我們以Google Optimize進行實驗,會出現一個Event Name = experiment_impression的事件,且它會帶上參數experient_id與variant_id。
Parameter
- experient_id = nQ8ksxoqTHWfTh-NOIuKfQ
- variant_id = nQ8ksxoqTHWfTh-NOIuKfQ.0(以0結尾就代表著原始網頁) 或者是 nQ8ksxoqTHWfTh-NOIuKfQ.1(以1結尾就代表著變化版本)
但到目前撰寫這篇文章為止,GA4尚未將這兩個參數設為自訂維度,預設報表中是無法使用的,所以我們就必須手動將參數加入於自訂維度中,Admin->Custom definitions->Create sustom dimensions。
經過資料蒐集一段時間後,我們就可以在GA左邊側欄的Explore中建立一個Free form的自訂報表,得出一個簡易的數據分析觀察,如下圖:
但僅僅知道在不同版本下使用的人數,洞察上的意義是不太足夠的,可另外加上Segment區隔來做更進階的分析。例如,我們這邊可以設定兩個區隔,一個是在同一工作階段中,當使用者看到原始網頁後,有進行purchase目標轉換,以及另一個是在同一工作階段中,當使用者看到變化版本後,有進行purchase目標轉換,至於使用怎樣的區隔與欄位組合搭配,就完全取決於各位朋友的想像力,這篇就不另外做示範了!
以上,就是我們小小的Google Optimize與GA4整合教學示範,請大家放心服用,還有任何關於數據分析上的問題,再請不吝留言,感謝,掰囉~