Functional Website
安聯人壽
智慧退休小幫手
此專案為一組互動問卷網站，藉由二階段的退休規劃問卷，帶入投資產品介紹。第一階段由機器人「小金」一問一答詢問個人資訊；第二階段則接續進行風險規劃評估、提供合適的投資組合。
整體視覺設計風格需遵照業主提供的企業規範再以小插圖增加趣味感。我負責使用 sketch 製作 mockup 畫面，並且提供切版 html/css 頁面，後續由其他程式廠商套用 angular 框架 (此為業主需求) 並串接後台 API。此工具為銷售人員說明會使用，因此並無展示在公開網域上。
一、聊天機器人形式的問卷
第一階段問卷，為銷售人員在商品說明會上所使用的工具。原本單調的表單，改以聊天機器人形式呈現。機器人「小金」為我配合問答情境繪製的小機器人，身上設計了三組配件造型 - 徽章、披風、圍巾供業主更換。
下方 2 張圖，圖 1 為手機版，側錄問卷一開始詢問個人資訊的畫面。圖 2 為 Pad 版，側錄作答完後，總結個人資料的部份。
二、風險評估與基金組合
調查完個資後，進入風險評估環節。有單選題與多選題，計算總分後得出使用者的 3 種風險類型(保守型、穩健型、積極型)。接著，再依這 3 種風險類型，由平衡型/多重資產型、現金、債券、股票依比例搭配，提供 6 種投資組合作為選擇。
切版方面有一個重點是繪製投資配置圓環圖 / donut chart。（點此觀看 6 種投資組合的圖表）。我們希望圓環有一個進場小動態，且可以在圓環的旁邊顯示出 label 名稱與百分比。第三方套件我採用Chart.js，在圖表旁印出數值則是搭配 chartjs-plugin-labels 這個 plug-in。
UI 規劃
Sketch 畫面
