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