B端交互設(shè)計在產(chǎn)品需求全周期中的質(zhì)量保證

2021-11-10    seo達人

為什么需要設(shè)計質(zhì)量保證

在設(shè)計中,最常見的質(zhì)量保證方式就是在產(chǎn)品驗收環(huán)節(jié)進行「設(shè)計走查」。不過因為是上線前的最后驗收環(huán)節(jié)之一,經(jīng)常會出現(xiàn)因臨近上線時間,且交互和UI類的問題在修改優(yōu)先級中一般都是較低的,最后只能修改部分設(shè)計上的「bug」,其他只能舍棄或放入永遠不會開工的下次迭代再改。設(shè)計師在各種來回扯皮之間筋疲力盡,看不到設(shè)計價值在需求中的體現(xiàn),各種“這里設(shè)計不好”的鍋一不小心也接了一堆。更嚴重的問題在于,用戶得不到更優(yōu)秀的體驗,輕則耗費更多時間,重則放棄使用功能。不管哪種結(jié)果,對于產(chǎn)品整體滿意度都會有不同程度的影響。

由此可見,設(shè)計質(zhì)量保證僅靠最后臨門一腳的設(shè)計走查遠遠是不夠的。在需求全周期中各個環(huán)節(jié)都可以加入對設(shè)計質(zhì)量的把控(Design QA)。Design QA的概念來源于研發(fā)流程中測試環(huán)節(jié)。質(zhì)量保證縮寫為QA(Quality Assurance),是產(chǎn)品交付流程中非常重要的一環(huán),一般就是大家了解的測試工程師的崗位職責內(nèi)容。在這個環(huán)節(jié)中,測試人員需要對產(chǎn)品功能進行仔細認證,確認是否滿足了產(chǎn)品需求并且可以正常使用。但與測試不同,設(shè)計QA須加入到產(chǎn)品需求全周期的各個環(huán)節(jié)中,最終形成與產(chǎn)品設(shè)計并行的一個流程,才能有效保證質(zhì)量。

 

設(shè)計QA實施步驟和方案

步驟1: 需求分級,確定是否需要設(shè)計QA

要保證設(shè)計質(zhì)量,在B端設(shè)計中不是易事。我們經(jīng)常會聽到:

· “這個功能能用就行”:公司/團隊不理解或不夠認同設(shè)計價值是什么,不明白為什么體驗會在每一處未還原的設(shè)計稿上慢慢丟失

· “這還原的不挺好,和你設(shè)計稿我看一樣啊”:非專業(yè)的同事無法分辨設(shè)計稿與研發(fā)實現(xiàn)稿的細微差異

· “沒時間改了,下次再說吧”:設(shè)計質(zhì)量保證低于功能質(zhì)量保證,或者團隊必須在有限的時間交付需求

 

在接到需求后可以根據(jù)以往經(jīng)驗或與產(chǎn)品經(jīng)理的溝通,確定本次需求設(shè)計等級:

  • A:公司級和部門級重點、設(shè)計周期長內(nèi)容多、設(shè)計可沉淀輸出的內(nèi)容多的需求
  • B:正常迭代、量級一般的需求
  • C:時間緊迫倒逼排期、無前端研發(fā)資源、少量調(diào)整、評估不需要設(shè)計的需求

在確認等級后,作為設(shè)計師可以有一定的心理預期。對于A類可能各個環(huán)節(jié)都需要詳細的進行QA,而對于C類有可能連設(shè)計走查都沒有預留時間,只能靠后續(xù)線上的直接驗證了。后面的幾個步驟可針對不同的等級選取全部或部分進行實施。

 

步驟2:交互設(shè)計中,考慮極限下的正確展示

B端交互設(shè)計中,很重要卻經(jīng)常制作不到位的就是極限情況??雌饋矶际歉鞣N表格,簡單的給定一個寬度即可,但在上線后經(jīng)常發(fā)現(xiàn),填充了真實商家數(shù)據(jù)的表格,總有意想不到的錯位折行和重要信息截斷,用戶的可閱讀性降低。

圖片

                                             左:重要信息被截斷;右:折行錯位

 

步驟3: 設(shè)計評審與交付,交互說明與UI標注一體化

在完成制作后一定要進行評審,對功能完整性、頁面流程、頁面文案、組件特殊交互邏輯要求、交互可實現(xiàn)性與開發(fā)成本進行評估。項目相關(guān)利益人都需要參加,尤其是測試同事需要參與評審,保證后續(xù)測試用例編寫質(zhì)量。在交互與UI全部評審完成并通過后,交付給研發(fā)的設(shè)計稿最好可以做到交互說明文檔與UI標注一體化,方便研發(fā)同事查看。避免在交互說明與UI標注中來回切換,導致交互或UI細節(jié)遺漏。這里推薦一個sketch插件:NoteBook Pro (需要付費,lite版大約¥76),方便在sketch中添加交互說明標注,在上傳到可以在線查看UI標注的平臺,比如Zeplin/Relay等。

圖片

交互說明+UI標注在一個頁面上同時呈現(xiàn)

 

步驟4: 參加測試用例評審,確保測試用例涵蓋所有交互細節(jié)

一般來說,交互稿與UI稿交付給研發(fā)同學后,設(shè)計師就要開始忙下一個需求了。直到通知設(shè)計走查前,設(shè)計師暫時不會再隨時跟進需求進展,而是交接到產(chǎn)品或項目經(jīng)理手中。而在這個從設(shè)計稿到研發(fā)實現(xiàn)的過程中,設(shè)計師也需要在關(guān)鍵節(jié)點參與其中,確保設(shè)計質(zhì)量。測試用例是其中一個設(shè)計師可以參與的環(huán)節(jié)。其實有時候很多交互文檔中的內(nèi)容會被用作測試用例,所以需要再次和研發(fā)與測試同學對齊所有交互內(nèi)容,保證交互設(shè)計內(nèi)容不會在此階段被降級甚至直接去掉。

 

步驟5:設(shè)計走查,輸出并記錄結(jié)果

此環(huán)節(jié)很重要的一點就是走查文檔或記錄。未完成修改的內(nèi)容,建議研發(fā)給出一個解釋,并以文檔的方式記錄下來抄送給相關(guān)利益人,標明可能帶來的風險。同時嘗試與產(chǎn)品或項目經(jīng)理溝通,推動迭代優(yōu)化的具體時間,避免「下次一定」的無效承諾。

 

總結(jié)

設(shè)計QA是貫穿整個產(chǎn)品需求全周期的設(shè)計流程,在以往的點狀設(shè)計走查之外,需要與團隊上下游通力合作溝通,才能確保優(yōu)秀的產(chǎn)品呈現(xiàn)在用戶面前。

圖片

參考文獻:

https://blog.prototypr.io/the-qa-process-in-ux-design-7cd3ffa771ad

https://www.nngroup.com/articles/quality-assurance-ux/

https://uxdesign.cc/the-importance-of-design-qa-in-digital-product-design-c3f3d128270

https://wearebrain.com/blog/customer-ux-ui/ux-designers-and-qa-engineers-collaboration/

https://owl.tools/notebook-sketch-plugin

 

原文地址:京東設(shè)計中心JDC(公眾號)

作者:唐朋博、李小猛

轉(zhuǎn)載請注明:學UI網(wǎng)》B端交互設(shè)計在產(chǎn)品需求全周期中的質(zhì)量保證

藍藍設(shè)計建立了UI設(shè)計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍藍設(shè)計bouu.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 平面設(shè)計服務(wù)



分享本文至:

日歷

鏈接

個人資料

存檔