工作區域、框架與版面輔助

閱讀目標

• 辨認框與內容控制
• 分清輔助線和像素
• 比較中心距與間隙
• 核對輸出與母檔

適用條件與學習範圍

現在改的是哪份邊界，哪些線會成為成品？

• 文件尺寸、圖層群組與智慧型物件可沿相關知識補讀。

能依用途選版面工具、分清輔助資訊與內容，核對範圍而不把工具代替構圖判斷。

桌面Windows／macOS RGB8練習；原創有限RGBA布局，不是PSD／PDF、Adobe自動排版或全靠齊演算，沒有PS實測。

原理與判斷

移動對象和輸出範圍不清楚時，畫面看似排好了，交付卻可能裁掉內容或多出背景。先分清資料邊界，再用輔助工具支持有理由的版面判斷。

1 · 工作區域：一份文件中的多個版面範圍

要比較多個尺寸或設計版本時，可用工作區域 tool在既有畫布畫工作區域；工具藏在移動之下，亦可檔案 > 新增勾工作區域起步。設定預設或自訂寬高、命名，再放內容；它們在圖層中管理，成員按各區邊界裁顯。這和應用程式的panel 工作區不是同一種工作區。 適合多規格素材旁排比較，不是建好幾區就能自動響應重排。先依使用情境核對每一版的取圖、文字和必要內容；一般群組只組織成員，工作區域另有尺寸、位置、背景與輸出範圍，不能當普通群組改名。已知像素量和版面尺寸沿唯一文件頁補讀。

2 · 工作區域屬性、成員與保護責任

選工作區域在屬性核W／H／X／Y、預設及背景色／透明。移動工作區域、改其大小、移動其中的層是不同操作；工具選項、屬性或邊界handles依作用對象使用。選定工作區域旁的加號可新增，Alt（Win）／Option（Mac）選加號可連內容重複，後續仍核真正來源身分。 跨區可拖圖層項目或複製 圖層指定目標；若元素自動nest進出不合目的，查Prevent auto-nesting into and out of 工作區域 and 影格。Lock position鎖工作區域位置，不等於所有成員都不可改；圖層按工作區域篩選只改清單，顯示 工作區域 名稱只改名稱顯示。參考線可隨區移動／重複。圖層 > Ungroup 工作區域解除特殊範圍，最後一個解除後回一般文件；不要混成普通Ungroup或誤刪整區。共用連結 智慧型物件仍可能同源更新，官方independent的版面描述不保證所有來源獨立。

3 · Frame：形狀邊界和內含影像分開

Frame tool可先畫空框，也可在既有影像上畫框作裁顯。2026-02-23現頁已列rectangle、ellipse、triangle、polygonal及custom，不沿舊教學說永遠只有矩形／橢圓；依實際版本選項確認。Frame在圖層是具框與內容兩縮圖的類型，形狀把框外影像隱藏，不代表原資料被刪。 適合先訂占位、換素材及控制取圖。自動resize／fit不保證整張來源都看得到，照片主體可能被裁掉；更不能把智慧型物件保來源說成任意放大都清晰。選項的stroke color／width／alignment若真的設定，是可輸出的框線外觀，與選取邊線、輔助線不同。終點是能指出邊界、內容、實際顯露三者。

4 · 置入、替換與Convert to Frame

先選需要的框，再檔案 > 置入嵌入的物件或置入連結的物件置入來源，影像成智慧型物件；Library素材也可拖入框。嵌入把來源資料放進文件，連結仍依賴外部檔案與路徑，交件和更新責任沿智慧型物件唯一頁核對。置入不等於檔案 > 開啟開獨立文件，也不表示已把全部來源縮成目前裁顯尺寸。 既有形狀或text可在圖層右鍵（Win）／Control-click（Mac）選Convert to Frame，於新增 Frame命名及設寬高。需要原可編文字／形狀先留副本，不從新框外觀推論原文字仍能照原編輯。當代頁另列產生影像，是另一個有版本／服務條件的生成入口；本票用自製來源置入，不假調AI或下載Adobe練習素材。

5 · 選框、內容或兩者：先看縮圖再移

