首頁 部落格 幾億人都在用的Google翻譯網頁版,是如何做網頁改版設計的?
Jericho
Mar 16, 2022
網路、科技、滿滿的新知在浩瀚的網路上,想要得到他嗎?沒問題,永遠抱持著謙卑的態度,自然會找到方案!

幾億人都在用的Google翻譯網頁版,是如何做網頁改版設計的?

若要全球用戶票選Google十大服務,搜尋引擎若排名第一,翻譯應該是第二或第三名重要的服務了。即便是Google如此成功的公司,他們在2018年底徹底改版,改版的過程為何?以下是Google翻譯團隊設計師的改版經驗分享:

鑒於 Google Translate 在全球擁有的龐大用戶量,我們從一開始就知道必須為「改版厭惡症」做好準備。很多文章對這一話題進行過探討,譬如通過什麽策略才可以盡可能減少用戶對於產品改版的負面回饋。但對於 Google Translate 這種量級的產品,很多經驗也只有在實際項目過程中才能獲取。以下就是我在這次改版當中學到的最重要的一些東西。

 

以用戶爲鏡

在改版試驗階段,用戶會向我們提交回饋,各類意見褒貶不一,有些讀起來並不舒服,但我們還是花費了大量的時間去閱讀,然後在內部報 bug 或是調整設計方案。譬如在讀過一些回饋意見之後,我們才發現,我們對於 tab 次序的調整嚴重影響了一部分重度用戶的工作效率,於是我們立刻回滾了方案;此外,我們了解到很多用戶在實際場景中都需要看到更多的訊息,於是我們在接下來的疊代方案中提升了頁面訊息密度。

作爲設計師,我們總會希望一次性將最完美的設計方案呈現給用戶;然而對於產品設計而言,分階段進行試驗,通過用戶的真實回饋進行校驗和疊代,才是更爲有效的方式。一旦在這方面建立起成熟的機制,你的用戶就會成爲產品設計最有效的指引。

 

定性研究中的陷阱

可用性測試可以幫助你發現設計當中的重大問題,爲設計方案帶來多方面的評估。通常,這類測試的規模都不大,每次的被測對象不超過十名。在測試期間,你總會忍不住想要問被測對象更喜歡哪個設計方案,但這種問題的結果往往並不可靠,甚至有可能將你引向歧途。

我們在 Google Translate 改版過程中做過很多輪的定性用研,以此來發現和改正先前設計當中的一系列可用性問題。期間,我們也會徵詢被測對象對於新舊版本設計方案的傾向性,絕大多數人都會選擇新版方案;但我們對這類傾向性始終保持謹慎,不想將其作爲設計決策的直接依據。

事實證明,新版方案第一次上線測試時,用戶們通過實際行爲所表達出的傾向性,並不像我們在定性研究中所了解到的那樣高度一致地傾向於新版方案。

 

A/B 測試,可靠的夥伴

我們希望新版 Google Translate 的頁面具有更高的色彩飽和度。

在早期疊代當中,我們使用了一系列色彩豐富的圖標,這些圖標在我們的移動端 app 當中的表現不錯;但通過 A/B 測試,我們發現這些圖標在網頁版本中的表現並不理想,於是最終仍採用了簡潔的 Material Design 風格圖標。

此外,我們還曾經嘗試將翻譯後的文字呈現在藍色背景當中,就像我們在移動端 app 當中做的那樣;而當譯文長度超過一定的篇幅時,我們則會將底色改爲淺灰,使其更易閱讀。

但是我們的一些設計師始終對藍色底色的方案抱有質疑,於是我們決定通過 A/B 測試來進行驗證。其中 A 方案採用了前文描述的模式(根據譯文篇幅調整內容字色與底色),B 方案僅使用淺灰底色。測試結果很明確,A 方案下的用戶使用頻次明顯降低了。

或許對於網頁版的 Google Translate 來說,人們真的不喜歡飽和度如此之高的視覺風格。不過我們也在其他地方繼續嘗試著色彩更爲豐富的元素,例如在運營內容卡片或空狀態頁面中使用的插圖等等。

 

總結

產品改版通常會帶來很大的挑戰,特別是當你無法預先了解人們可能產生怎樣的反應時。通過這次 Google Translate 改版,我所學到的最重要的一課,就是你必須將用戶可能產生的回饋視爲設計過程的重要組成部分,而非試圖去控制或避免那些不確定的要素。

既然產品以用戶爲本,那麼就讓用戶來幫助我們更有效地進行設計。認真規劃每一次的疊代試驗,在足夠大量的樣本當中進行測試,獲取真實用戶的回饋意見,進而提煉出最有價值的數據與訊息,用以制定設計決策。

文章標籤
網站改版
網頁使用視覺平衡設計的優點和好處
網頁使用視覺平衡設計的優點和好處
Jericho
Jericho
Apr 19, 2024
在網頁設計中使用橙色
在網頁設計中使用橙色
Jericho
Jericho
Apr 10, 2024
網頁設計的十大竅門
網頁設計的十大竅門
Jericho
Jericho
Apr 03, 2024