海洋公民科學平台

Marine species database connecting divers and scientists
海洋公民科學平台 Figma 線框圖與需求討論
視覺設計稿與前端框架
物種檢索介面 - 多階層分類篩選
物種介紹頁 - 照片與地理熱視圖
Uploadcare 照片上傳介面
系列照片幻燈片展示功能
1 / 6
Client
BlueTrend 海洋媒體團隊
Category
WordPress 開發
Year
2022

專案概述

潛水攝影師拍了大量海洋生物照片卻不知道物種名稱,而研究員缺少照片進行研究。海洋生物資料庫作為橋樑,讓攝影師上傳照片後,研究員與社群分類員共同進行物種鑑定。平台以 WordPress 全客製開發,採用 Alpine.js 打造流暢的即時篩選體驗,支援分類頁籤、標籤篩選與關鍵字搜尋三種檢索方式。整合 Uploadcare 圖床服務處理大量照片上傳,並建立社群分類投票機制與物種地理熱視圖,累積超過 8,000 位會員與 12,000 張海洋生物照片。

服務範疇

  • 全客製 WordPress 子網站開發
  • Figma 線框圖與 UX 規劃
  • Alpine.js SPA 即時篩選介面
  • 物種多階層分類架構設計
  • Uploadcare 圖床服務整合
  • 社群分類投票機制
  • 物種地理熱視圖功能
  • WordPress REST API 設計

成果亮點

累積 8,000+ 會員

平台上線後迅速累積超過 8,000 位會員與 81 位社群分類員,成為台灣最大海洋生物照片資料庫。

蒐集 12,000+ 張照片

超過 12,000 張海洋生物照片,其中包含台灣首次紀錄的稀有物種。

社群分類投票機制

創新的多數決投票系統讓民間高手也能參與物種分類,票數平手時自動通知研究員裁決。

即時檢索體驗

使用 Alpine.js 打造的即時篩選介面,支援分類、標籤與搜尋三種模式,操作流暢無需換頁。

Contact

聯絡我們

有任何技術需求、專案諮詢或合作想法,歡迎隨時與我們聊聊。初次諮詢免費。

  • 想打造 WordPress 網站或 WooCommerce 電商
  • 需要 LINE 整合或 AI 功能導入
  • 有產品點子想找技術合夥人一起實現
  • 既有網站需要改版升級或效能優化
  • 尋找長期穩定的技術顧問合作夥伴