在 Vector Studio 中為每個圖示建立一個正方形畫板，然後使用 Slice Studio 以所需尺寸匯出個別檔案。這套 Mac 工作流程涵蓋一致的畫板尺寸、清楚的命名，以及會影響切片匯出的文件 DPI 設定。

本指南依據目前 Affinity 桌面版說明中心的內容撰寫，其介面使用 Vector Studio 和 Slice Studio。任務是在同一份文件中建立一組小型圖示，並個別匯出每個圖示。Affinity 說明了 Vector Studio 中的畫板工具，以及透過 Slice Studio 同時匯出多個畫板的方式。畫板工具、匯出畫板。

判斷哪些差異需要使用不同畫板

每個不同的圖示繪圖使用一個畫板。在這個示範專案中，請在各自的 64 × 64 px 畫板上建立三個中性的幾何圖示：圓形、正方形和菱形。每個繪圖都有一致的畫布，即使可見圖形佔用的空間較小也一樣。

如果同一個繪圖只需要輸出成不同尺寸，請將它留在一個畫板上，並設定多個匯出尺寸。Affinity 支援在每個切片的匯出設定中使用多種格式和尺寸。如果你想分別編輯繪圖，例如製作間距不同的簡化小尺寸版本，使用不同畫板就很實用。這是根據匯出功能做出的設計選擇，而非 Affinity 的要求。切片面板。

需求 建議設定
三個畫布尺寸相同的不同圖示 三個尺寸相同的畫板
同一個未變更的繪圖匯出成多種尺寸 一個畫板，搭配多個切片匯出尺寸
小尺寸圖示需要不同幾何形狀 為修改後的繪圖建立個別畫板
匯出單一圖示檔以供檢視 在「匯出」對話框中選取已命名的畫板

在這個範例中，預計建立三個畫板，每個畫板輸出兩種 PNG 尺寸：64 × 64 px 和 128 × 128 px。預期會得到六個檔案。這個簡單的輸出數量可讓你在匯出後進行具體檢查。

精確建立第一個圖示畫板

在 Vector Studio 中開始，選擇 File > New。將 Document units 設為像素，Page width 和 Page height 設為 64 px，並在此範例中將 DPI 設為 72。若要使用未繪製底色的背景，請啟用 Transparent background，並在建立文件前啟用畫板選項。建立新文件的說明將此選項稱為 Artboards；畫板專屬說明則稱為 Create artboard。建立新文件、新增和移除畫板。

此處刻意設定為 72 DPI。Affinity 的 Slice Studio 說明範例顯示，64 × 64 px 的文件在 72 DPI 下，1x 匯出尺寸為 64 × 64 px，2x 匯出尺寸則為 128 × 128 px。其他文件 DPI 設定可能會改變切片倍率與匯出像素尺寸之間的關係。使用 Slice Studio 匯出。

如果你已有文件，請在 Vector Studio 中選取 Artboard Tool。若要輸入精確的自訂尺寸，Mac 版說明文件載明的方法是：啟用此工具後，在頁面上按住 Command 並按一下，接著在 Create Artboard 對話框中輸入尺寸。此工具的說明也列出其內容工具列上的 W、H、Size 和 Insert Artboard 控制項。新增和移除畫板、畫板工具。

若交付內容要求精確的像素尺寸，請勿以拖曳方式估算畫布大小。拖曳是建立畫板的支援方法，但輸入數值能明確指定所需尺寸。另外，請直接選取畫板工具：目前的說明文件沒有列出它的預設鍵盤快速鍵。新增和移除畫板、畫板工具。

新增相同尺寸的畫板並整理內容

若要建立容易檢查的版面，請先新增其他畫板，再繪製圖示。選取第一個空白畫板，然後選擇 Edit > Duplicate > Selection。將複製的畫板移到自己的位置，再重複此步驟建立第三個畫板。Affinity 也說明，可以使用移動工具或畫板工具，對選取的畫板按住 Command 並拖曳來複製。新增和移除畫板。

將畫板排列成整齊易讀的一列。畫板工具的 Spacing 控制項可設定複製畫板的間距，並有助於將畫板移到其他畫板附近時判斷是否要貼齊。請將此間距視為工作區的版面安排；圖示畫布仍應為 64 × 64 px。畫板工具。

將畫板重新命名為 circle、square 和 diamond。在貼上板上雙擊畫板上方的名稱，或在圖層面板中雙擊其名稱。這些簡短名稱可讓你稍後更容易將各個畫板與匯出項目對應起來。新增和移除畫板。

在每個畫板內繪製對應的形狀，並依專案需求保留適當留白。舉例來說，置中的形狀若外框尺寸為 40 × 40 px，在 64 px 的正方形畫布每側會留下 12 px：(64 − 40) ÷ 2 = 12。這只是版面配置範例，並非 Affinity 預設值或通用的圖示規格。

