設(shè)計(jì)協(xié)作的發(fā)展歷程
回顧生產(chǎn)方式的發(fā)展歷史，我們可以窺探到團(tuán)隊(duì)協(xié)作的變化。青銅器時(shí)代是以人力為主的作坊式手工生產(chǎn)。到 18 世紀(jì) 60 年代的第一次工業(yè)革命，機(jī)器生產(chǎn)逐漸代替人力生產(chǎn)。再到一戰(zhàn)后，美國(guó)人福特（Henry Ford）和通用汽車(chē)的斯?。ˋlfred Solon），將歐洲人創(chuàng)造的技藝性生產(chǎn)方式改為流水線、大批量生產(chǎn)方式，使制造業(yè)發(fā)生革命性變化。
從發(fā)展歷程看出，不同時(shí)代基于生產(chǎn)目標(biāo)，會(huì)發(fā)展出相應(yīng)的生產(chǎn)工具和協(xié)作方式來(lái)解決團(tuán)隊(duì)的生產(chǎn)效率和質(zhì)量問(wèn)題。
著眼當(dāng)下，現(xiàn)代互聯(lián)網(wǎng)科技高速發(fā)展，軟件生產(chǎn)團(tuán)隊(duì)隨之快速擴(kuò)大。根據(jù)艾瑞網(wǎng)2021年《中國(guó)協(xié)同辦公市場(chǎng)研究報(bào)告》顯示，2020 年中國(guó)的協(xié)同市場(chǎng)增速達(dá)到 43.5%。市場(chǎng)上出現(xiàn)了數(shù)以萬(wàn)計(jì)的協(xié)同產(chǎn)品希望解決團(tuán)隊(duì)中的協(xié)作效率、項(xiàng)目管理等問(wèn)題。
在產(chǎn)研協(xié)作流程中，和設(shè)計(jì)師關(guān)系更加密切的設(shè)計(jì)協(xié)作發(fā)展如何？
在這篇文章中，通過(guò)觀察設(shè)計(jì)工具的變化，我分別從生產(chǎn)創(chuàng)作、設(shè)計(jì)評(píng)審、資源管理三個(gè)維度來(lái)分析其發(fā)展歷程。
f
第一階段：通用單體工具 —— Photoshop / Adobe Illustrator
這個(gè)階段互聯(lián)網(wǎng)剛剛起步，出現(xiàn)了用于完成精細(xì)化圖像設(shè)計(jì)的工具。在 1990 年 2 月，Photoshop 的 1.0 版本正式發(fā)布。Photoshop 是一款位圖編輯軟件，主要處理以像素所構(gòu)成的數(shù)字圖像。因其豐富強(qiáng)大的圖像編輯繪制功能，當(dāng)時(shí)被廣泛應(yīng)用于各行各業(yè)，如早期 PC 端網(wǎng)頁(yè)的 UI 設(shè)計(jì)、門(mén)戶(hù)網(wǎng)站運(yùn)營(yíng)圖設(shè)計(jì)、廣告海報(bào)設(shè)計(jì)、照片后期處理等。
當(dāng) Photoshop 和 Adobe Illustrator 被廣泛的應(yīng)用時(shí)也暴露出明顯的體驗(yàn)問(wèn)題。如，設(shè)計(jì)師交付時(shí)需要手動(dòng)標(biāo)注和切圖。線下設(shè)計(jì)評(píng)審的方式，需要預(yù)定會(huì)議室、協(xié)調(diào)參會(huì)人時(shí)間，效率極低。還有一種常見(jiàn)評(píng)審場(chǎng)景，幾位同學(xué)圍著一位設(shè)計(jì)師的電腦屏幕發(fā)表意見(jiàn)。這樣雖然信息傳遞很直接，但也嚴(yán)重影響了設(shè)計(jì)師的工作體驗(yàn)。
第一階段的創(chuàng)作、評(píng)審、管理資源的效率提升空間很大，隨著互聯(lián)網(wǎng)的發(fā)展上述問(wèn)題影響范圍也隨之?dāng)U大。
2010 年后大而全的工具已經(jīng)無(wú)法滿(mǎn)足設(shè)計(jì)生產(chǎn)需求，針對(duì) UI 領(lǐng)域垂直化工具開(kāi)始替代傳統(tǒng)設(shè)計(jì)工具，出現(xiàn)了細(xì)分垂直領(lǐng)域的設(shè)計(jì)工具 Sketch，Zeplin。
首先在生產(chǎn)創(chuàng)作方面，Sketch 相比 Photoshop 體量更小、占用內(nèi)存更少、響應(yīng)速度更快，這些特點(diǎn)讓設(shè)計(jì)師們逐漸從 Photoshop 切換到 Sketch。將 Sketch 創(chuàng)作的設(shè)計(jì)稿上傳到 Zeplin，可以省去手動(dòng)標(biāo)注切圖的工作，這對(duì)設(shè)計(jì)師生產(chǎn)力的釋放無(wú)疑是巨大的。不過(guò)，Zeplin 本地安裝的方式以及操作流暢度等問(wèn)題，依然阻礙團(tuán)隊(duì)協(xié)作效率的提升。
到第三階段，互聯(lián)網(wǎng)企業(yè)規(guī)模繼續(xù)擴(kuò)大，去中心化的組織結(jié)構(gòu)要求工具不再受平臺(tái)和系統(tǒng)限制，以 Figma、MasterGo 為標(biāo)桿的在線多人實(shí)時(shí)協(xié)作工具應(yīng)運(yùn)而生。（下文以 MasterGo 為代表進(jìn)行闡述。）
MasterGo 通過(guò)將工具云端化，把剛剛我們談到的生產(chǎn)創(chuàng)作、評(píng)審、資源管理融合。對(duì)于設(shè)計(jì)師而言，在線創(chuàng)作后只需要生成一個(gè)分享鏈接，團(tuán)隊(duì)成員即可獲取到最新設(shè)計(jì)稿，節(jié)省之前反復(fù)修改上傳操作；不再需要手動(dòng)標(biāo)注切圖，這些功能對(duì)于設(shè)計(jì)生產(chǎn)力釋放無(wú)疑是巨大的。
同時(shí)，MasterGo 相比 Sketch 更輕量、響應(yīng)更快，這也是其獲得更多設(shè)計(jì)師親睞的原因。對(duì)于團(tuán)隊(duì)，設(shè)計(jì)評(píng)審不再是一件繁瑣耗時(shí)的工作，評(píng)審人可以根據(jù)自己的安排隨時(shí)在線評(píng)審，提出修改意見(jiàn)。
在線的方式，保證了項(xiàng)目信息的互通性，每位成員得到的信息是一致的，最新的，打破了團(tuán)隊(duì)成員之間存在的信息壁壘。
第四階段：產(chǎn)研協(xié)同平臺(tái) —— 藍(lán)湖
國(guó)內(nèi)產(chǎn)研協(xié)作的痛點(diǎn)問(wèn)題
目前國(guó)內(nèi)產(chǎn)研團(tuán)隊(duì)的協(xié)作模型是怎樣的呢？根據(jù)調(diào)研，大部分團(tuán)隊(duì)處于瀑布式開(kāi)發(fā)或敏捷式開(kāi)發(fā)方式。
產(chǎn)品經(jīng)理寫(xiě)完需求文檔分享到團(tuán)隊(duì)內(nèi)部溝通群中，團(tuán)隊(duì)成員在 IM 中提出修改意見(jiàn)，或者線下會(huì)議評(píng)審。產(chǎn)品文檔定稿后，設(shè)計(jì)師根據(jù)產(chǎn)品文檔輸出設(shè)計(jì)稿，并進(jìn)行設(shè)計(jì)評(píng)審。之后進(jìn)入研發(fā)階段，研發(fā)完成后進(jìn)行上線前驗(yàn)收，最后灰度上線。
在這樣的產(chǎn)研流程中，存在非常明顯的幾點(diǎn)問(wèn)題：
1、項(xiàng)目過(guò)程文件割裂，溝通信息流轉(zhuǎn)失真
2、產(chǎn)品文檔設(shè)計(jì)圖評(píng)審體驗(yàn)差
3、低效的手動(dòng)標(biāo)注切圖
一站式產(chǎn)研協(xié)作云平臺(tái)
藍(lán)湖作為一站式產(chǎn)研協(xié)作云平臺(tái)，是如何解決這些問(wèn)題呢？
藍(lán)湖最初被大家認(rèn)可是因?yàn)楦咝У淖詣?dòng)標(biāo)注切圖功能。不過(guò)，除了大家直接使用到的工具屬性外，藍(lán)湖更重要的是作為工具背后的高效協(xié)作和管理的理念。
1、產(chǎn)研團(tuán)隊(duì)資源整合
當(dāng)前藍(lán)湖集中解決產(chǎn)品文檔與設(shè)計(jì)稿的整合，即產(chǎn)品經(jīng)理可以上傳 Axure、word、PDF、PPT 等文檔到藍(lán)湖項(xiàng)目中，設(shè)計(jì)師也可以把項(xiàng)目的 Sketch 、Photoshop、Xd 設(shè)計(jì)稿上傳，這樣每個(gè)團(tuán)隊(duì)成員可以在藍(lán)湖一個(gè)平臺(tái)上基于輸出文檔和設(shè)計(jì)稿無(wú)障礙的溝通協(xié)作。
2、產(chǎn)品文檔、設(shè)計(jì)文件在線協(xié)作評(píng)審
設(shè)計(jì)師將 Sketch 、Photoshop、Xd 的設(shè)計(jì)稿上傳到藍(lán)湖后，團(tuán)隊(duì)成員可以在線評(píng)審，減少線下低效會(huì)議。同時(shí)線上評(píng)審可以精確到設(shè)計(jì)稿的具體某一點(diǎn)提出意見(jiàn)，信息傳遞更精準(zhǔn)，評(píng)審環(huán)節(jié)更高效也更友好。
3、設(shè)計(jì)稿自動(dòng)標(biāo)注切圖，自動(dòng)生成代碼
協(xié)作與藍(lán)湖的未來(lái)
未來(lái)的協(xié)作趨勢(shì)是融合的，藍(lán)湖也在持續(xù)探索最佳的設(shè)計(jì)協(xié)作方式，不斷打破工具的邊界，進(jìn)一步解決產(chǎn)品研發(fā)協(xié)作效率。
藍(lán)湖未來(lái)不僅會(huì)在設(shè)計(jì)協(xié)作每個(gè)節(jié)點(diǎn)滲透更深入，提供更多最佳實(shí)踐。同時(shí)會(huì)在文檔協(xié)作、項(xiàng)目管理、設(shè)計(jì)創(chuàng)作等多個(gè)環(huán)節(jié)提供解決方案。歡迎大家持續(xù)關(guān)注藍(lán)湖～
期待我的分享能對(duì)你有幫助，更期待我們能在藍(lán)湖相遇。
原文地址：藍(lán)湖產(chǎn)品設(shè)計(jì)協(xié)作（公眾號(hào)）
作者：藍(lán)湖產(chǎn)品設(shè)計(jì)協(xié)作
轉(zhuǎn)載請(qǐng)注明：學(xué)UI網(wǎng)》藍(lán)湖產(chǎn)品經(jīng)理：產(chǎn)品設(shè)計(jì)協(xié)作的前世今生
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( tweetduck.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)