趨勢科技DesignOps實作經驗分享
嗨，各位UX四神湯的讀者們大家好，今天要跟大家聊的事情是最近hen夯的設計運營(DesignOps)。本文的內容會以趨勢科技的DesignOps實作經驗分享為主，和各位分享趨勢科技的設計部門是如何在快速開發迭代的世界中，持續透過DesignOps的運作來產出高品質的設計文件。
什麼是設計運營DesignOps?
根據NN/g (Nielsen Norman Group)在2019年的定義：設計運營DesignOps為
“透過協調和優化人員、流程和技能來擴大設計的價值和影響規模。”
並將DesignOps的內容架構分為以下這三大區塊九大元素：
各區塊與元素的詳細定義，大家可以參考NN/g的DesignOps101文章，以及DesignOps FAQ，筆者就不在本文贅述。
趨勢科技裡的設計運營
那麼，讓我們依據NN/g提出內容架構來一一細談趨勢科技的現況(以下編號對應於DesignOps框架圖)：
(以下內容以趨勢科技HIE大型企業團隊為例)
1.1 組織架構、團隊組成與角色分工
趨勢科技中有獨立的UX部門，稱為HIE (Human Interface Engineering)，在全球各研發中心皆有成員，遍佈台灣、日本、中國、加拿大、美國、澳洲。在HIE中，共有五種職能：
- 使用者經驗研究員(UX Researcher，簡稱UXR)
- 使用者經驗設計師(UX Designer，趨勢內部稱為UI Designer，簡稱UID)，主要工作為操作流程設計(User Flow Design)，產出線框圖(Wireframe)，並交由介面視覺設計師進行細節設計(Detail Design)。
- 介面視覺設計師(UI Designer，趨勢內部稱為Visual Designer，簡稱VD)，主要工作為介面細節設計與微動畫設計(Motion Graphic Design)，產出介面設計完稿。
- 前端工程師(Front-end Developer，簡稱FED)
- 技術寫作人員(Technical Writer，簡稱Writer)
除了HIE，趨勢科技內還包含了
- 產品開發與運營團隊(Product DevOps Team，簡稱產品團隊，PDG，Product Development Group)
- 產品經理團隊(PM Group)
- 核心技術開發團隊(Core Tech Team)
- 技術支援團隊(Support Group)
- 銷售團隊(Sales Team)。
在趨勢科技裡，通常UI Designer、Visual Designer與Technical Writer會固定搭配，並一同支援產品團隊，而產品經理團隊中也會指定一位產品經理與產品開團隊合作，形成一跨部門的開發團隊，如下圖所示。
而當產品團隊彼此之間也需要合作共同開發同一複雜產品時，整體的團隊組成就會擴大，如下圖所示。圖中表示四組開發團隊共同協作，而此時產品經理團隊與HIE也會擴大支援形成四大組跨部門的共同協作團隊。
此時，在HIE內部就必須進行組內(UID-VD-Writer)與組間(UID-UID)的討論。在這樣的時刻，設計運營的運作就顯得特別重要，幫助設計師在快速且複雜的開發中同時兼顧設計品質。
1.2 協作會議與流程討論
1.2.1 以開發為目的的跨團隊協作會議
趨勢科技的開發團隊有的以兩週為一個開發衝刺(Sprint)，有的團隊則是三週或四週，由開發團隊自行決定。以下內容以兩週為開發衝刺的週期為例：
在Sprint 0時，目標為定義與計劃接下來的任務(task)，通常產品經理(Product Manager，PM)與專案經理(ProJect Manager，JM)還有系統架構師(Architect)與UID會積極討論，將PM所開出來的需求進行拆解、排序與排程，而HIE內部也會進行資源協調，確認在Sprint 1結束時能夠如期交付設計稿。
Sprint 1，目標為遞交設計稿，在Sprint開始時會先進行衝刺啟動會議(Sprint Kick-off Meeting)，並且邀請UID、VD與Writer與會，確認所有團隊成員都具備統一的任務與目標共識。
接下來，UID就會開始進行操作流程(User Flow)的設計，並在Sprint 1的PM/JM/HIE 會議中提出不預期的狀況或報告進度，並且在Sprint 1的第一週與開發團隊進行設計審查(Design Review)並幫助開發團隊開始進行開發架構設計(Architect Design)。當UID完成操作流程後，會通知VD與Writer，並在Sprint 1結束前共同遞交最終的設計完稿。
Sprint 2的目標則是開發，在Sprint 2的過程中，設計團隊的主要工作是與開發團隊溝通，確認設計稿有被確實開發，並在Sprint 2結束時共同參與最終的Demo Meeting。
1.2.2 HIE內部知識共享、設計批判(Design Critique)會議
在HIE裡，每週會進行兩次的內部知識共享與設計批判的會議，趨勢內部稱為Peer Review，通常由UID與UXR參與。會議中UID拿出自己所設計的線框圖向各位HIE成員解釋設計的背景、操作流程、技術限制並讓各位HIE成員提出建議，而UXR也會在會議中向各位HIE成員解釋研究計劃、研究方法並闡述研究結果並回答各位成員的問題。
1.2.3 DesignOps討論會議
除了上述兩種會議外，HIE每週還有一個固定會議進行DesignOps相關的討論，討論的議題包含：設計風格指引(Style Guideline)、版本控制(Version Control)、數據分析(Data Analytics)、設計流程優化(Practice Optimization)、工具探索(Tool Survey)、設計系統(Design System)等議題，有效的協助各位HIE成員適應各種不同的新工具與新流程。
2.1 設計流程與工具
趨勢科技HIE Enterprise Team所使用的設計工具是Figma，設計流程與一般敏捷開發流程(Agile)一致。那麼，就讓我們來談談趨勢科技團隊是如何使用Figma來進行敏捷開發，並且建立設計運營系統的吧！
(Figma與其他設計工具的比較、敏捷開發流程等相關的資訊，請各位讀者參考豐富的網路資源，筆者不在此文贅述。）
2.1.1 Figma 設計元件庫 (Figma Asset Library)
首先，Visual Designer們在Figma中建立了設計元件庫，如下圖所示，支援UID與VD在繪製UI設計稿時使用各種各樣的元件，一方面既可以減少繪製設計元件的時間，又可以控管設計品質，藉以維護設計一致性。
2.1.2 確認操作流程(User Flow)、介面視覺設計(Visual Design)與文字(Wording)
由於Figma的一大優勢為即時共編功能，因此，UID、VD與Writer可以同時在同一檔案進行編輯。當UID一確定操作流程後，VD與Writer即可開始進行介面細節設計與文字編輯。因此，在趨勢科技的Figma設計檔案中，在每一畫面上方都會有UID、VD與Writer的編輯狀態，並在UID、VD與Writer完成各自的工作後，在畫面上方將編輯狀態標示為完成，並附上完成時間，如下圖所示。
2.2 設計系統(Design System)、研究資料庫(Research Repository)與數位資產管理系統(Digital Asset Management)
2.2.1元件庫(Component Library)、設計變量(Design Token)
在趨勢科技裡，除了HIE內部有前端工程師外，PDG內也有前端工程師，然而這兩群前端工程師的工作內容卻不盡相同。PDG內的前端工程師的主要工作內容為產品開發，而HIE內部的前端工程師的主要工作則是開發與維護設計元件的程式碼並利用趨勢科技內部網頁服務的方式供PDG的前端工程師使用。這些設計元件的程式碼也計畫採用設計變量(Design Token)的概念，藉以幫助PDG的前端工程師來維護前端程式碼。各位感興趣的小夥伴們可以看看這個由趨勢HIE前端工程師維護的Github(也在此感謝其他有參與Styled-UI計劃的PDG FED)。
2.2.2 研究資料庫(Research Repository)
除了元件外，HIE的UXR們也與前端(全棧)工程師一同利用了網頁服務在趨勢科技內部建立了研究資料庫供趨勢員工查找研究報告(如下圖)。
2.2.3 數位資產管理系統(Digital Asset Management)
而說到設計稿的集中管理中心，由於趨勢科技購買了Figma的Enterprise專案，因此Figma也就成為了HIE的設計稿管理中心了。
以上，這些由趨勢科技HIE所創造的設計元件庫與研究資料庫，讓各位設計師與工程師在複雜且龐大的產品開發流程中，不僅幫助了設計師們能夠快速且高品質的產出設計稿外，也幫助了前端工程師快速的開發出軟體介面。
最後，關於如何利用數據的力量衡量操作流程或產品功能等趨勢科技的實作經驗分享，筆者會再專門寫一篇文章為各位解說。而至於設計部門人員的運營，包含招募、訓練等相關議題筆者參與的不多，請各位期待有緣見到趨勢科技管理層大大時再多向他們探聽好惹。
以上，趨勢科技的DesignOps分享告此結束，感謝各位讀者的閱讀，也期待與你的下次見面油~~
