臺北市政府
臺北市市民服務大平臺流程介面優化
Year
2020
Sector
教育與生活
Service
商業策略
體驗創新
Background
透過「以民為重」優化策略，統整超過千項線上申辦服務，精簡使用者申辦步驟
遊石設計團隊本次與中華軟協、PDIS合作，參與並協助「體檢政府網站數位服務」使用者中心設計 (UCD) 工作坊，並針對「臺北市政府市民服務大平臺」網站進行 UIUX 評估作業。
在過去執行政府數位轉型專案：桃園市網路e指通的成功經驗下，我們期望能輔佐協助政府機關與青年學生團隊積極溝通，使參與方們在三天工作坊中，釐清目前網站遇到的問題、使用者痛點、機關人員需求等，並重新規劃網站平台的使用者體驗與流程，讓民眾在線上進行申辦服務時能更加輕鬆、流暢、有效率，進而引導民眾生活經營逐步走向數位化，帶來數位轉型的正向成效。
市民服務大平臺簡介
市民服務大平臺是由台北市資訊局所建構，整合臺北市政府各機關之申辦案件服務，提供超過 1400 項線上申辦服務，並提供市民 24 小時全年無休的案件申辦服務。
設計挑戰
重整資訊架構
臺北市市民服務大平臺是市民申辦服務的綜合入口網站，提供民眾日常生活所需的相關申辦服務如申辦說明、線上申辦、進度查詢等，網站服務資訊內容多而龐雜，而目前的網站沒有提供有效的服務項目分類與對應的資訊架構，無法有效幫助使用者找到目標申辦服務。需更符合使用情境與需求，讓使用者在尋找目標上更順暢。
簡化申辦步驟
線上申辦服務步驟繁雜，申請流程過於冗長、費時，若以線上申請「租用公有場地」流程為例，申請步驟共有七個階段，讓使用者在申請流程在感到煩雜、不悅，且表單跳轉頁面多、表單設計易造成填答錯誤，更加造成使用者困擾。
順暢流程動線
頁面視覺動線設計不順暢，不易確認相關申請資訊的內容，若以租借場地的時間選取流程為例，時間資訊顯示不明，難以快速理解是否可供租借，且在選取時間後，資訊內容和確認選項編排位置不佳，使用者容易因視覺動線不流暢而產生焦慮。
改善搜尋檢索
首頁易用的關鍵字搜尋功能，也沒有有效的篩選搜尋功能，例如目前搜尋功能沒有支援模糊搜索或全文搜索，故使用者在關鍵字查詢上不易搜尋；另外，目前各項申辦服務並無提供的篩選器或能篩選條件極少，讓使用者難以選取適合的篩選條件，需放置符合使用者需求的搜尋欄和篩選器，讓用戶在搜尋功能上無障礙。
Research
透過顧客旅程地圖 CJM，找出網站問題與痛點
我們帶領工作坊團隊成員共同利用「顧客旅程地圖」(customer journey map) 工具進行網站使用者流程分析，將蒐集到的使用者與利害關係人訪談資訊透過視覺化、圖表化，拆解使用者的使用流程、行為動作、接觸點、情緒波動和痛點等，進而檢討服務過程的缺失，以作為設計改善的參考。
Strategy
從十大易用性原則出發，提升操作便利與資訊易讀性
在檢視現有網站的過程中，我們認為 Jacob Nielson 於 2005 年所提出的十大網站體驗設計原則中，有幾項特別可以用來檢視網站的視覺介面設計，透過以下六點經驗法則 (heuristics) 來進行評估，可以更快速地讓我們定義現有的視覺介面設計問題：
一致性和標準化 (Consistency and standards)
市府主色系帶入設計，定義網站的視覺識別系統，也透過重新設計呈現元件的樣式，提升一致性和標準化，降低使用者的學習門檻並增加識別度。
連結系統與真實世界 (Match between system and the real word)
打破原本以機關的服務為框架的資訊架構，改以更貼近使用者的語言、情境出發，重新分類 1400 餘種的功能，以更有效查找。
幫助和說明文件 (Help and documentation)
增加畫面上的說明文案，並以更加精確和能幫助使用者理解的方式撰寫。透過強化幫助和說明文件，加以改善工具型網站資訊過於複雜而造成困擾的議題。
辨識而非記憶 (Recognition rather than recall)
篩選與規劃資訊內容，幫助使用者快速分辨並從中取得訊息，且將重要的介紹說明放在顯眼或可輕易使用的位置，讓使用者集中注意力於執行關鍵行為，減少錯誤發生的機會。
美觀與簡化設計 (Help and documentation)
重新規劃設計申請流程，簡化原先繁瑣的申請步驟，合併或隱藏非關鍵訊息或功能，僅突出重點資訊，減少使用者的記憶負擔、增加易用性，也防止使用者在繁瑣的流程中出錯。
視覺層級 (Visual Hierarchy)
利用視覺元素區別資料的重要性，並且重新組織、排序內容，引導使用者觀看的焦點 (Call To Action) 或順序，讓使用者盡可能輕易地理解資訊。
Execution
重組資訊架構與搜尋機制，化繁為簡提升查找效率
改善首頁搜尋引導文字與資訊分類方式，讓使用者讀取資料無負擔
原本的引導文字「您需要什麼服務？」無法讓使用者清楚理解網站主要用途，需要使用者的推測與猜想。而建議改善的新版首頁設計，提供清楚明確的引導文字，並且加入熱門服務排行榜，作為市府政策宣導的區域，引導使用者可由此直接進入推薦服務。
而申辦服務區塊則重新設計分類方式，改為「服務主題」、「身份角色」、「機關單位」分類，以使用者需求而非機關單位的角度出發，能讓使用者快速了解平台主軸與申辦服務項目，更方便查找。
優化進階篩選功能、索引標籤，服務查詢更便利
以公用場地租用為例，進階篩選功能改為獨立放置於左側更明顯，同時也考量RWD響應式設計優化體驗，並讓原先的篩選功能更易被發現和使用，解決不易搜索的問題，另外，也添加場地分類的索引標籤，清楚標示場地類別，方便擊進入查看相關場地。
精簡申請流程，三步驟輕鬆完成
原先公有場地租用的申請流程為七個步驟，分別為簽署同意書、挑選租用時間、填寫資料、確認內容、身分驗證、繳費、步驟完成，繁瑣的流程會造成使用者申請時不耐煩且效率較低。
團隊的重新規劃與設計申請流程，以合併頁面、小視窗呈現及刪減非必要的步驟等方式，將其簡化為三個步驟，增加使用者的申請效率。
清楚區分租借狀況，使用流暢無障礙
原本的月曆設計，無法一眼看出可租借與不可租借日期的分別，使用者須個別點擊日期後才能了解預約狀況。而建議改善的新版月曆設計，運用顏色清楚區分租借日期的狀況，以黑色日期表示可點選租借、灰色日期表示無法點選租借，並且以灰色日期加上紅色斜線表示此場地已額滿。
Conclusion
用設計回應公共資訊查找困境，打造更一致、可預期的使用體驗
後疫情時代的數位轉型需要看得見的硬體設施與建設，而從政府到個人的服務軟體平台多為服務整合平台，規模與資訊量龐雜。透過良好的資訊分類與資訊架構，引導使用者理解各服務內容、找到需求項目，並順利使用服務。
表格設計中遵守既有設計規範，著重跨流程間與操作控件的一致性，將有助於減少使用者的學習負擔。
對於內容豐富，資訊繁雜的網站，透過資訊分類、編排規劃提升閱讀的順暢度。善用視覺階層規劃以及版面區塊配置，區分內容層級，更具組織性。
重新規劃設計申請流程，簡化使用者所需步驟，合併或刪減非重要訊息及頁面，不只讓重點流程突出，同時增加操作過程中的流暢度。
特別感謝本次合作單位 PDIS 以及工作坊的同學們：李彤、孫若盈、李佩芸、張硯涵
