谷歌翻譯網(wǎng)頁版,是如何做改版設(shè)計的?

0 評論 3767 瀏覽 7 收藏 8 分鐘

既然產(chǎn)品以用戶為本,那么就讓用戶來幫助我們更有效地進(jìn)行設(shè)計。認(rèn)真規(guī)劃每一次的迭代試驗,在足夠大量的樣本當(dāng)中進(jìn)行測試,獲取真實用戶的反饋意見,進(jìn)而提煉出最有價值的數(shù)據(jù)與信息,用以制定設(shè)計決策。

各位午安,真的快要六月份了,天就這么嗡的一下熱起來了,神經(jīng)質(zhì)一般的風(fēng)雨怕是沒太多機會任性了,接下來的梅雨季又是另一種脾氣了吧。

周末得空做篇譯文,來自 Google Translate 團隊設(shè)計師的改版經(jīng)驗分享。今年前幾個月有太多譯文出自合作作者,近來重新開始自己做譯,每次都感到輕松暢快、簡單有趣;這才像事情應(yīng)該有的樣子,下面進(jìn)入譯文。

Google Translate 改版經(jīng)驗談

2018年底,我們上線了基于響應(yīng)式布局和 Material Design 打造的全新網(wǎng)頁版本 Google Translate。

鑒于 Google Translate 在全球擁有的龐大用戶量,我們從一開始就知道必須為“改版厭惡癥”做好準(zhǔn)備。很多文章對這一話題進(jìn)行過探討,譬如通過怎樣的策略盡可能減少將用戶對于產(chǎn)品改版的負(fù)面反饋。但對于 Google Translate 這種量級的產(chǎn)品,很多經(jīng)驗也只有在實際項目過程中才能獲取。

以下就是我在這次改版當(dāng)中學(xué)到的最重要的一些東西:

以用戶為鏡

如果你了解過“改版厭惡癥”,那么對于下面這張圖表可能并不陌生:

Google Translate 改版經(jīng)驗談

圖中所展示的是產(chǎn)品改版可能帶來的不同類型的結(jié)果,不過顯然,你無法通過圖表對你的改版結(jié)果進(jìn)行預(yù)測。對于改版結(jié)果缺乏明晰的認(rèn)知與控制力,這使我在項目初期感到無所適從。但隨著每一次試驗性的迭代,我逐漸意識到,我們的用戶一直在通過他們的實際行為與反饋來指導(dǎo)著我們的前進(jìn)方向。

在改版試驗階段,用戶會向我們提交反饋,各類意見褒貶不一,有些讀起來并不舒服,但我們還是花費了大量的時間去閱讀,然后在內(nèi)部報 bug 或是調(diào)整設(shè)計方案。

譬如在讀過一些反饋意見之后,我們才發(fā)現(xiàn),我們對于 tab 次序的調(diào)整嚴(yán)重影響了一部分重度用戶的工作效率,于是我們立刻回滾了方案。此外,我們了解到很多用戶在實際場景中都需要看到更多的信息,于是我們在接下來的迭代方案中提升了頁面的信息密度。

作為設(shè)計師,我們總會希望一次性將最完美的設(shè)計方案呈現(xiàn)給用戶。然而對于產(chǎn)品設(shè)計而言,分階段進(jìn)行試驗,通過用戶的真實反饋進(jìn)行校驗和迭代,才是更為有效的方式。一旦在這方面建立起成熟的機制,你的用戶就會成為產(chǎn)品設(shè)計最有效的指引。

定性研究中的陷阱

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

我們在 Google Translate 改版過程中做過很多輪的定性用研,以此來發(fā)現(xiàn)和改正先前設(shè)計當(dāng)中的一系列可用性問題。期間,我們也會征詢被測對象對于新舊版本設(shè)計方案的傾向性,絕大多數(shù)人都會選擇新版方案,但我們對這類傾向性始終保持謹(jǐn)慎,不想將其作為設(shè)計決策的直接依據(jù)。

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

A/B 測試,可靠的伙伴

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

在早期迭代當(dāng)中,我們使用了一系列色彩豐富的圖標(biāo),這些圖標(biāo)在我們的移動端 app 當(dāng)中的表現(xiàn)不錯。但通過 A/B 測試,我們發(fā)現(xiàn)這些圖標(biāo)在網(wǎng)頁版本中的表現(xiàn)并不理想,于是最終仍采用了簡潔的 Material Design 風(fēng)格圖標(biāo)。

此外,我們還曾經(jīng)嘗試將翻譯后的文字呈現(xiàn)在藍(lán)色背景當(dāng)中,就像我們在移動端 app 當(dāng)中做的那樣,而當(dāng)譯文長度超過一定的篇幅時,我們則會將底色改為淺灰,使其更易閱讀。

Google Translate 改版經(jīng)驗談

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

或許對于網(wǎng)頁版的 Google Translate 來說,人們真的不喜歡飽和度如此之高的視覺風(fēng)格。不過我們也在其他地方繼續(xù)嘗試著色彩更為豐富的元素,例如在運營內(nèi)容卡片或空狀態(tài)頁面中使用的插圖等等。

小結(jié)

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

既然產(chǎn)品以用戶為本,那么就讓用戶來幫助我們更有效地進(jìn)行設(shè)計。認(rèn)真規(guī)劃每一次的迭代試驗,在足夠大量的樣本當(dāng)中進(jìn)行測試,獲取真實用戶的反饋意見,進(jìn)而提煉出最有價值的數(shù)據(jù)與信息,用以制定設(shè)計決策。

 

原文:https://medium.com/google-design/3-ux-takeaways-from-redesigning-google-translate-3184038f43bf

作者:Pendar Yousefi

譯者:C7210 | Beforweb,公眾號:Beforweb(ID:beforweb)

來源:https://mp.weixin.qq.com/s/18a7pcpxmw-rMfuZRTon8g

本文由 @Beforweb 授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)作者許可,禁止轉(zhuǎn)載

題圖來自Unsplash,基于CC0協(xié)議

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發(fā)揮!