圖層兩縮圖是清楚的作用對象入口。官方canvas操作是點inset image可選框與影像、double-click只選image、點frame border只選frame。移動／縮放前看目前選取，不能看到同一外框就推測每次都在改同份資料；link／鎖及工具條件也需核。 本站三種目標真的分開：只移內容改原稿取樣位置、框座標不動；只移框改裁顯區，內容原點不動；共同移兩份都改而保相對距離。放大內容仍用原24×16資料，不新增細節。換原稿A/B後觀察孔洞、色塊和裁切，先別暗中移框迎合素材；不適合就改取圖或換版面。

6 · 標尺、原點和單位不是重取樣

檢視 > Rulers顯示上方／左方標尺；預設Ctrl+R（Win）／Command+R（Mac）可切換。原點決定測量從哪裡開始，也影響grid原點；從兩標尺交會處拖出可改原點。換單位可在標尺右鍵／Control-click，或Win 編輯 > 偏好設定、Mac Photoshop > 設定中的Units & Rulers。 適合確認間距與相對位置，但改px／cm或標尺起點不會重新取樣影像。實際像素寬高、ppi及重新取樣仍到文件尺寸頁。Rulers也不是尺標 tool量斜線的同義；本票不擴成特殊資料或DICOM測量。網站用明示整數像素世界，沒有假裝複製全部PS單位設定。

7 · 格點與參考線：參照位置，不是圖像線條

檢視 > 顯示 > 格點或參考線分開顯示，檢視 > Extras可總切非印刷輔助。格點提供規則刻度，參考線可手動定位置；它們不會成為輸出像素。若真在像素層畫一條線，那就是內容，會輸出，不能因為看起來像參考線就當可忽略。 Win 編輯 > 偏好設定／Mac Photoshop > 設定的參考線, 格點, & Slices可核色／style、Gridline every及Subdivisions。更密網格不是更多像素或更好版面。文件guides與偏好責任分開，不把該頁document-level字句擴成所有app偏好都只影響目前文件；本站local設定僅屬這份示意。

8 · 新增 Guide Layout與從形狀建立參考線

檢視 > 新增 參考線 From 形狀可依選定物件尺寸產生guides；檢視 > 新增 Guide Layout可設columns、rows、margins和gutter，清除 Existing 參考線會清既有參考線，先核是否需要保留。用預視比較欄、溝與邊界，並確認目標是document或選定工作區域；工作區域的guides可跟著區域移動／重複。 2023-08-10 Adobe Learn以12欄、6列及特定20px作範例，是演示控制關係，非所有作品的配方。先依內容與用途選分組／對齊基準，再建必要輔助線；欄數本身不決定資訊層級或閱讀順序。網站用一條固定X22參照和4格顯示網格，並非完整Guide Layout編輯器。

9 · Smart 參考線：動態提示不是永久線條

檢視 > 顯示 > Smart 參考線開動態提示；用移動移動時可見邊、中心、距離機會。它和手動放的參考線不同，也不是把所有物件自動排好。先選對層或群組再比較提示是否與預期對齊，少看不必要線，別為追提示而忽略主體取圖。 同為US2026-02-23，顯示輔助頁列Ctrl+Shift+;／Command+Shift+;，Smart 參考線專頁卻列Ctrl+U／Command+U；本次沒有實機核對，不選一個冒充確定快捷鍵。教材採兩頁共同的選單入口。本站粉框是目前框的幾何位置提示，非Adobe所有動態距離／smart演算，不進PNG。

10 · 靠齊與靠齊 To：總開關和目標要各自確認

檢視 > 靠齊控制是否啟用，檢視 > 靠齊 To再選參考線、格點、圖層、Slices、文件 Bounds，或All／無；無可在總靠齊開著時清目標。格點／Slices隱藏時相應目標不可用。顯示guide不等於啟用靠齊，開靠齊也不回溯搬動已放的內容；數值定位可以不靠拖曳。 移動拖曳時Ctrl（Win）／Command（Mac）可暫停吸附，依實際工具／快捷鍵設定核對。2026-09-29頁說約8px，未界定screen或image，不把它寫成固定8來源像素法則。本站只示範框左邊界接近參考線≤2來源格的方向按鈕吸附；只移內容或直接輸入X不吸附，這是明示有限規則，沒有假做全部靠齊 To選單。

11 · 對齊：先問相對哪個邊界

