← 全部作品
FULL-STACK客戶交付完成2025

塗新居

南投在地屋頂清洗 / 油漆 / 防水代工案。官網拉品牌與 SEO,師傅 App 管訂單與施工照,雙端共用一套設計,客戶體驗連續。

角色
主導 + 全端開發
時程
2025
Reading
3 分鐘
技術棧
Flutter 3RiverpodNext.js 16React 19TypeScriptTailwind CSS 4

產品畫面

SCREENSHOTS · COMING SOON

產品截圖補上中。把圖丟到 public/works/<slug>/ 並在 mdx frontmatter 加 screenshots 陣列即可。

public/works/paint/01.png

南投在地服務業者長年靠口耳相傳接屋頂清洗 / 油漆 / 防水案,網路上零品牌曝光、SEO 找不到、缺接單管道。塗新居把官網與師傅 App 一起做:客戶端拉品牌與曝光,師傅端管訂單與工程記錄,業主從接案到結案都在一套系統內完成。

問題

  • 在地代工業者沒線上品牌,「南投屋頂清洗」搜尋找不到
  • 師傅手寫工單常掉、跨團隊溝通靠 LINE 訊息流,事後難追溯
  • 客戶想找口碑業者但沒比較依據,只能聽人介紹

解法

  1. 客戶端官網:品牌頁、服務介紹、案例展示、聯絡表單,目標關鍵字「南投屋頂清洗 / 油漆 / 防水」前頁可見。
  2. 師傅端 App:訂單派工、施工前後對比照、客戶現場簽名、工時紀錄一條龍,取代過去的手寫工單。
  3. 離線優先:山區施工常無訊號,App 在現場可離線完成所有作業,回到收訊區自動同步,不會「填完工單上傳失敗就重填」。
  4. 雙端設計一致:客戶在官網看到的視覺、師傅在 App 內部看到的視覺是同一套色票與字體,品牌體驗連續。

成果

  • 客戶交付完成、官網上線、師傅 App 已部署
  • 在地關鍵字 SEO:「南投屋頂清洗」前頁可見
  • 師傅端工單追蹤、施工照管理一條龍,取代手寫紙本
  • 一套品牌跨客戶端與師傅端,視覺體驗連貫

學到什麼

  • 在地代工的雙端策略勝過一個 App 全包:客戶要的是 SEO + 品牌、師傅要的是離線 + 拍照簽名,兩端做兩套反而比硬塞一個 App 簡單。
  • 離線優先在工地是必要不是加分:山區 4G 訊號不穩,「現場填好回來再 sync」是這個產業的硬需求。

對這個專案有興趣?

或者你想做類似的東西?聊聊。