Pixsee 寶寶攝影機 產品UX/UI設計
家庭 AI 攝影師，
捕捉成長的可愛瞬間
專案背景 PROJECT BACKGROUND
跳脫價格戰，創造產品價值
在競爭激烈的寶寶監視器市場中，Pixsee寶寶攝影機App以其結合人工智慧技術的家庭AI攝影師功能獲得了獨特的競爭優勢。為了在價格戰中脫穎而出並創造產品價值，Pixsee團隊致力於為這個專案設計出色的互動體驗和視覺設計，以打造新一代指標性產品。
作為互動設計師，我在專案中的角色是協助設計團隊優化Pixsee App中的「寶寶成長紀錄」功能，以提升使用者對於紀錄寶寶成長的樂趣和價值的認知
＊此案例分享僅為個人設計內容的展現，不代表pixsee官方立場
專案目標 DESIGN GOALS
優化「寶寶成長紀錄」的互動體驗
為了強化產品定位，我的設計任務是優化pixsee app中的「相本」互動體驗，以促進使用者選擇使用pixsee app來紀錄寶寶的成長，提升產品黏著度。以下是我設計的主要目標：
-
強化產品定位：突顯pixsee作為一款「攝影機」的特點，透過視覺設計和介面呈現，讓使用者直觀感受到pixsee的攝影功能和獨特之處。
-
智能紀錄：提供使用者有意義的寶寶成長紀錄，利用AI技術和智能分析，自動識別和記錄寶寶的重要時刻和里程碑。讓使用者輕鬆瀏覽和回顧這些特殊時刻，並與家人和朋友分享。
-
有趣回顧：在回顧寶寶成長的珍貴回憶時，提供有趣且令人愉悅的瀏覽體驗。透過互動和動畫效果，使用者可以以獨特的方式回顧寶寶的成長過程，享受特殊效果和濾鏡的樂趣，自由地創造和個性化相本。
透過這些設計目標，我希望能讓pixsee app成為使用者首選的寶寶成長紀錄工具，並為使用者帶來滿意和愉快的使用體驗。
我的角色 MY ROLE
在這個專案中，我負責「寶寶成長紀錄」的互動設計提案，確立此功能的核心體驗與視覺設計。
與我合作的共同設計者包括UX設計師Jessica Chan,Wilson Weng 和UI 設計師Tina Lai 。我們通過多次設計修正，將概念落實於產品中。在上線後，我們還負責維護與更新的工作。
專案：Pixsee App - 寶寶成長紀錄功能設計
我的角色：UI/UX 設計師
共同設計者：Jessica Chan (UX設計師)、Wilson Weng(UX 設計師) Tina Lai (UI 設計師)
定義問題 PROBLEMS & NEEDS
關於成長紀錄的使用者研究
由於時間限制，設計、軟體開發和使用者研究同時進行。在研究結果尚未出爐的情況下，我嘗試從現有研究資料整理分析與育有3歲以下幼兒的父母進行簡單訪談，作為一種非正式的使用者調查。調查目的是了解使用者在幫寶寶拍照和整理照片時遇到的問題和需求。
記錄寶寶成長，爸媽如何做？
在深入了解和觀察使用者情況後，我們發現新手爸媽在為寶寶記錄成長時可分為以下幾種典型：
製作成長紀錄容易遇到的問題
調查中也發現，整理成長紀錄常常是經過一段時間後，用回想的方式來記錄，因此造成以下幾點困擾
成長紀錄是為寶寶未來準備的禮物
訪談時，曾聽一位媽媽說到：「整理成長紀錄不僅僅是給大人自己看的，也是讓孩子長大後回顧時感到有趣且意義非凡。」這讓我開始思考這些費心整理的成長紀錄就像是時空膠囊，有一天會成為孩子的珍貴禮物。
設計流程 PROCESS
從概念發想到設計實作
快速呈現設計的點子
基於三個典型的成長紀錄，我提出了互動概念，並通過大量的草圖快速展示了設計點子。我與團隊主管、品牌總監、行銷企劃等多方進行了討論，從不同的角度檢視了這些想法。最終，我們選擇了以時間軸作為主要介面的「成長旅程」，並加入了拼貼卡片概念的「回憶拼貼本」作為附加功能，並繼續發展這些構想。
APP主視覺提案
這個案子與德國品牌設計師進行了跨國合作，考慮到整體品牌視覺形象，而不僅僅是介面外觀。這樣的合作有兩個特點，首先是文化上的差異，對於嬰幼兒產品有著不同的固有印象；其次是品牌視覺需與競爭品牌有明顯區隔性。因此，在最終決定的色彩方案中，我們選擇了偏暗的色系，放棄了嬰幼兒產品常見的粉嫩色系。
*以下是提案過程中的畫面展示：
設計概念 CONCEPT
智能紀錄，有感回顧
自動捕捉寶寶照片，而且張數剛剛好
為了讓使用者不錯過寶寶美好的瞬間，我們提出了自動拍照的構想。在定義這個核心體驗時，最大的挑戰是如何在幫助使用者拍攝寶寶的同時，避免無意義的拍攝。透過臉部優先、表情和大動作辨識，以及多人入鏡等判定機制，我們的寶寶攝影功能可以主動捕捉寶寶的照片，並且拍攝的張數剛剛好。
一眠大一寸，看見寶寶成長的變化
為了避免使用者拍攝過多重複性高、相似的照片，我們提出了自動產生成長紀錄的想法。每日精選的照片是依照寶寶的年齡所串成的時間軸，使用者只需要上下滑動就能綜觀寶寶成長變化。此外，使用者還可以切換年、月、日，快速點進相本瀏覽。這個想法的核心在於「階層化」，讓主畫面聚焦於精選內容，一天一個封面照，讓使用者更容易看出寶寶的變化。
設計細節 DESIGN IMPLEMENTATION
魔鬼藏在細節裡，有效落實設計
建立元件資料庫
為了確保App在不同版本（iOS/Android）下具有一致的使用體驗，我們使用設計元件庫進行開發。這意味著當元件需要進行更動時，我們可以同步更新不同版本的設計檔，從而提高設計效率。這樣做的好處是確保使用者在不同平台上都能享受到一致的介面和功能，並減少重複的設計工作。
使用設計工具，增進開發效率
使用UI定義工具，例如Zeplin，可以系統地定義元件、字型樣式、版面結構和各種狀態，以便開發團隊更清楚地了解設計項目。這樣可以確保設計元素的一致性，並提供開發者所需的準確資訊，從而增進開發效率。
另外，對於介面上的動畫設計，我們使用轉檔工具（例如Lottie）將其製作成工程師可以直接應用的檔案格式（如.JSON）。這樣的做法大大簡化動畫的開發過程，有助於開發者快速實現設計師所設計的動畫效果，並確保動畫在應用中順暢運行。
.png)
設計師來做設計品管
設計完成後，真正的挑戰才開始。在設計後期，我們需要進行功能測試，針對不同使用情境逐項檢視頁面、資料、元件、狀態等細節的UI定義。這些測試能幫助我們檢查設計中的邏輯錯誤或模糊待定之處，並確保設計在實際應用中的可行性。透過逐項功能測試，我們能更精確地了解使用者可能遇到的問題，並做出相應的改進，提高設計的品質和準確性。
