LIVE ON VERCEL

通成精密玩具
B2B 網站功能總覽

一個為全球 B2B 採購而設嘅完整製造展示平台
AI 顧問 · 100+ 產品 · 三語言 · GEO 優化

toyfactory-pied.vercel.app
10
Pages
100+
Products
3
Languages
20
Articles
367
Static Pages
733
i18n Keys
Star Feature

核心功能展示

從 AI 顧問到 MOQ 估算器 — 每個功能都為 B2B 採購決策而設計

✨ POWERED BY CLAUDE HAIKU 4.5

AI 智能顧問

內置 5K token 工廠知識庫,涵蓋設備、品質、IP 經驗、報價流程。 B2B 買家可以直接用中文或英文提問,AI 即時回應並輸出結構化資訊卡。

🧠 5K token 知識庫
設備 · 品質 · 報價 · IP
🃏 結構化卡片回應
Product / Quote / Cert
🌐 自動語言偵測
中文 · English · 日本語
📍 頁面感知
知道用戶正在瀏覽邊頁
AI 智能顧問
ONLINE
你哋做盲盒嘅 MOQ 係幾多?
盲盒產品嘅 MOQ 通常係 3,000-5,000 件,視乎模具複雜度。我哋有 MCGS 自動點數系統確保零漏件。
QUOTE ESTIMATE
ProductBlind Box Figures
MOQ3,000 - 5,000
Tooling25-45 working days
Lead Time6-8 weeks
問任何關於工廠嘅問題...
📦

100+ 產品作品集

100 件真實產品連產品圖,橫跨 10 個品類、25+ IP 品牌。每件產品包含完整材料、製程、MOQ、認證規格。3 個旗艦產品附有 Challenge / Solution / Result 案例研究。

  • Disney · Pokemon · Universal Studios · Sanrio · Paladone · CASETiFY
  • 10 品類過濾:收藏燈飾 · 樂園限定 · 盲盒 · 微型積木 · 3C配件...
  • AnimatePresence 動態過濾 + Category 分頁
NEXT.JS IMAGE + EMBLA CAROUSEL
🏭

工廠實拍導覽

18 張真實工廠相片(注塑 · 組裝 · 無塵室 · 設備 · 生產),5 條影片。Radix Dialog 燈箱,分區導覽。

RADIX DIALOG + MOTION
🌏

三語言支援

繁體中文 · English · 日本語,每語言 733 個翻譯 key。Middleware 自動偵測 locale,URL prefix routing。

NEXT-INTL + MIDDLEWARE
⚙️

設備與技術

6 張設備卡(YIZUMI · APOLLO · MCGS · TRA 2512Pro · Air Shower · Recycler)配真實相片同規格表。

STAGGER ANIMATION
🔬

品質保證系統

6 階段 QC 流程(IQC → IPQC → FQC → OQC → Lab → Shipping),8 項認證 grid,驗廠就緒 CTA。

TIMELINE MOTION
🧮

MOQ 即時估算器

揀品類 + 複雜度 + 數量,即時計算 MOQ 範圍、交期同單價。互動式表單,客戶端即時運算。

REACT STATE + LOOKUP TABLE
📚

知識中心(20 篇長文)

涵蓋 B2B 製造業全方位主題嘅深度文章,三語齊全。每篇 6-8 段純文字專業內容,零 markdown 格式。

  • OEM 工廠選擇指南
  • EN 71 vs ASTM F963 安全認證比較
  • MOQ 同交期完全解說
  • 注塑材料指南(ABS/PVC/SAN/PP)
  • 零漏件盲盒包裝自動計數
  • 食品級爆米花桶製造
  • 無塵車間電子玩具組裝
  • IP 授權產品製造要點
  • 垂直整合製造優勢
  • nanoblock 微型計數技術
  • 模具開發時間表與成本
  • UV 印刷 vs 移印 vs 噴漆
  • 機械臂注塑效率革命
  • 收藏玩具包裝設計
  • 壓鑄金屬部件應用
  • ISTA 運輸測試詳解
  • LED 玩具電子整合
  • 主題樂園周邊製造
  • 可持續製造 ESG 實踐
  • 工廠驗廠準備指南
