# 設計系統討論 #003 20210617

前次會議紀錄：
https://hackmd.io/-j88zbVgTCeN3LEi1PGB3A

### OUTLINE
- update 上次會議內容
- 分享下一動的大致計畫，集思廣益～

### 上次會議小結（與參事、子維）

- 建議先從 PDIS 內部 pilot，同步國發會，待怡君稍微有空時再邀請加入討論
- 由書漾先寫設計規範的大綱，內容最好有重要性的排序，再 cue PDIS 內成員討論
- 還不用生出內容也沒關係，可以先列出有哪些問題是需要思考的，先丟出來讓大家討論
- 也可以參考各國的設計規範，以及目前國發會已經出的數位服務指引
- 目的要讓人看得懂，所以如果有必要，大致的風格指南也可以同時出來
- 進程大約是兩三年的事情，但可以參考數位服務指引推行的過程：
- 全國資訊主管會議中報告試行版
- 行文給各部會
- 一年後如果各部會沒什麼問題（或沒什麼反應）即可轉為正式版
- 接下來，找尋與部會合作的機會，避免紙上談兵
- 最後要做到什麼程度？
- 對於部會來說，要解決痛點，比如說「看完之後，我就知道我接下來幾週該怎麼做」
- 期待管理做好，不斷推出 beta 版
- 可以思考發酵的轉捩點，例如各部會跨部會合作時 -> 「向山致敬」案例

### 計畫：下一動
- 6 月： 內部對齊，挖坑（資訊坑、設計坑、寫作坑/ 風格坑、規範坑、應用坑、承辦心聲代表、廠商心聲代表）
- 7 月： 設計規範初稿製作、風格指南雛形
- 8 月： 互評（討論）、實測（找一兩個內部網站來試用）
- 9 月： 修正、迭代
- 10 月：交出 beta 版

### 坑們

- 規範坑/寫作坑：討論設計規範、列出大綱、在規範坑裡面的人應該要有能力提出該討論的問題，並列舉初步的選項。難以決定時，主動與子維、參事、怡君討論交換意見。初步的大綱產出後，能夠以簡練的語言撰寫出可供人閱讀的文字。一般民眾能大致看懂、設計師、工程師、承辦人員或廠商看完後能夠得到初步的期待管理即可。在規範坑的人可能須能夠參考現成的設計規範，對設計規範的撰寫口吻有一定程度的掌握，與同坑人協力將大綱撰寫為規範初稿。
- 風格坑/設計坑：討論風格指南、在設計軟體（如 Figma）上做出初版的風格指南。風格的形成並非天馬行空，而是需要大量參考現有網站的重複元素，搭配規範的大綱或初稿來逐步迭代製作。在這個坑的人可能要有足夠的耐心、不怕來回修改，也要有細心，對 pixel level 的細節講究。
- 應用坑/資訊坑：主動關心規範與風格坑的進度，在看到技術上不合理之處即時提出。幫忙提出在 PDIS 中可以作為應用練習的網站。在應用坑中必須有人具備將風格中的 component 實作成程式中的 component 的能力。並且要能夠思考在日後應用時，提供程式開發人員什麼樣的 code snippet 較有幫助。
- 承辦心聲代表、廠商心聲代表：在這個坑的人可能要對於公部門的網站開發有一定的經驗，能夠設想承辦人或是廠商的立場。主動關心其他坑的產出，提出對於承辦或會有助於節省溝通成本或是提高工作效率的地方，也就是設計系統能解決到他們什麼問題。這對於日後真的推行時會非常有幫助，免於只是紙上談兵。
- 可以找 PDIS 以外的人某一兩個 PO? / Apple?

| | 6 月 | 7 月 | 8 月 | 9 月 | 10 月 |
| ---- | ------------ | -------------------------- | -------------------------------------------- | ---------- | ------------ |
| 進度 | 內部對齊挖坑 | 設計規範初稿、風格指南雛形 | 互評（討論）、實測（找一兩個內部網站來試行） | 修正、迭代 | 交出 beta 版 |
| 坑(每週投入時間) | Anyone | 規範坑(2~3 小時討論, 4~5 小時自行作業) 、風格坑(2~3 小時討論, 4~5 小時自行作業) | 規範坑(2~3 小時討論, 1~2 小時修改)、風格坑(2~3 小時討論, 1~2 小時修改)、應用坑(2~3 小時討論, 4~5 小時自行作業) | 規範坑、風格坑、應用坑(2~3 小時討論, 1~2 小時修改) | |
| 產出 | 計畫 | 設計規範初稿、資訊架構初稿、風格指南雛形 | 設計規範修正、風格指南修正、Library、Design System 網站雛形 | 設計規範beta版定稿、風格指南beta版定稿、Design System 網站 | 交付、內部網站試做 |

### TODO
確認跳坑：
- 規範坑/ YW, ST, Targee, Wendy, Fang
- 風格坑/ ST, Wendy, Fang
- 應用坑/ Targee, YW, ST, Wendy
- 承辦心聲代表、廠商心聲代表： Targee/Taco, Apple

接下來：
* 6 月先自行研究&準備
* 設計系統的定義：「設計原則」(Design Principle)、「設計規範」(Design Guideline)、「設計規則」(Design Rules)、「風格指南」(Style Guide)。而其中，國發會上架的「數位服務指引」類似於「設計原則」的層次。
* 找一兩個公家機關的設計系統參考
範例：
- [英國的設計系統/GOV.UK Desgin system](https://design-system.service.gov.uk)
- [台灣的數位服務指引/Taiwan Digital Service Guidelines](https://www.ndc.gov.tw/Content_List.aspx?n=E7F6C261A5F5D9F5)
- [澳洲的設計系統/Australia Design System](https://designsystem.gov.au)
- [加拿大英屬哥倫比亞設計系統/British Columbia DevHub](https://developer.gov.bc.ca/Design-System/About-the-Design-System)
- [新加坡的設計系統/singapore design system](https://www.designsystem.tech.gov.sg/about/)
- [美國的設計系統/U.S. Web Design System (USWDS)](https://designsystem.digital.gov/)
* 找一個公司的設計系統參考
* [Google Material Design](https://material.io/design)
* 找一兩個中文的設計系統參考
* https://ant.design/index-cn

* 注意公家機關跟公司的差別
* 注意英文跟中文的差別
* 自由在 channel 上丟連結（儘量要附一段說明文字讓大家知道要看哪裡～看什麼～）
* 下下週約一次自由分享（學習資料、參考連結、摘要 etc）6/30
* 找出一個7月之後適合每週討論的時間。每週二 - 7/6開始