← 回作品列表

平面設計與量產輸出

自己寫了一套平面設計軟體,電腦和手機能一起改同一份稿。

設計

概念封面:可分層編輯的印刷畫稿與多種構圖的批次成品

設計稿要能改,
也要能一次出幾十張

設計

實際畫面

設計軟體主畫面:左邊圖層、中間畫布與尺規、右邊屬性與效果(示範稿是虛構的市集海報)
設計軟體主畫面:左邊圖層、中間畫布與尺規、右邊屬性與效果(示範稿是虛構的市集海報)
效果庫:每一格都是真的套上效果畫出來的預覽,月亮是兩個圓相減做的
效果庫:每一格都是真的套上效果畫出來的預覽,月亮是兩個圓相減做的
手機版:掃 QR 碼打開同一份稿,跟電腦即時同步
手機版:掃 QR 碼打開同一份稿,跟電腦即時同步

這件事在解決什麼

名片、吊牌、保固卡、社群圖與印刷品的版面設計。設計檔是可以再編輯的資料,不是一張圖,改一個欄位就能重出,需要時一次輸出幾十張,尺寸與安全框照印刷規格算。日常用的是自己寫的設計軟體,操作照 Figma 的邏輯:畫板、圖層、鋼筆、自動排版、遮罩、布林運算、元件與變體,東西都在畫布上直接拖、拉、轉。圖層效果有 16 種,例如光暈、浮雕、長陰影、動態模糊、雙色調、毛玻璃,另有 14 組一鍵風格,效果庫裡每一格都是真的套上去畫出來的預覽。畫板改大小時,裡面的東西會照各自的約束跟著左、右或置中走;上方有尺規,可以拉參考線對齊。同一個 Wi‑Fi 下用手機掃 QR 碼就能打開同一份稿,兩邊改的東西約 1 秒內互相同步,手機版有觸控手勢和底部工具列。做好的版面可以送進 Figma 繼續改,也能從 Figma 讀回來;輸出 PNG、PDF 跟畫面上看到的是同一套算圖。

做了哪些部分

  • 版面設計與尺寸預設
  • 品牌色與元件規範
  • 批次輸出 PNG 與實際 mm PDF
  • 參數化生成的識別圖形
  • 自寫設計軟體:圖層、鋼筆、自動排版、布林運算
  • 元件與變體,改一個全部跟著變
  • 16 種圖層效果、14 組一鍵風格
  • 約束、尺規與參考線
  • 手機與電腦即時同步編輯
  • 與 Figma 雙向串接

這個做法,用在你的專案上呢?

網站、系統、影像或自動化,先從真正的問題聊起。

開始合作 →