繪製時請查看圖層面板：每個圖示的物件都應屬於指定的畫板。Affinity 說明，在畫板內建立的物件預設會裁切在畫板範圍內。將內容移到不同畫板時，其在圖層堆疊中的父層也會改變，因此可透過階層確認每幅繪圖所屬的畫板。移動畫板內容。

這種所屬關係會影響匯出。透過「匯出圖層」從項目建立的切片只會包含來源圖層的內容。使用切片工具繪製的切片，則會包含其範圍內所有可見圖層的內容。若要讓圖示畫布保持一致，請使用以完整畫板為基礎的切片，並將圖稿留在各自的容器中。使用 Slice Studio 匯出。

在 Slice Studio 中設定個別圖示匯出

透過 Studio manager 啟用 Slice Studio。Affinity 的畫板匯出說明指出，畫板切片已在「切片」面板中備妥。展開每個畫板項目以設定其輸出。如果面板未顯示，請開啟 Window > General > Slices。匯出畫板、切片面板。

若畫板需要切片，請開啟 Window > General > Export Layers，選取畫板，然後按一下 Create Slice。若要使用整個畫布，請選取完整畫板；若只選取圖示物件，它就會成為切片來源。匯出圖層面板（Slice Studio）。

依照以下步驟設定第一個畫板切片：

  1. 展開「切片」面板中的該項目，並選擇 PNG 作為檔案格式。
  2. 設定 1x 匯出尺寸。
  3. 使用尺寸項目下方縮排的 + 新增 2x 匯出尺寸。
  4. 檢查檔名，確認兩種尺寸各自使用不同的輸出名稱，例如 circle-64 和 circle-128。
  5. 對其餘畫板切片重複以上步驟。Affinity 說明切片控制項支援其他格式、多種尺寸，以及匯出檔名設定。匯出切片、匯出畫板。

若要處理較多項目，可先設定一個切片，再使用 Copy export setup to clipboard 和 Replace export setup from clipboard，將格式和縮放設定套用到另一個選取的切片。之後請檢查目標檔名。這樣可減少重複設定，同時保留明確的命名檢查步驟。切片面板。

確認三個預定的畫板切片核取方塊均已勾選。停用不需要的 Page 項目，它代表整個頁面或所有畫板。按一下 Export Slices (n)，選擇目的資料夾並匯出。批次按鈕會匯出已勾選的面板項目；單純反白某一列不會將其納入批次。切片面板。

檢查尺寸與已說明的匯出限制

在設定更多圖示前，先檢查範例的六個輸出檔案。確認每個檔案都包含一個完整圖示、畫布尺寸符合預期的 64 × 64 px 或 128 × 128 px，且檔名能區分圖案和尺寸。檢查每幅繪圖周圍的留白，以及繪圖本身。

若尺寸不符，請一併檢查文件 DPI 和切片縮放。Affinity 公布的 64 × 64 px 文件範例如下：

文件 DPI 1x 輸出 2x 輸出 3x 輸出
72 64 × 64 px 128 × 128 px 192 × 192 px
144 32 × 32 px 64 × 64 px 96 × 96 px

這些數值來自 Affinity 說明文件中的 DPI 表格。它們顯示，不能假設不同文件 DPI 下，相同的 1x 標示都代表相同像素尺寸。使用 Slice Studio 匯出。

Affinity 也說明了 100w 這類絕對切片尺寸。若正方形畫板需要明確指定寬度，使用絕對寬度的匯出設定是另一種支援方式；也請確認匯出後的高度。如果你想直接採用此範例中的 1x 和 2x 尺寸關係，請保留上述 72 DPI 設定。匯出畫板。

若要匯出單一檔案供檢查，請選擇 File > Export > Export，並在 Area 下選取已命名的畫板。關於 Whole document，說明文件內容不一致：畫板匯出頁面描述的是將輸出合併，匯出設定頁面則說會依格式輸出個別畫板圖像或 PDF 頁面。本文要批次匯出個別檔案，請使用說明文件中明確列出的 Slice Studio 工作流程。匯出畫板、匯出設定。

若圖稿未顯示，請檢查其所屬畫板，以及「匯出圖層」中的 Make item visible in export。此控制項與一般可見度設定不同。若稍後重新開啟文件，請再次確認目的地：Affinity 說明，切片匯出資料夾只會在目前的編輯工作階段中記住。匯出圖層面板（Slice Studio）、匯出切片。

三個畫板的範例成功產生六個尺寸正確且命名清楚的檔案後，就能將相同設定延伸至圖示組合的其餘部分。每個不同的繪圖使用一個畫板，沿用已驗證的匯出設定；新增不同畫布尺寸或匯出需求時，請檢查輸出檔案。

來源