畫面示意 DEMO

找地點(生活地圖)

依《新竹通2026增修案 找地點APP畫面 Wireframe v15》組成的可點擊流程,視覺以新竹通現行設計為準。

⚠
此為純靜態畫面示意,不連接任何 API、不會寫入或傳送任何資料, 畫面上的據點、地址、距離、開放時間皆為示意值。地圖底圖為 OpenStreetMap,需要連網才會顯示。

狀態設定

每一個維度都會寫進網址,可以把特定狀態的連結直接寄給客戶或後端。

地圖標記樣式

對應規劃書「圖示管理(SVG 上傳、標記顏色自訂)」那條後台功能。 水滴外框固定不可改,只換填色;內層圖示可選預設或自行上傳 SVG,顏色也可改。 改完右邊手機框會一起變色。

畫面清單

編號為 Wireframe v15 的畫面編號。點選會一併套用該畫面所需的狀態。

流程:P01 地圖 ──點大頭針──▶ 說明卡 ──查看詳細──▶ P04/P05/P06 詳情
   P01 地圖 ──切換──▶ P02 清單;兩頁的「篩選」都開 P03 分類選單
   搜尋列 ──▶ P08 搜尋;篩不到東西 ──▶ P09 查無結果

與 Wireframe v15 不同的地方

2026-10-07 與長官確認後調整。

  • 主分類與次分類改成單選橫列,橫列放不下的部分到「篩選」裡看完整清單。
  • 地圖改用真的 OpenStreetMap 圖磚,右下角加「回到我的位置」的定位鈕。
  • P07 問題回報不做,走 App 既有的問題回報頁;詳情頁的連結保留。
  • P08 搜尋建議第一列改成「篩選條件: ○○」,其餘各列是地點全名。
  • 沒有底部導覽,比照垃圾清運與健康步行。

找地點尚未有美術切版(pelin/ 只有 life/life-page.html 純選單), 元件樣式依新竹通既有 token 自製,圖示取自 pelin/images/solo/; 切版交付後要以切版為準重做。 內部備註與待確認事項見 find-place-demo/README.md,該檔不隨客戶包寄出。