華城電能

華城致力於電動車車主充電的便利服務，在充電樁的建置上將持續提升數量、提高品質。我們本次目標是利用樂活開發出的系統，將華城的業務端與客戶端做資料整合，並且從預約、場勘到施工的各項實施環節採用線上、自動化流程以達到高效率的商業管理。

< 其他案例

科技 / 工業
訂閱
預約
產品
系統
精選

前往網站

視覺 / 前台特色樂活以自豪的視覺力帶給使用者獨特的視覺設計，為品牌開創無限可能！

首頁即是各家車廠的LOGO品牌，如欲將愛車建置充電樁，可搜尋愛車品牌並預約進一步建置評估。

在"家用充電樁的安樁服務"內容設計上，為追求資訊的統整與閱讀性我們以頁籤的方式製作，將複雜的資訊分類化、系統化是樂活的強項之一。

以按鈕切換的方式呈現各項段落的重點描述，正如同前一張敘述的一樣，我們有各式各樣的方法能打造不同的視覺感受，帶來版型豐富的變化。

常見問題以開闔的方式收納資訊，可有效減少版面空間。內容也可放置圖片來加強問題回答的解答效果。

其他流程的視覺設計。以icon的方式增加閱讀的豐富性，讓閱讀不生硬；流程的部分也會根據內容而有不同變化，如右圖。
會員中心登入與註冊，為會員而生的使用者後台

基本的會員登入流程，在此可見我們把忘記密碼與註冊也帶進來，讓使用者方便前往各地。忘記密碼時有下一步的驗證流程 (與註冊時相同)，將會在下一張展示出來。

與登入頁面不同的是，註冊頁面在各個平台或企業皆有不同的會員管理政策與方式，會根據產業屬性而有不同的註冊資料。在這裡我們按照步驟所填入的資料都會在會員中心的會員資料中帶入，方便彙整以利使用。在註冊流程第一步時，我們會讓使用者指定驗證的工具，系統發送驗證碼後回填收到的驗證碼來通過驗證。

會員註冊第二步：個人資料填寫，此處會記錄基本資料，以便在日後需要的欄位中自動帶入。

會員註冊第三步：紀錄會員關於電動車的一些偏好與資訊以便讓平台能知道會員的需求，進而提供更好的服務。

會員中心後台介面。左側以側邊欄歸納不同項目，右側則顯示該對應項目的內容。
系統後台樂活開發的後台系統，提供客戶最複雜的任何需求。使用樂活，經營樂活！

在如此規模龐大的後台建置案例中，我們會提供客戶功能上的流程圖，逐一確認欄位、頁面、功能，並且製作成可仿網頁點擊的Prototype供客戶確認、檢視。

確認白框圖的功能實施細則後我們會進入功能開發階段。後台管理介面清楚列出平台系統的所有功能 (左側邊欄)，右側淺色處則是對應的相關資訊、欄位、設定、編輯。由此頁可見在控制台內可以看到大部份關於網站與系統的概要，讓管理員即時掌握和編輯。

帳號管理可查看與編輯不同角色的資料，並讓它們之間有需要時與彼此連動。

帳號管理-施工商可以有效管理施工商的廠商、人員資料，並在前台選項中作連動。

車廠的廠牌部分可做新增與編輯，除了可放圖片，可以由此登陸相關業務範圍的車型、經銷商，並讓它們在前台選項中作連動。

車廠-經銷商是登錄經銷商的名冊部分，並在其他相關流程中做資料代入的連動。

車廠-銀行帳戶管理可以登陸相關匯款帳戶資訊，以便在前台顯示出來供使用者使用。

案件管理是由使用者從前台填寫的預約資料，存到後台讓管理者進一步控管案件。

案件管理與其他不同的是，我們針對該區域設計頁籤，可將不同填寫的分類與階段分開避免內容攏長、混淆與引響辨識的狀況發生。

郵件模板，可以在這邊自由的編輯發送信件的內容，寄件觸發點都是設定好的。
串接功能介紹串接功能，提供方便客製化的使用者體驗

