Project
- Project
- 綠杏健康力-健康量測、疫苗接種
- Team Members
- PM / DESIGNER / (APP) ENGINEER
- JD
- Competitor Analysis、UX Research & UI Design、Components Design
- Review
- 綠杏健康力 App 新增居家量測功能，打造智慧醫療服務平台，推動居家輕鬆量測 → 家人即時關懷 → 診間數據同步 → 健康週報分析，解決過去紙本資料或手上無過往紀錄。 使用 App 輸入量測項目時會透過數據提醒目前是否有高低標、標準範圍值內，了解自己身體健康狀況；也可設定權限將個人量測數據分享給親人朋友、醫療院所，親人朋友可近一步關心是否需陪同盡快就醫，而醫生、營養師可透過數據快速對症下藥和日常需補充的營養建議。
- Background
- 綠杏健康力 App 在市場為新上架產品，第一階段開發功能為疫苗接種而我加入專案時已進入最後準備驗收階段，參與開發第二階段居家量測功能；使用族群以線下綠杏健康力會員和推廣的診所病患為居多。 專案的動機目的為創建目前較缺乏的完整醫療系統，協助數位轉型、聚焦預防醫學、打造 AI 醫藥連網，提供完整的醫療保建服務。
- Challenge
- 專案難度很大在於年紀限制，健康量測者為新生兒和中高齡層所以會有無法自行透過手機紀錄，部份使用者則須透過親人家屬協助紀錄完成，所以設計開發讓使用者可建立自己、寶寶、父母等多人的行事曆輕易切換觀看。 在市場上，健康力集團還未有太大知名度在推廣上也是大挑戰，所以線下所需資源也一併列入專案。
- Research
- 產品定位及如何讓用戶長期使用？
- 專案目標規劃以透過婦幼診所、小兒科...等聯盟合作模式，推廣對象為孕婦族群從新生兒開始透過 App 紀錄包括頭圍、身高、體重和疫苗接種等；另一推廣規劃目標以慢性病診所聯盟為對象，不同年齡層、關注血壓血糖者...等，透過 App 健康量測固定紀錄，產生健康週報分析量測數據、每週提供健康及營養建議、數值異常、許久未量，AI智慧提醒您。 競品分析研究了幾個品牌功能相近產品、不同產品競爭者找出差異和優劣勢、市場定位和旅程體驗...，將收集的資料和流程分析，使用雙鑽石設計流程討論，進入UX 盤整、定義階段接著項目量化。將量測項目所需數據範圍、量測方法、病患症狀等明確整理統整和註解來源，此階段面臨問題為數據範圍來自不同區域性(如：WHO 和衛福部)、不同量測級距規範...等，必須雙重核對。 透過遊戲化設計為線上、線下累積點數等獎勵活動，讓使用者有動力持續長期紀錄；健康力官網提供完整及正確的衛教文章、健康力百大醫師諮詢、專屬醫療資訊推播等，讓利害關係人建立信任。
- Design
- 如何將數據即時回饋給用戶？
- 我們在共同討論 Flow Chart、分析使用者情境階段很腦力激盪，如： App 使用者可能是非紀錄本人數據如何達到即時同步和快速完成紀錄，也許可透過設定讓 App 開啟後預設為上次完成的量測項目和使用者身份。
- 心智圖完成後有了初步共同認知和方向開始 wireframe，設計中也會遇到易用性判斷須做決策(如：使用者新增量測數據後欲新增其他種類量測數據更快速的步驟、一日血糖數據如有多筆欲刪除會是單日全刪或單一筆...等)，決策考量會取決於開發時間和複雜度等多方面會由 PM 和 IT 討論後決定。
- 針對專案設計一套 Components、Color system，在診所端所需健康週報介面設計也和專案 App 設計系統統一， Mockup 設計為階段式交付給 IT 讓產品可短時間內先上線測試單一項目。
- Conclusion
- 通常想到紀錄會讓人直覺想到是麻煩事所以專案希望解決麻煩步驟，讓使用者透過遊戲化養成習慣有動力持續使用 App，透過設計的流暢操作步驟和易懂的介面設計完成旅程。 產品特色：血壓血糖量測數據可透過機器的藍芽功能快速帶入資料、量測紀錄頁可切換時間範圍相比較之前、健康提醒數據是落在哪個範圍值內、就診時透過數據協助醫生找出健康變化狀態、點數可透過線上商城和實體門市購買商品折抵金額等功能。 專案使用 MVP 模式開發，參與從 0 到 1 開發過程，學習到很多 UX 思維如產品市場分析、在不同情境下會遇到的狀況判斷能力和畫面呈現資訊、App 開發流程等；專案中獲得最有成就在於設計前、中去釐清使用者情境問題和互動回饋設計。
- Project
- 綠杏健康力-會員註冊/登入優化
- Team Members
- PM / DESIGNER / (APP) ENGINEER
- JD
- UIUX design、Icon design、Color system
- Review
- 專案目的：註冊流程優化、新增第三方帳號功能；目標族群：線上線下和 App 的新舊會員整合。一致性的註冊登入介面在不同平台使用同一個帳號即可，優化註冊流程可獲得更明確會員的輪廓透過數據對會員準確行銷和會員保持更長久關係，也將會提高轉換率。
- Background
- 綠杏健康力有線下門市、線上商城、綠杏健康力APP等集團事業逐漸擴大，早期會員未走過完整註冊步驟導致會員資料上無法辨認準確性，線上和線下各一個帳號也有重覆推薦會員狀況，整合後將避免資訊不同步問題。
- Challenge
- 過去未走驗證步驟註冊的舊會員無法確認資料準確性會一併透過後端篩選帳號寄送簡訊，告知用戶健康力集團整合平台快速註冊登入和會員權利，設定一個時間點將會移除未完成註冊的幽靈帳號，為了吸引舊用戶回娘家提供完成新註冊登入步驟用戶獲得點數等優惠福利。
- Research
- 專案前期花了較多時間做使用者研究搜集、情境分析、定義問題，現階段為平台整合不論新舊會員都需走新註冊步驟流程所以介面以註冊為優先考量；現今 Line、Facebook 等平台已是主流所以列入開發第三方平台快速註冊登入增加用戶意願，因 App 有量測數據屬個資方面所以也需考量排除避免個資外洩可能性發生。
- Design
- 註冊登入步驟有大量的情境判斷先透過 Flow Chart 了解各個會遇到的情境；競品分析研究決定 App UI 註冊/登入以結合前導頁功能為最快速引導。
- 在設計中也遇到多種不同情境須了解的問題多次討論才完成初版畫面；在介面上設計流程步驟狀態讓使用者有先被告知心態感到操作是快速流暢，在 input 欄位加入 Placeholder 提示字、欄位下方加上一行說明文字提示代替紅色文字警示減少壓力，而按鈕的預設狀態、位置和文字表達是否能讓使用者順利完成操作旅程也是重要的因素，在可能卡關的步驟加上連絡客服專線，盡可能讓使用者在操作當下不感到困惑和找到需要的協助。
- 專案也做了線上商城網頁版的會員註冊/登入RWD切版，使用js語法如：OTP填寫自動跳格、OTP重取倒數秒數、密碼顯示/隱藏切換...，第一次接觸完成後有小成就感。
- Evaluation
- 用戶綁定第三方註冊後，更換了手機電話又忘了登入密碼也無法收到重設密碼簡訊通知，這類型個案之後也有出現的機率，改善方法為建議在個人資料增加提示字提醒用戶。
- Conclusion
- 在未登入狀態下可看到、可使用的功能、用戶註冊/登入的時機、簡化註冊所填寫的資料等都是可減少用戶壓力。App專案開發完成後，內部進行功能測試、易用性測試等，在專案中學到判斷情境不同的提示狀態、如何讓使用者順利且減少不耐煩的完成旅程、釐清問題、工程師所遇到的問題討論等。
- Project
- 內政部 - 海域資訊整合平台
- Team Members
- PM / DESIGNER / IT
- JD
- UIUX design、Icon design、Color system
- Visit Website
- https://ocean.moi.gov.tw/Map
- Review
- 專案開發主要是負責內政部海域資訊整合平臺
提供海域資訊整合平臺相關動態消息、各項活動紀錄、重要事項公開等，可依據日期、消息類型及關鍵字查詢。有鑒於內政部已多年進行陸地上圖資資源整合，並有共同的資料標準、地圖平臺、資料更新、供應服務等平臺式的成果提供各業務相關單位資源整合，發揮流通互享之最大利益，讓人民對於我國週遭海域有進一步的認識 
-
專案前期研究大量資訊分析和規劃主要是PM團隊(約4~6人)負責，專案跨部門會議會有所有設計師和專案所有RD工程師加入
系統主要是以功能操作服務和RWD設計，較多專業資訊先花些時間了解產品架構，設計師提供不同的Referece和PM討論風格方向後PM製作Wirefrme和設計討論，設計師再從mockup接手先提供初版確認風格和UI design。為每個功能、工具選單製作icon design和以海洋大地色和對比色搭配一套color system 
- 為了讓地圖畫面呈現較為完整，UI design上方為選單、左側為次選單、右側為量測工具，左右功能列是可收和功能；RWD預設為收和狀態只顯示icon
- UI design頁面超過20頁還需同時規劃RWD設計，確認UI操作邏輯和風格一致，用較直覺減少學習讓使用者能順道完成資料查找
- 登入者如是管理者身分會多管理頁面權限功能，透過平臺可多人共編更新或新增資訊完成維護
- 大型專案中學習最多的有跨部門溝通，釐清專案需求協助完成設計部分和階段式需交付給RD的檔案格式和備註。還有重要的時程規劃，將每個功能釐清階段式完成在時間內和PM確認UI資訊再提供檔案給RD和說明，能在專案中更認識負責的窗口也能讓專案更順利。
- Project
- 經濟部 - 自然環境資料庫網站
- Team Members
- PM / DESIGNER / IT
- JD
- UIUX design、Icon design、Color system
- Review
- 專案開發目的：結合全國各種具有空間分佈特性之地理資料，將國土空間的組成物件表現在系統上，包括地上及地下的圖形（如：地形、地質、水文、地籍）及屬性（文字、符號）資料，使用者可依需要將相關的圖資加以套疊，進行資料存取、處理及分析。
- 專案有RWD開發，官網首頁以土攘層插畫風格設計搭配專案角色IP當主視覺，設計一套和水文、土攘相關icons分別有ON/OFF情境，色系以大地色為主，為了讓圖像能更組織化在左上角加上小圖標代表類別；選單icon以黑白/彩色當開關在地圖上切換圖層
- 在手機裝置時選單只保留五個工具，手機選單固定於底部利於操作讓地圖呈現最大觀看畫面，也可將頁面儲存於桌面會有系統專屬小圖示以便往後快速開啟使用。 專案中最具挑戰性的部份是：選單工具每個icons設計由繁化簡+文字搭配讓使用者快速辨識。
- Project
- 昇恆昌免稅購物網 - Landing Page
- Team Members
- MARKETING / DESIGNER / IT
- JD
- UI design、Front-end design、GA
- Review
-
昇恆昌免稅宅配網-電商販促一頁式活動頁
由營運、行銷將本期主打商品資訊整理提供檔案給設計，先找幾款流行趨勢的reference提供給行銷參考確認風格(有時是行銷提供)，會先從KV設計確認在延伸風格色系製作UI Design，mockup確認後上產品資訊；RWD切版包含加上追蹤碼完成後上傳測試確認無跑版問題，當活動有會員登記機制將由IT串接程式，設計師最後檔案整併上傳發佈；大型販促檔期會包含EDM製作透過mailchimp系統發佈
- 在販促檔期中逐漸提昇了熟練度和時程規劃也透過GA分析看到追蹤的數據，包含跳出率、離開率、停留時間...在每季KPI指數也會由GA數據做考核指標之一