選兩個以上圖層或群組，圖層 > 對齊可選Top／Bottom／Left／Right Edges、垂直／水平 Centers。現行頁描述相對所選內容group或selection邊界，不能一律當整張canvas。需要對畫布／選區時先明確設定參照與作用對象，再按當版控制操作。這不是自動對齊根據照片內容配準。 本站選所選三卡或目前工作區域，示範頂／底／垂直中心，移的是整張卡片，框和內容一起平移。三卡原高不同，對齊中心不表示頂邊相同。若留白或透明padding讓外框對齊而主體看似不齊，需檢查可見內容並依目的調整，不認幾何命令永遠等於視覺均衡。

12 · 均分：等中心距不等於等間隙

圖層 > 均分可按Top／Bottom／Left／Right Edges或垂直／水平 Centers分布，另有Horizontally／Vertically的間距分配；先說要讓哪種距離相同。當代頁寫兩層以上，舊版常說至少三層，本例用三張不同寬卡片提供有意義比較，不拿舊條件覆蓋當代說明。 A三寬4／8／12，左右端點2和30。等中心距得到X2,10,18，中心4,14,24等距，但空隙4,0不同；等間隙X2,8,18，空隙2,2，中心卻不等距。這些位置真參與PNG合成。幾何規則服務用途，不能用間距整齊保證和諧、專業或閱讀成效；理論另沿構成／層級補讀。

13 · 輸出：單區、全部及出界內容不同

檔案 > 轉存 > 工作區域 To Files，選destination、prefix、工作區域 Contents Only或Include Overlapping Areas、是否含背景／selected artboards、格式及其選項，再執行。Include 工作區域 名稱可加名稱和畫布延伸條件，那是明確新增的輸出資訊，不是所有介面文字自然被印出。轉存為亦需核所選目標，不能只看對話框開了就認為匯出整份文件。 工作區域 To PDF另有Multi-Page或文件 Per 工作區域、ZIP／JPEG與quality、ICC、頁序等；本票只辨範圍，完整交付能力沿母檔頁。本站A32×24、B24×24、整體64×24是真PNG尺寸；A有限擴邊固定40×24只讀A成員，不假稱等同Adobe自動Include Overlapping Areas或真PDF生成。出界素材、背景、選區與輔助需逐項核對。

14 · 來源、版面與產物保存不同資訊

保可編輯母檔、原素材及連結依賴，再輸出結果副本；重開確認框、內容、工作區域與來源仍可按需要回改。PNG只有所選範圍的像素，不保存frame兩縮圖、guides或可重開的置入來源關係；有可見文字也不代表還是文字。若要裁回另一區，回母檔而不是從已裁掉的PNG猜補。 本站ab*按唯一ID保存兩區卡片、來源、目標、顯示與輸出範圍；補讀返回和重載保留，重設只還原本頁，不改舊文件／群組Lab。沒有建立PSD、連結檔、AI或Photoshop執行器。素材是自製色塊／孔洞，無真PS或真人學習成效實測。

15 · 本站規則與版面判斷的界線

世界64×24有A[0,0,32,24]、B[40,0,24,24]，中間8px真透明。各三卡，最後一張是框內來源；A24×16座標色塊，B24×16孔洞輪廓。讀來源(round((q−內容原點)／比例))，超來源透明，再按frame及工作區域邊界裁顯。只移frame不改內容原點，共同移動用實際平移量保持相對位置。 參照／格線／粉框只畫到左床view，下載輸出陣列不含這些overlay；內容實線和明定像素底色則會輸出。原尺寸窗口對照真像素，機構圖片放大／letterbox只供觀察，不能當任意放大清晰。最終回用途看取圖、邊界、留白及主次：工具能給幾何位置，不替你決定哪份內容值得被先看到。

步驟與觀察

1. 先定交付規格並保母檔

   Windows／macOS桌面依目標尺寸建立工作區域，命名並核W/H、背景；來源及可編輯母檔另外保留，不把增加工作區域當重新取樣。

2. 置入框並確認作用對象

   畫Frame，置入嵌入的物件或連結放原創／有權使用素材；在圖層選frame或內容縮圖，先只改取圖再核邊界，避免移錯對象。

3. 建立必要參照並選吸附目標

   按用途設新增 Guide Layout或手動guides，檢視 > 顯示切格點／參考線／Smart 參考線；再獨立核檢視 > 靠齊及靠齊 To。一次改一項，數值定位可替代拖曳。

4. 先說排列規則再比較

   多選必要層／群組，圖層 > 對齊或均分選幾何目標；三個不同寬物件比較中心距和間隙，再看可見內容是否仍合目的。