➊預約網站預約成功後加入LINE好友訊息→對話框有小鍵盤可以點選我要查詢；或是最新活動、我要預約，點選我要查詢引導至連結網站，點選我要預約連結至預約網站→輸入正確案件編號、電話、姓名，即可查詢想要的狀態、預約時間、報價單等等。若有尚未預約的客戶點至這網站，右上角會有圖示點選後連結至家充預約網站。
➋案件資訊API在登入並取得Token之後，使用者可以查詢案件的詳細資訊。查詢時需要提供「案件編號」以及「員工工號」，並且必須附帶登入時取得的 Token。系統需要回傳的內容包含：⑴使用者預約時間⑵預計的場勘時間⑶預計的安裝時間⑷場勘費付款狀態(例如已付款、未付款、核對中)⑸施工費付款確認日⑹報價單 PDF 的路徑（建議為有時效性的連結）

➊網站開給app驗收項目的API共有：
1.身分驗證API → 2.案件資訊API → 3.照片上傳API → 4.完工審查API
➋驗收審核流程：登入APP (各工班專屬帳號密碼) →選擇案件 (串接後台資訊，只能搜尋各自工班案件編號) →照片拍攝→支援批次選取多張完工照片→ *可按「照片上傳」、「完工審核」，若按「完工審核」送出後即鎖案件，無法新增或修改任何照片→上傳圖片至網站後台，並推送Mail通知給該案工務負責人。

多條件搜尋篩選，針對「完工已審核」「預計完工日期區間」篩選案件做驗收，同時也可針對不同狀態、廠牌、業務、顧客等等篩選搜尋。

網站後台工務端驗收項目：
1.新分頁「完工審核」→ 2.照片審核區 → 3.退件鈕(包含可以記錄退件原因) → 4.確認驗收鈕(包含發送Mail通知給工班、案件狀態需跳轉為完工已審核) → 5.一鍵存檔

在金流部分提供綠界與銀行轉帳等多元方式。

在後台也可直接開立電子發票等功能。
安裝預約介紹安裝預約表單與連動功能

安裝預約的表單填寫，填寫完成後就會進入預約安裝查詢的流程。值得注意的是，保時捷有自己另外的一份資料串接，雖然跟圖片的欄位一樣，但資料與會員在後續規劃中，有與華城獨立簽約的車廠可以擁有自己品牌設計風格的會員中心與表單欄位客製化，從個人化達到品牌行銷效果。

如尚未預約安裝，在進度查詢時會是左側的畫面，由按鈕引導至預約表單；如已經預約了，則在查詢時可以看到訂單狀態與日期。

針對已提出申請的文件有查詢的功能，並藉由顏色來區分狀態。

費用的支付方法有兩種，一種是【線上刷卡】串接綠界科技。對於支付前的發票設定有許多欄位選擇的判斷。

費用的支付方法有兩種，另一種是【轉帳(ATM臨櫃)】。彈性的付款方式可以幫助更多客戶建置充電樁。

施工階段也有不同顏色的狀態可供預約客戶的進度參考。

施工階段最重要的就是施工前的報價單，後台提供可讓廠商根據客戶需求而有不同方案的選項及費用。

其他狀態比如暫緩或取消合約也有對應的狀態顯示。
案件管理介紹案件管理相關功能欄位

案件管理總覽可看到案件分號、單號、申請人名稱、顧客名稱、工程名稱、狀態、總工時等。點編輯按鈕即可看到案件詳細內容。這邊與內部ERP系統做串接，資料雙向同步。

在案件管理的詳細頁可看到所有案件的相關資訊、進度、聯絡資訊，像是專案代號、甚至到週邊設備、設備規格都可查詢，並可上傳與列印複檢與工時紀錄等，是功能詳細強大的後臺。

行事曆功能可讓管理者針對已安排場勘或施工查閱，包含日期（月）、工作人員、服務項目、工作時間資料跟都會自動帶入行事曆。

這邊可以設定相關通知設定，像是場堪、安裝後、維修後通知收件人等。

滿意度問卷用直觀得點選方式可讓使用者提供滿意度回饋。
維修管理介紹維修管理相關功能欄位

客戶維修案件總覽管理，在總覽頁可看到維護案號、案件名稱、客戶代號、結案狀態等。這邊與內部ERP系統做串接，資料雙向同步。

客戶維修案件管理詳細頁，基本資料頁面可看到維護案號、訂單編號、基本資料、設備序號、案件名稱、客戶代號等。維修進度頁面，可以看到廠商、維修相關狀態、結案狀態等。

客戶維修案件管理詳細頁，RD判斷頁頁面可看到問題分類，在備註頁可看到案件管理的備註。