oSold是一款協助夢行者,將夢想轉換成具體形狀的商品銷售APP。目標族群為獨立或小規模的線下商品販售者,協助其在販售商品時能快速結算款項。oSold APP從確認需求,介面設計與軟體開發,到直接應用於創意市集只花了四個禮拜。
如何達到如此高效的敏捷開發呢?
除了具備UI 設計與程式開發能力外,更重要的是掌握一個思維―設計思考 (Design Thinking),那何謂設計思考呢?
設計思考 Design Thinking
設計思考是一種以使用者為中心的解決問題方法,強調創新和創造性解決方案。過程是非線性、反覆進行的,包括以下五個階段:
- 共感 (Empathize) : 理解並共感使用者的需求、期望和痛點。
- 定義 (Define) : 定義使用者需求與問題。
- 構思 (Ideate) : 提出各種可能的解決方案,創造想法。
- 原型 (Prototype) : 製作簡單的模型或原型,開始制定解決方案。
- 測試 (Test) : 測試解決方案,收集反饋,並根據反饋進行調整,進一步優化解決方案。
Table of contents
接下內容將透過4個禮拜的開發週期搭配5個設計思考階段,跟各位介紹為什麼想開發oSold?如何高效率執行設計開發?以及最後在創意市集實際使用的成果。
- Week 1―Empathize & Define:設計背景與需求
- Week 2―Ideate:互動架構與資料模型的定義
- Week 3―Prototype:收銀與交易紀錄功能的開發
- Week 4―Prototype:商品管理與設定功能的開發
- D-Day — Test:2天共127次在創意市集的結帳實測
Week 1―設計背景與需求
Empathize
時間倒轉到11月10日,我的夥伴告知預計12月9日要參加創意市集販售商品,需要能協助快速結帳的工具,但苦惱找不到簡單易用又兼具質感的結帳 App。快速研究市面上的相關軟體後,發現確實比較少是針對線下市集的販售場域,且必須能滿足快速選擇商品、計算總額與找零金額。於是起心動念決定在接下的四個禮拜內完成設計開發,並能實際安裝在iPad上運作。
Define
接著發揮平日工作的設計專案管理技能,定義出核心需求以及評估時程,oSold在此四周必須能實現以下的基本功能:
- 結帳功能:快速選擇商品、即時統計總額
- 交易紀錄:需能本地持久儲存,如可雲端同步更佳
- 商品管理:需能滿足CRUD的資料基本操作,包含建立 (Create)、讀取 (Read)、更新 (Update)與刪除 (Delete)
接著啟動iOS的開發環境Xcode。初始時,建立範例資料作為預覽範例,使用SwiftUI開發可以透過Xcode previews,以所見即所得的互動反饋來探索並釐清結帳的互動行為。
事實上,透過Xcode previews創造簡易的working prototype,可以讓設計師體驗實際的互動操作,模擬互操作情境,感受需求並進一步定義需求,是共感→定義的流程之體現、抽象的資料結構之實體化,有助於梳理下一步的資料模型定義。
為了保護夥伴當事人的隱私,本文範例使用星巴克官網上的商品資訊示意,且無任何商業行為。
Week 2―互動架構與資料模型的定義
Ideate
資料模型最基本的構成包含實體的屬性(Property)、類型(Type)以及與其它實體之間的關係(Relationships),透過心智圖的方式將抽象的資料實體視覺化,能幫助開發者不會迷失在抽象的資料結構中。
有了以上的資料藍圖後,開始著手設置Core Data(iOS 應用程式的數據處理框架),建立App的資料永久儲存功能。完成這一步驟後,APP才是真的擁有資料儲存、修改與刪除的能力。
Week 3―收銀與交易紀錄功能的開發
Prototype―收銀功能
收銀功能依照結帳程序,分成商品選擇、結帳和收款找款3個模組。
商品選擇:需要讓結帳者能快速辨識商品
- 商品可以依類別分類並切換顯示
- 單項商品的顯示資訊需包含明顯的圖片、名稱與單價
結帳:商品選擇的反饋要明顯
- 商品選擇的觸控範圍要大,方便結帳者快速點選
- 考慮螢幕與結帳者操作的距離,商品選擇時的視覺反饋要明顯,更可評估加入觸覺與聽覺的反饋
- 即時統計並顯示所選擇的商品、商品數量與總金額
- 結帳按鈕要突顯,方便結帳者快速完成結帳
收款找款:結算計算機,方便結帳者收款與找款
- 結帳後顯示應收款項與應找款金額
- 實際收取的款項可透過數字鍵盤修改
- 自動換算找款金額
Prototype―交易紀錄
方便販售者確認商品的銷售細項清單、總量與總額之統計
Week 4 — 商品管理與設定功能的開發
Prototype―商品管理
商品清單:商品依照類別分類,一目瞭然
商品表單:商品資訊的新增與編輯
D-Day — 2天共127次在創意市集的結帳實測
Test & Feedback
收銀功能
- 最頻繁使用的功能,一目了然的商品資訊除了方便結帳,亦可作為商品目錄確認售價
- 商品類別離頂部安全區域太靠近,會不小心誤觸 > 將調整間距
- 結算計算機確實提升結帳效率,但收到整數金額時還要手動修改 > 將增加預設整數金額,如1000, 500元
交易紀錄功能
- 方便即時掌握商品銷售的整體資訊,並提供隔天備貨的參考依據
2-hour optimization
市集結束,立刻根據當天的使用心得,著手加入結算計算機的預設金額功能。預期情境譬如收到1000塊時,直接點選1000的按鈕,省去原先要先按刪除按鈕再輸入1000數字的步驟。
加入預設金額後,結帳收款確實大幅提升效率,亦減低金額計算錯誤的風險。以下是收銀功能的實際操作展示,互動介面除了具備明顯的操作反饋外,亦搭配音效作為操作的確認反饋。
Conclusion
Design Thinking
設計思考(Design Thinking)是我在就讀工業設計時,所接觸的“以使用者為中心思考的設計實踐流程”。然設計思考亦是一種看待事物的態度與精神,並不專屬於設計師或只能應用在產品設計。
事實證明,應用在軟體設計開發同樣能以敏捷迭代的方式從0到1展開你的的產品想法。
建議無論是設計師或開發者,在思考一個新功能時,能具備同理心且換位思考,評估這個功能到底是目標使用者需要,還是開發者您自己想要。然目標使用者並非是隨找隨有,要能接近使用者角度的另一個方式,就是自己打造prototype。以實際使用者的角度實際測試、感受並體驗之。
oSold
oSold雖然是臨時起意的開發專案,然而透過運用本身已內化的設計思考,經歷4個禮拜緊湊的開發,到實際可應用到創意市集的販售結帳,對於其存在需求是有信心的。
目前仍處於開發階段,尚有許多待優化方向,如:
- 結算計算機的實際款項的輸入可再優化
- 支援不同幣別的售價
- 販售紀錄的統計功能可更詳細