STATIC GENERATION × 60 PAGES (20 × 3 LANGS)
📋

進階 RFQ 詢價表單 + WhatsApp 浮動按鈕

升級版詢價表:產品品類選擇 · 材料多選 · 數量範圍 · 交期 · 設計檔案上傳(.pdf/.ai/.step/.stl)· IP 授權確認。Resend API 郵件發送。右下角 WhatsApp 一鍵對話,Spring 彈跳動畫。

REACT-HOOK-FORM + ZOD + FORMDATA + RESEND
Generative Engine Optimization

GEO 生成式引擎優化
讓 AI 搜尋引擎搵到你、引用你

咩係 GEO?

傳統 SEO 係優化 Google 搜索排名。GEO 係下一代 — 優化你嘅內容令 AI 系統(ChatGPT、Google AI Overview、Perplexity、Claude)可以搵到、理解同引用你嘅內容。

傳統 SEO

優化 keyword 排名
爭 Google 頭 10 位
靠 backlinks 同 meta tags

GEO 生成式優化

優化被 AI 理解同引用
成為 AI 推薦嘅答案
靠結構化、權威、具體嘅內容

場景:一個美國採購經理問 ChatGPT
"Recommend a China toy OEM factory that can make blind box figures with automated counting"

如果你嘅網站有結構化嘅設備資料、具體嘅產品 spec、同埋長文知識庫 — AI 就會引用你作為答案。

01 — ALREADY IMPLEMENTED

結構化產品數據

每個產品有完整 specs(材料、工藝、MOQ、認證、尺寸、包裝)。AI 可以直接引用「呢間廠用 MCGS 自動點數系統,MOQ 3,000-5,000」而唔係泛泛嘅「有自動化設備」。

02 — ALREADY IMPLEMENTED

實體豐富描述

提及具體設備型號(YIZUMI、APOLLO、MCGS、TRA 2512Pro)、具體數字(30+ 注塑機、100+ 產品、25+ IP、1000+ 員工)。AI 更傾向引用有具體數據嘅來源。

03 — ALREADY IMPLEMENTED

20 篇深度知識中心

20 篇長文涵蓋 B2B 買家最常問嘅問題 — 從材料選擇到驗廠準備、從 ISTA 測試到 ESG 實踐。AI 會將呢啲視為「權威來源」(Authoritative Source),因為內容具體、覆蓋完整主題鏈。

04 — ALREADY IMPLEMENTED

FAQ 式內容結構

「Why Choose Us」5 大競爭力直接回答「點解揀呢間廠」。AI 系統特別擅長從呢種 Q&A 結構提取答案。

05 — ALREADY IMPLEMENTED

多語言 AI 可達性

中英日三語令唔同語言嘅 AI 系統都能理解。日本買家用日文問 AI,你嘅日文頁面就有機會被引用。733 個翻譯 key 嘅完整覆蓋確保每種語言都有完整嘅 entity 描述。

06 — ALREADY IMPLEMENTED

AI 原生顧問示範

網站自帶 AI 顧問功能,本身就向 AI 搜索引擎發出「我哋擁抱 AI」嘅訊號。Google 等搜索引擎更傾向推薦技術前沿嘅企業。

進一步 GEO 優化建議

JSON-LD Structured Data

為每個產品加 Product schema,為公司加 Organization schema,為知識中心加 Article schema。AI 讀 JSON-LD 比讀 HTML 快 10 倍。

FAQ Schema Markup

將「Why Choose Us」同常見問題用 FAQPage schema 標記。Google AI Overview 特別偏好有 FAQ schema 嘅頁面。

AI Crawler 友好

確保 robots.txt 唔好 block GPTBot、ClaudeBot、PerplexityBot。呢啲係 AI 搜索引擎嘅爬蟲,block 咗就永遠唔會被引用。

行業目錄 Backlinks