5. 核輸出範圍並重開

   檔案 > 轉存 > 工作區域 To Files或PDF時核selected／all、contents／overlap、背景和格式；重開結果查尺寸／裁切／透明及內容實線，另保可編輯母檔。

常見問題

移內容時框也跑了

看圖層兩縮圖及選取、link／lock；先分三種目標再試，不能用同一外框猜範圍。

主體被框裁掉

先在仍保留的來源調內容位置或比例，再決定框；別從已裁PNG期待找回框外資料。

開guide仍沒排齊

顯示、靠齊和對齊是不同責任；核總開關、目標與作用對象，guide不會回溯搬動物件。

中心等距但空隙不同

不同寬物件的中心距不是邊到邊間隙，選對均分或spacing，再依構成判斷。

輸出多出背景或少一段

核選定工作區域、contents／overlap、是否含背景及格式透明能力；介面 matte不是內容底色。

Smart 參考線快捷鍵說法衝突

本文已記同日官方頁矛盾，採共同選單入口，不冒稱實測或綁錯網站快捷鍵。

適用範圍與證據

原教材查核日期：2026-10-20 適用範圍：Windows／macOS桌面RGB8副本；新功能、平台及服務以當版條件核，不擴為Web／iPad保證。 來源狀態：16份Adobe primary正文；同日Smart 參考線快捷鍵矛盾採選單，US與locale日期分開、靠齊約8px不當固定imagepx；未存取SharePoint內部連結。 示意限制：原創64×24兩區、24×16兩素材，獨立frame／內容原點，nearest／出界透明，真PNG範圍；guides overlay不輸出，有限靠齊2px非Adobe算法。 原生軟體實測：沒有Photoshop桌面、各平台介面、連結外檔、AI或真PSD／PDF測試；本站瀏覽器和來源查核分開。 學習成效驗證：沒有真人學習成效或美感效果證據。

參考來源

• Adobe｜工作區域／範圍（2026-10-06）
• Adobe｜工作區域屬性／nest／lock（2026-02-23）
• Adobe｜Frame形狀與stroke（2026-02-23）
• Adobe｜形狀／文字轉Frame（2026-02-23）
• Adobe｜Frame內置入（2026-02-23）
• Adobe｜Frame與內容選取（US2026-02-23）
• Adobe｜Rulers／原點（2026-09-28）
• Adobe｜Guide／格點顯示（US2026-02-23）
• Adobe｜Smart 參考線與快捷鍵矛盾（US2026-02-23）
• Adobe｜Guide／格點偏好（US2026-02-23）
• Adobe｜靠齊目標與條件（2026-09-29）
• Adobe｜對齊參照（2026-02-23）
• Adobe｜Distribute／spacing（2026-02-23）
• Adobe｜Artboards To Files（2026-02-23）
• Adobe｜Artboards To PDF（2026-02-23）
• Adobe Learn｜Guide Layout具名示範（2023-08-10）

來源依原教材逐頁維護；本次建立閱讀網址不代表重新完成原生軟體或真人學習測試。如遇版本差異或內容錯誤，歡迎來信提出具體段落與版本。

相關知識

• 文件尺寸與影像資料 — 回看像素與文件邊界

  工作區域和框裁顯不是重取樣；先核文件資料，再返回保留本頁框、內容與輸出範圍。

• 圖層群組 — 辨認組織與特殊邊界

  工作區域在圖層管理但不是普通群組別名，沿唯一群組頁分清父子與一起控制，再返回保留兩區布局。

• 智慧型物件與來源副本 — 核置入來源與連結責任

  框內影像成智慧型物件，嵌入／連結、來源更新和點陣化能力不同；回改取圖不保無限細節。

• 圖層遮色片 — 比較框裁顯與灰階遮罩

  框邊界決定幾何顯露，圖層遮色片還有黑白灰與保存責任，不為框架重造另一份遮罩概念。

• 編輯母檔與交付判斷 — 分開母檔與範圍輸出

  PNG或PDF外觀正確不表示frame、文字、原稿與連結都保存；按收件目的選交付副本。

• 構成、比例與空間組織 — 幾何排列後仍需構成判斷

  對齊／均分給位置，不能替你決定留白、分組與視覺重心；補讀後返回仍保本頁操作。

• 文字、圖像與閱讀層級 — 工具不能決定資訊先後

  多尺寸版面仍需看閱讀順序和必要內容；grid整齊不保可讀性，沿理論比較再返回。