# AI設計工作流：ChatGPT-4o 圖片編輯功能實測分享。 ## ChatGPT-4o 影像編輯實測：對設計領域的實際影響 近年來生成式 AI 工具的發展突飛猛進，而 **ChatGPT-4o 開放影像編輯功能**後，更是為設計領域帶來一波新的衝擊與可能性。這不僅是工具的進化，更是**創作流程的重塑**，設計師的角色與工作型態也正面臨重組。那麼，這樣的技術在實務設計流程中，究竟能夠扮演什麼樣的角色？ ## 簡化流程的魔法：從 ComfyUI 到 ChatGPT 雖然過去透過 ComfyUI 等AI工具也能做到影像合成、風格融合等效果，但門檻不低，需要大量知識和試錯，也需要熟悉節點邏輯和操作邏輯。ChatGPT-4o 影像編輯功能的出現則將這些操作封裝在自然語言溝通的介面裡，像是和一位虛擬助理對話一樣，大幅降低了進入門檻，讓更多設計師能快速上手，不再需要擁有程式背景或繁瑣的設定的知識。 當然，要獲得更進階、具備更多控制功能、或者隨時獲得最新的AI功能，還是需要使用ComfyUI，但ChatGPT-4o提供給了我們一個平易近人使用方式。此外，在和ChatGPT來回溝通的過程中，使用者也可以補足一些思考的不足之處，其實對整體設計的形成，有著正面的影響。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743408898883/56f216f6-aca4-4161-9888-13683ebd9b63.png align="center") *左圖為ComfyUI，右圖為ChatGPT* --- # 將AI整合進入設計工作流程 --- ## 初期研究與概念形成 設計的起點通常伴隨大量的市場調查與趨勢分析。AI 對此階段的介入，使得設計師能以更高效率掌握競品資訊與使用者輪廓： * 利用 AI **快速整合市調資料與使用者行為**，提供競品比較、族群輪廓、價格帶與地區偏好等資訊。 * 採用語意分析工具萃取社群回饋與評論，從中**提取產品使用痛點與潛在改進方向**。 * 使用 ChatGPT 與 Web-based 工具**梳理產品定位**、文化偏誤與地區性差異，降低設計風險。 * **強化提示詞編寫策略**，讓後續的影像生成工具更有效率地對齊設計目的與品牌語言。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743401036893/2edf57f8-e93a-4491-9db9-270a9ebc1e38.png align="center") *上圖為先使用ChatGPT連網功能，調查現有智慧手錶和其功能＋圖片生成功能生成的智慧手錶市調圖卡。* 這樣的資訊整合能力讓設計師可以**更快速進入設計情境**，不再為了資料蒐集耗費過多心力。 --- # 概念發展與視覺試驗 得益於ChatGPT強大的語言理解功能，我們能夠將細微的概念轉換為精細的圖面： --- ### 快速概念發想 可省略草圖流程，透過**自然語言描述快速生成視覺構想**，縮短構圖試驗週期。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743407581976/159d9112-3d40-4e1e-95a8-c0f5023f4871.png align="center") *提示詞：幫我在一張圖中生成四款卡帶隨身聽的概念，需要支援藍牙功能，復古多彩但顏色以現代方式詮釋。* 可以見到上圖很好的詮釋了現代設計師再處理這類復古色彩搭配的手法，利用降低的彩度來減少撞色的衝突感，因此圖中的顏色雖然需要細節上的微調整，但配色已經可以作為參考。 --- ### 風格融合 以參考圖**融合功能進行風格混合與構圖重組**，探索原創性與多樣性。測試具衝突性的風格對撞，例如極簡設計結合手工感、科技美學中導入傳統工藝語彙。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743401524974/d96f2be8-ac27-4a17-91a9-9dba69908a9c.png align="center") *提示詞：將最左側的結構結合圖二圖三的CMF生成兩張概念渲染圖。* 可以看到，風格很好的轉移到了原圖的結構之上，右側渲染圖的漸消面則是融合了原本的圓形元素和風格圖的幾何元素，形成了特別的半圓形漸消設計，其實可以給設計師一些不錯的靈感。但這些靈感都需要轉化。 --- ### CMF計畫 色彩的部分可將原圖和色票提供給ChatGPT進行渲染，可以快速生成色彩計畫，也可將材質圖和原圖一起輸入渲染。下圖是提供色票產生色彩計畫的結果。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743401589870/ff89e043-44f8-4dca-a621-17c61c49a4da.png align="center") *提示詞：以左圖為基準，使用提供的色票做兩款色彩計畫。* 可以注意到原本材質保留的程度已經相當不錯了，造型的細節也有保留下來，只是比例的變化稍嫌無法接受。 --- # 渲染與視覺輸出最佳化 在產品造型設計或包裝開發中，渲染通常是最為耗時的階段。新的ChatGPT 4.0 圖片編輯功能則帶來明顯的效率優化，在渲染和視覺輸出的效率提高，能夠使設計師可以更專注於創新與設計邏輯的建構。 --- ### 材質渲染/燈光場景渲染 快速生成多角度渲染與材質預視，幫助團隊在尚未製作實體樣品前即獲得可參考的效果圖。 直接使用現有圖片進行渲染：支援即時修改光源與材質變化，模擬不同使用情境下的視覺變化。目前細部的造型和比例還是有變形的可能性，只能應用在概念發想階段。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743403054638/23273e5b-fb3e-4273-a9a6-1c815da73047.png align="center") *提示詞：（圖二）將錶帶改為淺色皮革/（圖三）生成一張強調產品輪廓的效果圖/（四）將原本圖面的渲染為真實圖片/（圖五）使用Rim Light強調產品/（圖六）加強曝光* --- ### 情境圖模擬 根據輸入圖像生成情境圖（Contextual Rendering），用於模擬產品於真實空間中的樣貌：目前AI還是有出錯的可能性，例如圖中的左腳卻穿上右腳鞋，需針對圖面進行多次修改調整。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743403345916/da1b56b8-cdde-4a14-a264-f46991eef7b6.png align="center") *提示詞：使用提供的原圖（慢跑鞋）生成一張使用鞋子的特寫情境圖。* --- ### 特效模擬 整合粒子特效與液態動態模擬，使得某些原本仰賴動畫或特效軟體才能完成的視覺效果，得以直接以圖像生成方式實現。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743405985312/f1cc03d9-29fa-4b41-8435-1f0ed05289ab.png align="center") 上圖的白模照片和右側的示意圖都是生成出來的，右側圖片可以模擬出冷凝的水珠。 --- ### 爆炸圖 雖然技術仍有待提升，AI 已可部分取代爆炸圖製作需求，用於技術溝通或用戶說明。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743404625750/3dff314b-5f7c-40e0-86f9-6171f59400b1.png align="center") *提示詞：將輸入的原圖（手電筒）拆件並將零件平放於一張白紙之上。* --- # 行銷素材的生成與優化 先前的AI生圖工具已經能夠很好的生成行銷圖面，但得益於此次ChatGPT在文字上的穩定性遠超以往的模型，因此直接生成出可用的圖片已經不是難事。 AI 對於設計與行銷團隊之間的協作將會產生顯著的影響，許多重複性高的視覺任務可下放至行銷人員操作： --- ### 去背與產生線稿圖 快速產出去背圖與技術線稿，有效提升說明文件與教學資源的可視化效率。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743409708655/2a2a984f-e8fc-4a76-8b2f-a5fb3f53b993.png align="center") ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743409820440/e0fd9f1b-fa7c-4f3d-9f21-782e6411104e.png align="center") 也可針對操作生成相關的圖面，來加快說明文件的製作。 --- ### 生成海報 根據草圖或布局草案生成包裝提案與海報設計樣張，用於初期審核與討論。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743408084891/e98c0b31-6128-41c9-9715-3199c72bd8b9.png align="center") 最右側的圖是參考左側兩張圖面生成，可以指定特定的排版設計。 也可以直接請chatGPT提供文案，並且生成相應的海報/文宣品。能夠看到需要對生成的海報做一些排版上的優化（最右側），才能更好的完成一份文案。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743411113691/7ac0c780-3e27-4d7a-be76-1b35dad83714.png align="center") 現在海報的生成還並非盡善盡美，針對中文的海報生成目前還是有點問題。 ### 也可以使用產品＋模板進行生成 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743409774318/a2deb848-da1d-4a42-9cb9-cc30525d4daf.png align="center") 也可以使用現有的產品圖生成海報（左圖），或者利用現有海報替換掉人物（右圖），這對同品牌更換代言人時有相當大的作用。 --- ### 生成節慶、特定主題圖文 套用節慶或特定主題樣式，自動生成社群圖文，減少設計師每日重複輸出壓力。ChatGPT能夠理解不同節日特性，並對圖像進行調整。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743406168058/64d3a6e3-e449-4beb-b554-76720e8b06fb.png align="center") 目前對於logo的再製還是有點問題，所以需要小心使用。 --- ### Model替換 能夠快速生成不同Ｍoel使用同一產品的照片，在行銷素材的製作上會有更大的彈性，對於攝影師和model的依賴度也將會下降。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743406235334/cd15d297-4a70-419c-9617-96c87cd7d877.png align="center") --- ### 影片生成 配合影片生成平台（如 Runway）進行圖像轉影片輸出，透過預先設計好的分鏡圖，我們就能夠將一支影片拆分成5-10秒不等的片段分開生成，最後再透過剪輯的方式完成一支影片。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743407354439/5653b3a7-8133-47fd-bd4f-2f248183670c.png align="center") 透過這些應用，設計團隊能專注於視覺策略與品牌一致性，日常產能則由 AI 工具支援。 --- # 介面設計與前端視覺開發 快速製作mockup並產生相應的網站程式碼將會變得越來月容易，以下面的例子而言，替換掉所有的slogan和logo只需要一小段的Prompt就能夠組到。也可以透過ChatGPT直接生成一個網頁的設計，並且提供相應的程式碼。 --- ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743407638747/1a38fc53-4b6b-45ec-b611-7bb85df29958.png align="center") * 批次更改設計圖中多點元素（如字體、顏色、比例等），大幅提升調整效率。 * 將生成出來的元素丟到如V0之類的網頁生成網站 - 即可生成出一個類似的網站模版。 ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1743407833615/9f4450f0-77e9-4c74-84d7-ea24170ca777.png align="center") --- ## 心得：設計師角色的重構與價值回歸 這些例子展現出一個共通的現象： > 設計流程中原本花很多時間做「基本功」的部分，現在可以由 AI 協助完成。 這不代表設計師的工作變得無關緊要，反而更強調設計師的核心價值在於想法、品味與判斷力。以往的設計師訓練並非白做工，這些養分將會轉化為設計直覺和品味。如今越來越多設計師將 AI 視為搭檔，把原本的流程拆分、重組，建立新的工作方法。 AI將會是一項提升設計師能力的工具，這個工具能夠將設計師的想法和品味放大，並且降低展現創意的限制。未來的設計現場，不再只是靠工具熟練度，而是誰能善用 AI，創造出真正有感的設計體驗。 ### 現在就開始學習適應這個工具，建立自己的AI設計工作流吧！ --- 如果你是建築師或者室內設計師，現在也有現成的、已經研發好的AI設計工作流可以使用：馬上到[ReRender（建築設計）](https://tw.rerenderai.com/)、[ReRoom（室內設計）](https://tw.reroom.ai/)使用看看吧！