喺 Made-in-China、Alibaba、Global Sources、ThomasNet 等 B2B 平台建立 profile 並連結返網站。AI 會 cross-reference 多個來源嚟驗證資訊。

定期內容更新

每月更新 1-2 篇知識中心文章。AI 偏好「新鮮」內容(recent content bias)。舊文章可以加 「Updated: 2025-XX」標記。

引用權威數據

喺文章入面引用行業數據(例如「全球玩具市場 2025 年達 $XXX billion — Statista」)。有外部引用嘅內容被 AI 評為更可信。

Full Inventory

完整頁面清單

367 個靜態頁面 — 每個頁面 × 3 語言(中/英/日)自動生成

核心頁面 (10)

  • / — 首頁(Hero + TrustBar + AI 顧問 + 6 大能力 + 5 大優勢 + 精選 + 認證 + CTA)
  • /about — 關於我們(廠房故事 + 發展歷程 + 6 項製造能力 + 8 項認證 + PDF 下載)
  • /factory — 工廠導覽(18 張實拍 + 5 條影片 + 燈箱)
  • /equipment — 設備與技術(6 設備卡 + 規格表)
  • /portfolio — 作品集(100 產品 + 10 品類過濾)
  • /services — 服務(OEM/ODM + 生產流程 + MOQ 估算器 + 材料)
  • /quality — 品質保證(6 階 QC + 8 認證 + 測試實驗室 + 驗廠 CTA)
  • /contact — 聯絡(進階 RFQ 表單 + 檔案上傳)
  • /blog — 知識中心(20 篇文章列表)
  • /downloads — 下載中心(PDF: 公司簡介/認證/產品目錄)

動態頁面

  • /portfolio/[slug] × 101 產品 = 303 頁
  • /blog/[slug] × 20 文章 = 60 頁
  • /quotation — 報價方案
  • /quotation/professional — 專業版詳情
  • /quotation/professional/home — 專業版示範首頁
  • /quotation/premium — 頂級版詳情
核心頁面10 × 3 = 30
產品詳情101 × 3 = 303
文章詳情20 × 3 = 60
報價子頁4 × 3 = 12
總計367 pages

20 篇知識中心文章

  • OEM 工廠選擇指南 Manufacturing
  • EN 71 vs ASTM F963 安全認證 Compliance
  • MOQ 同交期解說 Business
  • 注塑材料指南 Manufacturing
  • 零漏件盲盒自動計數 Manufacturing
  • 食品級爆米花桶製造 Manufacturing
  • 無塵車間電子組裝 Quality
  • IP 授權產品製造 Business
  • 垂直整合製造優勢 Business
  • nanoblock 微型計數 Manufacturing
  • 模具開發時間表成本 Manufacturing
  • UV 印刷 vs 移印 vs 噴漆 Manufacturing
  • 機械臂注塑效率 Manufacturing
  • 收藏玩具包裝設計 Quality
  • 壓鑄金屬部件應用 Manufacturing
  • ISTA 運輸測試詳解 Quality
  • LED 玩具電子整合 Manufacturing
  • 主題樂園周邊製造 Business
  • 可持續製造 ESG Business
  • 工廠驗廠準備指南 Compliance
Project Scale

項目規模

367
靜態頁面生成
101
產品(含真實圖片)
733
翻譯 Key(每語言)
20
深度長文(× 3 語言)

檔案統計

頁面路由17 routes
React 元件55+ components
工廠實拍圖片18 photos + 5 videos
產品圖片100 images (35MB)
翻譯檔案3 × ~800 lines
API 路由2 (contact + AI)

產品品類分佈

潮流收藏與燈飾11
主題樂園限定8
微型積木 nanoblock20
趣味精品 / 盲盒14
益智教具 KUMON12
戶外遙控 / 3C 配件21
動漫燈飾 / 其他14
Tech Stack

技術架構

Next.js 16
React 19
Tailwind v4
motion/react
next-intl
Claude Haiku 4.5
Radix UI
Zod + React Hook Form
Resend
Embla Carousel