2024-3-4 資深UI設(shè)計者
工具所要解決設(shè)計師的痛點是類似的或是專項的比較容易判斷的，細(xì)節(jié)功能、操作體驗、生態(tài)系統(tǒng)，是我們設(shè)計師們所爭相討論的重點。
在我們?nèi)衷O(shè)｜產(chǎn)品設(shè)計社區(qū)里，經(jīng)常會討論一個的話題？就是關(guān)于設(shè)計師在設(shè)計過程中使用哪款工具更好？其實很多設(shè)計工具的主要功能往往都是非常類似的或者是有獨特的偏重，因為工具所要解決設(shè)計師的痛點是類似的或是專項的，因此是比較容易判斷的，然而往往細(xì)節(jié)功能、操作體驗、生態(tài)系統(tǒng)，卻是我們設(shè)計師們所爭相討論的重點。畢竟基本都是細(xì)節(jié)控！
作為一名產(chǎn)品設(shè)計師， Figma、XD 還是 Sketch 哪個最好用？就我而言其實這并不重要，從中了解的哪些優(yōu)勢功能可以更好的賦能日常工作，那些工具更加適合自己或團(tuán)隊。除此之外，推動國產(chǎn)自研工具，恰恰是我們最需要急切的方向。
設(shè)計師很喜歡討論哪個產(chǎn)品設(shè)計工具是最好的
除了那些主流的產(chǎn)品設(shè)計工具之外，我們在產(chǎn)品設(shè)計過程中還會去使用一些不太被關(guān)注的工具，之前也有試用過 Miro、Notion、Google Docs 等提效工具。
在這里，我分享一些我和團(tuán)隊經(jīng)常使用的效率工具。有些小眾工具會在某些節(jié)點上發(fā)揮出奇效果。或許這些工具可能你也有在使用。那就太棒了！英雄所見略同！同時，也歡迎你的留言推薦給更多的設(shè)計師們。
我們都知道，作為產(chǎn)品設(shè)計師日常所涉及的項目屬性（類型）都會有所不同，因此對應(yīng)所需要使用的工具也就會有一些差異。就好比，專注移動端 App 的設(shè)計師和專注 Web 端的設(shè)計師所使用的工具也就會有所不同。除此之外，團(tuán)隊架構(gòu)，協(xié)作流程以及企業(yè)文化也都是其中的影響因素。因此我們求同存異，按照常規(guī)的產(chǎn)品設(shè)計流程拆分 5 個不同階段出發(fā)：調(diào)研 （Research）、構(gòu)思（Ideation）、設(shè)計（Design）、交付（Handoff）和驗收（QA），盤點一下，我使用過的工具。我發(fā)現(xiàn)，目前還沒有一款工具可以包含所有的階段，更多的也在使用國外的工具，難免有點慎思極恐。
好的，我們開始進(jìn)入正題， 使用不同的工具來提高產(chǎn)品設(shè)計流程效率。
你是不是和我一樣有這樣的習(xí)慣，就是在自己的筆記本上寫寫畫畫，記錄平時的想法，也會記錄一些工作的待辦事項。每年公司會發(fā)給我們的企業(yè)筆記本，一年下來我都要用掉好幾本，用紙量巨大。如今團(tuán)隊基本實現(xiàn)無紙化辦公，iPad 替代了筆記本，其中白板工具可以很好的保留我之前的習(xí)慣。同時可以讓我和團(tuán)隊成員在一個平臺上溝通，頭腦風(fēng)暴、組織概念化想法。
在項目會議、設(shè)計沖刺的時候，也能集思廣益、分享想法、共創(chuàng)線框圖。
目前有多種類型的白板工具可供選擇：
國外：Figjam、Miro、WhiteBoard、Mural、Collaboard、Explaineverything、 Lucidspark
國 內(nèi)：Fabrie、博思白板
適用于：調(diào)研階段/構(gòu)思階段/交付階段/設(shè)計 QA 階段
Fabrie 界面
https://kebuxi.datasink.sensorsdata.cn/t/y
注冊碼：fabire
調(diào)研階段：我可以查看、編輯團(tuán)隊每一個成員從不同渠道收集的信息，以便決策一個更加完善的解決方案。產(chǎn)品、研發(fā)、營銷人員也可以以簡單快速的方式，將所有信息放在白板上，向全組內(nèi)成員展示項目不同維度的背景信息。最為便捷的是 可以獲得及時反饋也可以同時注釋和修改。
除此之外，成員可以有條理地組織所收集的信息。可以在白板上構(gòu)建用戶角色、用戶旅程圖和親和圖。大多數(shù)的白板工具都有集成很多專業(yè)模板，這也使得構(gòu)建項目圖表變得更加輕松容易。
構(gòu)思階段：白板工具還有一個很顯著的特點就是大，只要你成為了他們的會員，就擁有了沒有邊界的紙張和無限的容量。這些年費比起之前購買那些筆記本而言，真正不值一提。我們在設(shè)計思維共創(chuàng)，設(shè)計沖刺時，經(jīng)常需要和產(chǎn)品團(tuán)隊討論功能框架、任務(wù)優(yōu)先級以及產(chǎn)品愿景。也通過使用白板工具與項目和開發(fā)規(guī)劃界面和任務(wù)邊界?；蛟S現(xiàn)在還離不開物理的白板，那種帶滾輪的磁吸白板，或是固定在墻上的玻璃白板，或是 A3 紙 ，但最后我們還會習(xí)慣的拍照物理白板上的內(nèi)容，同步到在線白板工具里展示，存檔和共享。
視頻：https://youtu.be/1yUGSWU9qRY
設(shè)計交付階段：我們會整理好用戶流、任務(wù)流和映射圖，其中映射圖可以指定用戶添加到每個值，以及所有節(jié)點的依賴關(guān)系。使用白板工具與開發(fā)人員共享的所有信息。可以確保解決方案在開發(fā)過程后能按計劃預(yù)期設(shè)計實施。
設(shè)計驗收階段：發(fā)現(xiàn)設(shè)計和研發(fā)實現(xiàn)之間存在一些差異，我們會收集所有截圖并對其進(jìn)行糾正。建立一個白板文檔讓開發(fā)人員逐條審查。對于無法通過截圖描述的問題，會附上視頻記錄和設(shè)計稿，并生成一個鏈接，以便研發(fā)可以更清楚了解交互狀態(tài)。
屏幕錄制工具話說在目前的團(tuán)隊中，使用頻次還是蠻高的。使用屏幕截圖或包含聲音的視頻記錄整個屏幕或僅屏幕的特定區(qū)域，同時會附贈描述信息。使用錄屏工具創(chuàng)建視頻文件，可以上傳到云存儲或是白板并與我的團(tuán)隊共享。
現(xiàn)在有許多類型的錄屏軟件可供選擇：
國外：Loom、Quicktime、CloudApp 、 Vimeo
國內(nèi)：暫無
適用于：調(diào)研階段/交付階段/設(shè)計 QA 階段
我比較習(xí)慣使用：蘋果自帶的錄屏工具 Quicktime，目前我還沒有找比較好用的國產(chǎn)工具，如果你有推薦的國產(chǎn)錄屏工具，歡迎你的留言告知。
屏幕錄制工具可用于產(chǎn)品設(shè)計過程中不同領(lǐng)域的研究，例如用戶訪談、可用性測試和基準(zhǔn)營銷。以下是一些示例，可以更好地說明這一點：
基準(zhǔn)營銷：如果處于開發(fā)階段的產(chǎn)品，你正在為產(chǎn)品構(gòu)思解決方案，那么可以通過使用競品找到一些借鑒。在使用競品時，錄制屏幕，就可以之后無需登錄競品就能復(fù)看產(chǎn)品。
交互：錄屏工具還可以記錄不同產(chǎn)品中的交互狀態(tài)。比如，搜索產(chǎn)品的文字提示或者其他組件的交互，當(dāng)發(fā)現(xiàn)一個特別有趣的用戶界面交互的時候，錄下來，作為設(shè)計參考。
在進(jìn)行用戶訪談和可用性測試時，錄屏尤為重要，以便能夠通過重新觀看音視頻以確保沒有任何內(nèi)容的遺漏。
交付階段：也會使用錄屏工具，由于部分交互設(shè)計包含太多細(xì)節(jié)，為讓領(lǐng)導(dǎo)/客戶更好的理解產(chǎn)品設(shè)計方案以及研發(fā)實現(xiàn)后的大致雛形，為了減少研發(fā)成本，也能快速且較為真實的展示匯報材料。因此我們就會保有一個交互式動態(tài)原型之外，還會配備注解的錄屏。這樣就將無形的概念轉(zhuǎn)換成有形的材料，基于這些材料就更容易達(dá)成一致的觀點，以遍探討不同的想法。
設(shè)計 QA 階段：我們會發(fā)現(xiàn)產(chǎn)品的流程或交互存在一些問題，在和研發(fā)溝通多次發(fā)現(xiàn)，截圖、文字并不能清楚地解釋這些問題。久久無法達(dá)成一致的理解，在這種情況下，我們就會通過錄制視頻的方式指出問題的細(xì)節(jié)。
云存儲指的是可以用來存儲文件的云端存儲工具，在我看來云存儲已經(jīng)相當(dāng)?shù)钠毡榱?，就我個人而言，設(shè)計過程中需要大量的素材和參考資料，也會存儲大量的設(shè)計源文件以及商務(wù)文檔。之前，還是使用大容量的桌面硬盤加移動硬盤的方式和團(tuán)隊其他設(shè)計師協(xié)作，在到推動團(tuán)隊建立使用局域網(wǎng) SVN 共享文件，再到現(xiàn)在多終端實時同步，即用即存的云端存儲方式，無論從便捷性還是容量上都已經(jīng)很好的滿足我們團(tuán)隊工作的需求。
國外：Dropbox、Google Drive、OneDrive、iCloud。
國內(nèi)：堅果云、阿里云盤、百度云盤
適用于：調(diào)研階段/交付階段/設(shè)計 QA 階段
對于個人還是團(tuán)隊，云端多人實時協(xié)作也正在變成工具的基礎(chǔ)標(biāo)配，或許我們還需要擔(dān)心的就是你使用的云存儲工具是否安全。目前我個人把所有的設(shè)計相關(guān)的文件都會保存在 iCloud。不得不說蘋果的生態(tài)系統(tǒng)還是非常完善的。然而我正在試圖將文件遷移到華為云空間，還是對國外的企業(yè)保留一些警惕。如果真正替代蘋果，或許不用讓我等待太久。百度云盤是我和我團(tuán)隊最為常用的資料存儲空間，如果你是我們?nèi)衷O(shè)的深度讀者，你就會獲得共享權(quán)限。獲取大量的學(xué)習(xí)資料。
社交媒體常常是我用于產(chǎn)品調(diào)研和提問學(xué)習(xí)的地方。如果你對某些內(nèi)容不理解，或者你對用戶體驗設(shè)計的知識有一些疑惑，那么你可以在一些產(chǎn)品設(shè)計社區(qū)上提問，以便獲得相應(yīng)的知識與見解。
國外：Facebook、Linkedin
國內(nèi)：知乎、脈脈
適用于：調(diào)研階段
由于互聯(lián)網(wǎng)發(fā)展，提供用戶體驗設(shè)計師更多的實踐場景和討論氛圍，除了一些專業(yè)的設(shè)計網(wǎng)站，社交媒體也是獲取調(diào)研數(shù)據(jù)和尋求問題的渠道之一。不僅入駐了大量從事不同行業(yè)的網(wǎng)絡(luò)用戶，也不缺乏對某個行業(yè)有著多年經(jīng)驗的資深專家，我們可以和他們建立聯(lián)系，從而獲取不一樣的見解。其實我們團(tuán)隊也會有自己產(chǎn)品設(shè)計媒體社群，這也是和我們的用戶建立長期產(chǎn)品使用反饋的信息來源。
我個人常駐在 脈脈 和 知乎，很少使用國外社交媒體，偶爾需要和國外設(shè)計師交流，那就會使用 Twitter。在這些社交媒體中，可獲取大量的有用的信息，這也是我試圖跨越固化思維圈層的一種方式。
語音轉(zhuǎn)文字工具是在進(jìn)行用戶訪談、可用性測試以及例行會議中的絕佳選擇。主要是為我們團(tuán)隊解決一個頭痛的問題：我們經(jīng)常組織訪談和會議，發(fā)現(xiàn)內(nèi)容量大，時間又長，實時記錄文字困難，頻繁遺漏重點信息。同時也會引述采訪者說的話，語音轉(zhuǎn)文字就可以減省我們很多打字的時間。
國外：Happy Scribe、Otterr
國內(nèi)：訊飛語記、搜狗聽寫
適用于：調(diào)研階段
調(diào)研階段，我們用研小組進(jìn)行用戶訪談，在每位受訪用戶過程中，我們需要速記他們所說的建議和想法，通過書寫一定是來不及，因此我們都會攜帶錄音筆。等待我們的就是常常需要花費大量的時間整理這些錄音內(nèi)容，自從使用語音轉(zhuǎn)文字的工具，大大減少聲音和文字之間的轉(zhuǎn)換時間。之后，在采訪專家、對話節(jié)目也會使用。同時還附帶了自動糾錯，排除雜音，分離音軌等實用功能。
我們習(xí)慣使用：訊飛語記，作為 三分設(shè) 媒體屬性，語言轉(zhuǎn)文字也是必不可少的工具，作為專家用戶，我們也會給予一些實際的使用反饋。
檢查優(yōu)化文字工具用來改進(jìn)文檔和數(shù)字產(chǎn)品的文案。其中一些工具主要是用于檢查和糾正文案中的拼寫或語法錯誤，另一些則是主要改進(jìn)文案表達(dá)風(fēng)格。我們的營銷創(chuàng)意設(shè)計師通過使用工具來改變文案表達(dá)以便更符合畫面風(fēng)格。設(shè)計一個登陸頁面，工具也可以幫助設(shè)計師改進(jìn)登陸頁面上的文案。
國外：Grammarly、 LanguageTool 檢查正確的拼寫和語法，Wordtune 更改文案風(fēng)格。
國內(nèi)：Effidit智能創(chuàng)作助手
適用于：交付階段
Wordtune 是一個改善寫作風(fēng)格的好工具
交付階段：檢查/優(yōu)化文字內(nèi)容在體驗、營銷文案層面，常會使用這些工具，幫助我們減少基本的錯誤。這些工具很多都是運用人工智能算法，也就大大加速工作效率和準(zhǔn)確率。我們的公眾號后臺編輯也是有類似的檢查文字錯誤的功能插件。設(shè)計師在復(fù)驗文章一眼就可以看大錯別字和簡單語言不通順的標(biāo)注部分。話說我們團(tuán)隊的知識庫也有文字糾錯功能。
知識庫已經(jīng)成為團(tuán)隊不可缺失的部分，我們使用工具來記錄和共享知識。團(tuán)隊可以在這類工具中創(chuàng)建一個空間，用于保存與產(chǎn)品或項目相關(guān)的所有信息。在團(tuán)隊中建立一個不斷完善的知識生態(tài)，往往這也是作為有價值的團(tuán)隊資產(chǎn)。
國外：Notion、Confluence bit.ai、Slite
國內(nèi)：語雀、公眾號、知識星球
適用于：調(diào)研階段/構(gòu)思階段/交付階段/設(shè)計 QA 階段
語雀 -三分設(shè)知識庫·收集 100+UED 團(tuán)隊文章
目前很多知識庫工具層出不窮，也增強(qiáng)了一些存儲空間，知識庫或是文檔工具可以很輕松創(chuàng)建用戶訪談和可用性測試腳本，我們可以使用范例模板。然后將收集到的所有信息整理并寫入知識庫。多人協(xié)作也成為標(biāo)配功能，以這種方式共享信息讓團(tuán)隊中的每個人成為設(shè)計資源的主人。
我們團(tuán)隊也推動建立了研發(fā)、產(chǎn)品、設(shè)計師知識庫，并且相互打通有關(guān)領(lǐng)域的內(nèi)容，為了可以充分了解我們的產(chǎn)品，我們有必要了解產(chǎn)品后臺運作和歷史版本進(jìn)程。例如，團(tuán)隊可能已經(jīng)決定暫時不添加批量操作，因為這對用戶來說不是最重要的功能，他們希望專注于產(chǎn)品的其他領(lǐng)域。通過以書面形式提供這些信息，我們團(tuán)隊所有相關(guān)人員將能夠查看團(tuán)隊當(dāng)初決策方案和原因。
此外，記錄這些信息很有幫助。一般來說，我們會忘記我們認(rèn)可的內(nèi)容，所以如果你從產(chǎn)品設(shè)計階段就開始管理記錄內(nèi)容，能夠以后回顧以驗證設(shè)計決策。沉淀為知識，知識也就不會成為孤島。
項目管理工具主要為了跟蹤項目的進(jìn)度?？梢詭椭芾砣蝿?wù)、設(shè)定截止日期以及將大任務(wù)分解為各種子任務(wù)。通常，這些工具由產(chǎn)品經(jīng)理或產(chǎn)品負(fù)責(zé)人管理。作為設(shè)計主管，我可以看到成員個人的任務(wù)和團(tuán)隊的任務(wù)以及數(shù)據(jù)。但是，有些設(shè)計師不愿意使用這些工具，他們認(rèn)為這些工具更側(cè)重于開發(fā)而不是產(chǎn)品設(shè)計。然而我建議團(tuán)隊的所有人花一些時間來了解這些工具，這會加強(qiáng)團(tuán)隊成員對項目進(jìn)程的掌握。
國外：Monday、Notion、ClickUp、Trello、Jira
國內(nèi)：TAPD、PingCode、Worktile
適用于：調(diào)研階段/構(gòu)思階段/交付階段/設(shè)計 QA 階段
騰訊 TAPD 一站式敏捷研發(fā)協(xié)作云平臺
我相信不必寫很多，因為大多數(shù)設(shè)計師都熟悉這種類型的工具，它是我們設(shè)計過程中的主要工具。
國外：Figma、Sketch、Adobe XD、Balsamiq、InVision Studio、Framer、UXpin
國內(nèi)：Pixso、MasterGo、即時設(shè)計
適用于：構(gòu)思階段/設(shè)計階段/交付階段
MasterGo，羅永浩推薦的設(shè)計工具
mastergo.com
作為用戶體驗設(shè)計，應(yīng)該不會陌生這些軟件，然而并不是每一款設(shè)計工具大家都會通過長時間使用而做出判斷是否繼續(xù)還是更換其他工具。這里也就我們團(tuán)隊的使用情況而言，我們還是在使用 Sketch。因為根據(jù)團(tuán)隊實際工作年限和配合模式以及數(shù)據(jù)安全等方面，更偏向于這款件，就是因為數(shù)據(jù)安全的原因，也就屏蔽了云端團(tuán)隊共享功能，也是說，我們目前也未最大化使用這款設(shè)計工具，非常遺憾。我們至始至終并未打算過更換 XD，一方面也會遇到同樣的狀況，功能基本相同。最為主要的原因還是在，如果從新將產(chǎn)品、研發(fā)也隨我們的交付文檔的更換而要適應(yīng)新的軟件工具，其實有一定困難的。關(guān)于組建庫的遷移其實也會產(chǎn)生新的工作。
3 年前，我們開始推動團(tuán)隊使用更為效率的工具 Figma，也將一些 Sketch 文件和規(guī)范資料陸續(xù)轉(zhuǎn)移到這款工具中，日常的協(xié)作也逐步遷移了過去，度過一段操作學(xué)習(xí)和內(nèi)外部推動過程陣痛期。也確實大大提升了團(tuán)隊之間的協(xié)作效率。
萬萬沒有想到，是我對國外工具的認(rèn)知不夠， Figma 數(shù)據(jù)和使用安全方面是需要我們不得不防范的雷區(qū)。因此我決議讓團(tuán)隊還是退回到 Sketch 。而 MasterGo 的功能和生態(tài)卻是我們團(tuán)隊無法入駐的最大阻礙，為了支持我們自研產(chǎn)品，三分設(shè)內(nèi)部編輯和設(shè)計師還是主推 MasterGo ，因為他們暫時沒有更精密的協(xié)作場景。期待更多的功能和體驗的提升。
……
就此，大致介紹我和我們團(tuán)隊在設(shè)計過程中所涉及到的提效工具，想必你也有屬于自己的好用工具，這里歡迎你可以文末留言告之于我。最后也由衷希望，我們國產(chǎn)自研產(chǎn)品能夠崛起。
原文標(biāo)題：Tools to make a great product design process
原創(chuàng)作者：Edward Chechique
原文鏈接：https://medium.com/ux-planet/tools-to-make-a-great-product-design-process-9ac02f81895e
翻譯作者：顧慧穎
授權(quán)獲取：張聿彤
文章審核：王翎旭
文章編輯：王鴻飛
該譯文并非完整原文，內(nèi)容已做部分調(diào)整。如在閱讀過程中發(fā)現(xiàn)錯誤與疏漏之處，歡迎不吝指出。如需轉(zhuǎn)載，請注明來自 三分設(shè)
藍(lán)藍(lán)設(shè)計( yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)。
藍(lán)藍(lán)設(shè)計的小編 http://yvirxh.cn