← 回作品集

網頁開發 · 產品設計

Family——家人之間,看得到彼此的付出

「晚安,媽媽。今天家裡有 2 份付出被看見。」——這是 Family 打開時,你會看到的第一句話。

▶ 試玩 demo 純前端重製,沒有真的帳號系統,留言只存在你的瀏覽器裡。

問題

煮飯、接送、張羅這些事,家人不是不感謝,只是想不起來,也沒有一個地方可以隨手留一句。付出久了沒人回應,慢慢就不想再說了。

怎麼做

Family 是一個能加到手機主畫面的 PWA。輸入一句話,例如「煮飯」,選一個對象,對方會收到通知,牆上也會留下紀錄,其他家人也看得到。介面上用角色稱謂——媽媽、爸爸、兒子、妹妹,不用真名,因為這是要給任何一個家庭用的,不是只給我家用的。

Family App 首頁畫面,顯示「晚安,媽媽」與今日一句留言牆
首頁畫面——今天家裡有幾份付出被看見,一眼看到。

技術

React 19、Vite、Firebase 打底,帳號與資料都在 Firebase 上。設計成 PWA,可以直接「加到主畫面」當一個真的 App 使用,也包了一層 Android TWA,離上架只差最後幾步。

我的角色

一個人包了產品定義、介面設計、前後端開發。README 跟設計文件從第一版寫到現在——用角色稱謂取代真名,是設計過程裡的一個決定,不是後來才想到的補救。

案例畫面使用產品本身的上架素材,內容以角色稱謂呈現,未使用真實姓名。

想做一個類似、給更多人用的產品?寫信聊聊 →

← 回作品集 下一個案例:TEACH →