Step / 01
選材質,輸入真實尺寸。
從面磚、石子、岩板、木地板、浪板、清水模或鐵窗花開始,使用毫米與公尺定義它。
Architectural material workbench / 2026
二丁掛、抿石子、岩板連紋、木地板、浪板、清水模與鐵窗花。從真實規格生成無縫 PBR,尺寸、目地與位移深度一次帶走。
Illustration / Kiln 01
Raw material → Digital surface
Material index / 01
建築材質的可信度,藏在尺寸、縫寬、顆粒與板型裡。窯把這些規格放進生成邏輯,讓畫面放大後仍然成立。
From spec to surface / 02
所有調整都沿著建築語言發生,不必在抽象節點裡猜測參數。完成後輸出一組可以直接進渲染器的材質。
Step / 01
從面磚、石子、岩板、木地板、浪板、清水模或鐵窗花開始,使用毫米與公尺定義它。
Step / 02
砌法、拼花、異形、亂石、舖面到屋瓦,35 種排列都是算出來的無縫;表面處理從光面到火燒、荔枝、拉槽面。用建築現場熟悉的控制項。
Step / 03
Base Color、Normal、Roughness、AO 與 Height,保持同一尺度與接縫。
True scale / 03
每張圖都知道自己在現實裡等於幾公尺。放進 Rhino、SketchUp、Blender 或任何渲染流程時,不必再靠目測縮放。
Calculated seamless / 04
排列、邊界與隨機變化一起被計算,重複鋪陳時仍保有連續性。你調整的每一個參數,也會同步反映到五張貼圖。
Surface anatomy / 05
底色管顏色,法線與高度管凹凸,粗糙度控制反光,AO 把縫隙壓深。 五張圖共用同一組排列、尺寸與 Seed —— 下面這五張就是工具實際輸出的,不是示意圖。
sRGB · 只有顏色
OpenGL · 切線空間
線性 · 表面反光
線性 · 縫隙陰影
線性 · 真實深度 mm
二丁掛 227×60 · 目地 10mm · 貼圖涵蓋 948×560mm · 位移 5mm
Pattern library / 06
砌法、拼花、異形、亂石、舖面、屋瓦。下面是其中 12 種,同一張來源紋理、同一組參數,只換排列。 最後一張是鐵窗花 —— 那是另一套系統,扁鐵銲成的紋樣,附透明度貼圖。
Built for architects, visualizers and material people.
窯生成的每一張貼圖
都帶著它在現實中的尺寸。
標題列的 mm 是這張貼圖在現實中涵蓋的範圍。在 SketchUp、Enscape、Lumion、Blender 裡把材質尺寸填成這個數字,比例才會對。
高度圖的白到黑,代表從表面往下幾 mm,標題列會寫。渲染軟體的 displacement 量填那個數字。法線圖從同一個深度推導,所以 1K 和 4K 的凹凸強度一致。
底色、法線、粗糙度、AO、高度。檔名會帶著實際尺寸與位移深度,隔一陣子回來看還知道要填多少。法線預設是 OpenGL;Unity 和 DirectX 請勾「法線 Y 反轉」。
一定要填「照片拍到的真實寬度」。工具靠它換算紋理該有多大,填錯的話顆粒尺度會整個跑掉。
「拉平光線不均」預設開著。拍磚牆一定會左亮右暗,不拉掉的話每塊磚都帶著那個漸層,貼滿整面會一塊一塊浮出來。
顏色分頁只作用在底色,不會動到法線、粗糙度、高度。目地和銅條的顏色獨立設定。
山型磚常見規格 60×227×12mm,市售多為三色混貼(例如淺紅、深紅、巧克力 2:2:1),所以預設用色票混色而不是單一窯變色。
磚面分類照業界講法:平面、山型、雙山(W型)、斜面、直面/橫面(溝面)、版鑿面。山型磚常見規格 60×227×12mm。
面磚:二丁掛 227×60、一丁掛 227×30、三丁掛 227×90、四丁掛 227×120、小丁掛 227×25、45二丁 95×45、45三丁 145×45。目地標準 10mm,二丁掛實務上常做 5~6mm。
石材:300×600、600×600、600×900、600×1200、900×1200 是最常見的幾種;乾掛受限於背栓與掛件,單片通常不超過 900×1200,濕貼可以再小。另外有踏步 350、腰帶 150、路緣石 1000×250。
石材乾掛的分割縫 15~25mm,跟磁磚的目地不是同一回事 —— 目地設 0、開啟「大分割縫」才是乾掛的做法。
骨材粒徑:七厘 1–3mm、一分 3–6mm、1.2分 6–9mm、二分 9–12mm、三分 12–16mm、五分 16–22mm。
浪板:小圓浪浪距 76.2、浪深 18;五溝角浪 730/750/760/1030 型;820 型五槽直浪浪距 203.75、浪深 30、谷寬 138、加強肋 46×2。桁條間距 830mm 就是螺絲排的距離。
各廠牌略有差異,欄位都可以自己改。
第一次打開會先看到介紹頁,點進工具之後就不再出現。標題列的「介紹」可以隨時叫回來。
從主畫面啟動的 PWA、以及帶分享連結進來的,都會直接進工具不經過介紹頁。
上傳照片時,色差會自動歸零 —— 你丟照片進來是要那張照片的樣子,不是要工具在上面再疊一層隨機。要的話自己再拉。
「儲存」把目前的所有參數、縮圖,以及你上傳的照片一起存進瀏覽器,「圖庫」可以載回來或刪掉。因為含原圖,上限 40 筆。資料只存在這台裝置,換手機或清瀏覽器資料就會不見,重要的先「匯出 JSON」備份。
分享連結只帶參數,不含照片。對方打開會用內建材質。要完整交給別人請用匯出 JSON。
所有材質運算跑在另一條執行緒(Web Worker)上,所以按下輸出之後畫面照常可以操作,不會凍住。遮罩上有經過秒數,也可以取消。
石子最重,4096px 大約要十幾秒。慢是慢,但不會讓瀏覽器沒有回應。舊瀏覽器不支援時會自動退回原本的方式,功能一樣,只是過程中畫面會卡住。
「材質卡」輸出一張 PNG:貼圖、名稱、色票、實際尺寸與位移深度,可以直接發文或給業主看。
存過的名稱會跟著走。存進圖庫時輸入的名稱,材質卡、材質包 ZIP 與單張下載的檔名都會用它 —— 不然一堆「二丁掛_1422x1540mm」根本分不出誰是誰。換材質模式或套預設就會放掉,從圖庫載入會接回來。
「連結」把目前的參數壓進網址複製起來。對方點開就是同一個材質,可以直接接著改。只編碼跟預設不同的欄位,所以網址不會太長。
牆面是 3 公尺見方,貼圖依實際 mm 換算重複次數 —— 看到的比例就是現場比例。門是 900×2100,拿來對照尺度。
日照方位和高度可以拉。二丁掛的立體感、山型磚的色帶、浪板的波,都只有在斜射光下才看得出來,正面平光什麼都看不到。
視角用 three.js 的 OrbitControls:拖曳旋轉、滾輪或雙指縮放、右鍵或雙指平移,可以繞完整一圈。雙擊或按「重置視角」回到預設角度。
「真實位移」會把高度圖當成實際的幾何起伏,位移量就是標題列的 mm。關掉只看法線會快一點。
第七種模式。扁鐵條銲成圖案、中間鏤空 —— 這是唯一會輸出透明度貼圖的材質。渲染時把 opacity 接到不透明度插槽,鏤空的地方才會透出後面。
十六種花樣,都對得上實際存在的紋樣。具象:山形、雙層山形、壽桃、花瓶、蝴蝶、祥雲、古錢、花卉。捲曲:藤蔓、渦捲、太陽。幾何:菱格、方框套圓、十字、波浪。招牌:鐵路局。
依據是老屋顏(記錄台灣鐵窗花最完整的團隊)整理的常見圖案 —— 山形、壽桃、花瓶、蝴蝶、古錢幣、幾何、祥雲。地域上南部偏具象、中部偏對角四方連續、北部偏二方連續。條寬、厚度、漆色、鏽蝕都可以調 —— 台灣老鐵窗常見墨綠、水藍、白、鐵灰。
幾何是線段、圓弧與貝茲曲線,不是面:距離場算出「離最近一根鐵條多遠」,小於半條寬就是鐵。所以條寬可以無段調整,圖案不會變形。
3D 預覽用的 three.js 原本從 CDN 抓,兩個問題:裝成 App 之後離線打開 3D 就壞掉,而且不看 3D 的人也白白等它下載 614KB。
現在改成放本地、切到 3D 分頁才載,並且進了離線快取。第一次切過去會有一兩秒的載入,之後都在本機。
改參數之後,重算是非同步的(防抖加上背景運算)。以前參數剛改完馬上按儲存或下載,拿到的會是上一次的結果 —— 存進圖庫的縮圖看起來也像個材質,不容易發現存錯了。
現在儲存、下載、材質包都會先等目前這一輪算完。連按也不會拿到舊的。
亂石砌改用 Voronoi 加 Lloyd 鬆弛(d3-delaunay,ISC 授權)。原本是遞迴二分矩形 —— 石頭的邊必然對齊分割線,形狀規則、而且要讓它們咬合就得事後推邊界點,一推不是重疊就是跨過單元格邊界。
Voronoi 的 cell 天生互相咬合、共用邊,那三個問題一次解決。無縫的作法是種子點做 3×3 複製再算,取中央那份 —— 那些 cell 跟邊界外完全一致。
石頭的大小差異靠「一部分格子多塞一個種子」做出來:那一帶的 cell 被擠小,旁邊的相對變大,就是大石頭旁邊塞小石頭的樣子。
匯入的 JSON 是外部檔案 —— 材質名稱、用途、縮圖都可能被動過手腳。這裡一律清洗過再存:名稱與用途只當純文字、縮圖只接受 data:image、色票只接受十六進位色碼。
圖庫裡每張卡片左上角有「板」的勾選。勾幾個、填上「用在哪裡」,按輸出材料板就會產出一張 A4 的提案圖 —— 縮圖、名稱、真實尺寸、位移深度、用途、色票都在上面。
上面填的案名會印在標題。這張圖是給業主看的,所以底下有一行「實際施工以廠商規格書為準」。
用這個工具產生的貼圖,你可以自由使用。商業案子、業主提案、印刷、教學都可以,不需要付費,也不需要標示來源。
你上傳的照片始終是你的。所有運算都在你的瀏覽器裡完成,照片不會傳到任何伺服器,關掉分頁就沒了。
工具本身的程式碼與介面設計為作者所有,請勿整包重新發布或架設鏡像站。
這個工具沒有任何保證。輸出的尺寸與規格請自行核對,實際施工請以廠商規格書為準。
沒有帳號、沒有廣告、沒有次數限制,所有運算都在你的瀏覽器裡跑,不上傳任何東西。
如果它幫你省了時間,可以請我喝杯咖啡。不請也沒關係,繼續用就好。
沒有另外開一個模式 —— 花崗石就是面磚模式的三件事組起來:來源選花崗石或上傳自己的照片、花樣選定尺或亂尺、磚面選表面處理。預設列的「花崗石」那組是配好的起點。
內建的花崗石樣本是撒礦物顆粒,不是雲霧狀雜訊 —— 顆粒有深有淺、大小不一、形狀不太圓。磚色決定底色(長石的顏色),紋理強度決定礦物的對比,顆粒大小決定粒徑。
要用實際的板材,就在「來源」拖一張石材照片進來,填照片拍到的真實寬度,再選表面處理。整片切開會把紋理連續穿過整面牆,每塊獨立則是每片各自取一段。
磚面的第二排是石材的處理面。同一塊花崗石,火燒面和光面幾乎是兩種材料 —— 差在粗糙度與表面起伏,不是顏色,所以選了會自動帶入該處理的建議值。
火燒面是高溫爆裂剝落,坑洞大小不一;噴砂面細而均勻、起伏很淺;荔枝面是鑿頭一點一點打的,點距規則但深淺不一;水沖面圓潤沒有銳角;拉槽面是機器拉出來的平行溝。
這些紋理的尺度用 mm 定義(荔枝面點距約 9mm),所以 1K 和 4K 出來的顆粒大小一致。
「色票混色」只拿來源的明暗當紋理,顏色完全由五個色票決定 —— 這時改磚色不會有任何反應。山型磚、雙山磚、馬賽克這些預設都是色票模式。
所以改磚色時會自動切回「每塊獨立」,並跳一行提示。要用色票的顏色就改下面那五個色票;紋理強度與顆粒大小在色票模式下仍然有作用。
標題列的「基礎/專業」可以切換。基礎只留材質、尺寸、顏色、表面、品質;專業打開細節演算法、微調與輸出選項(法線強度、16-bit、細部紋理、色票權重那些)。
隱藏不是移除 —— 切回專業所有東西都還在,設定值也不會變。選擇會記住。
「材質包 ZIP」把五張貼圖、預覽圖與 material.json 打成一個檔。手機不用連按五次下載,換一台電腦也不會對不起來。
material.json 裡有貼圖涵蓋的真實毫米、位移深度、每張圖該接哪個插槽,以及色彩空間 —— Base Color 是 sRGB,法線、粗糙度、AO、高度都是 Non-Color。接錯的話渲染出來會不對,這個資訊不能只放在檔名裡。
另外也記了生成參數與 Seed,之後要重現同一個材質有依據。「分開下載」保留原本的行為。
標題列的 ↶ ↷ 可以回到前一個狀態,桌面上也能用 Cmd/Ctrl+Z 與 Shift+Cmd/Ctrl+Z。記的是整份參數,所以換材質模式、套預設都能復原。
排列的隨機種子只在按「重排」時才變 —— 改顏色、改目地都不會換掉排列,可以放心調。
8 位元只有 256 階,位移拉近看會出現階梯。16 位元有 65536 階,近景平滑很多,檔名會是 _height16.png。
Blender、V-Ray、Unreal 都讀得到;如果你的軟體不支援,在「顏色」分頁把那個勾取消就會輸出一般的 8-bit。
模板分割縫與對拉孔是規則的,跟模板模數綁在一起;蜂窩、流痕、色差是程序化的。兩者疊在一起才像現場澆出來的。
台灣常見的模板是 900×1800 與 1200×2400。對拉孔的封填 0 是留著凹洞,100 是用砂漿或木栓填平,多半設在中間。
木紋強度 0 就是鋼模或塑膠模;拉上去會出現年輪痕,年輪間距可調。
「磚型」分頁的花樣按鈕打開選擇器,分成砌法、拼花、異形三類。縮圖是線稿,看的是排列不是紋理。
基本的六種砌法(齊縫、1/2、1/3、亂砌、直貼兩種)可以搭配磚面與大分割縫。其餘花樣走另一套通用排列系統,磚面與分割縫暫時不套用,標題列會顯示單元格數與每格的片數。
每個花樣都是「在一個會重複的單元格裡放幾片」,貼圖取整數個單元格,所以全部無縫。
人字拼、鯡魚骨、方塊拼要求板長是板寬的整數倍。不是的話板長會被吸附,標題列顯示實際值。
鯡魚骨是在 45 度的整數格上運算,而且高度會取成板長的整數倍,兩端才接得回去。所以它的貼圖比其他拼法高,那是必要的。
預覽上有些板看起來比較短,那是正常的。跨過貼圖邊界的板在單張畫面上被切成兩段,拼貼時會接回去。想確認就切到「拼貼檢查」,那裡顯示 2×2。
大分割縫的排距若和錯縫週期互質,貼圖會被撐到好幾公尺,所以排距會吸附到錯縫週期的倍數,滑桿旁邊顯示實際用的數字。
銅條與浪板的間距會吸附成整除貼圖的數字,這樣才能無縫拼接。