茂盛醫院新版線上掛號系統：
https://www.ivftaiwan.tw/appointment
茂盛醫院新版掛號系統，終於在 2026 年 9 月正式上線。
如果從我們最早承接這個專案開始計算，中間其實已經經歷過幾次調整。
2023 年茂盛醫院新版官網上線，2024 年再完成板橋院區的網路掛號功能，配合兩個院區不同的科別配置，調整掛號流程與頁面結構。
到了 2026 年，這次改動的幅度已經不是局部修正。
從掛號流程、院區切換、醫師篩選，到看診進度，我們幾乎重新把整套系統檢查了一次。
如果把我們在 2023、2024 年設計的版本算作 1.0，
這次的改動幅度，應該可以叫它「茂盛掛號 2.0」了吧（笑）。
這次有趣的地方，是我們不是重新設計別人的東西。
而是回頭修改幾年前自己做的設計。
01. 網站上線之後，設計其實沒有結束
第一版掛號系統正式上線後，我們陸續收到一些實際使用者的操作反饋。
有些原本在設計階段覺得很合理的操作，真的交到不同使用者手上，才會慢慢發現：
原來這裡還可以更直覺。
原來我們以為很清楚的東西，其他人不一定這樣理解。
另一方面，這次也不只是處理既有問題。
隨著板橋院區未來可能增加其他門診需求，原本兩個有些微差異的掛號介面，也開始需要重新思考。
如果未來還有更多科別、更多服務加入，我們是不是應該趁這個機會，把整套系統重新整理一次？
所以這次的 2.0，不只是把畫面重新設計
而是從實際使用之後發現的問題，再重新檢查一次整個掛號系統。
下圖為2024年的設計版本，與我們接手前後的設計介面差異：
02. 先統一規格，再開始談畫面怎麼改
這次有一個很重要、但從畫面上不一定看得出來的改變：
我們希望把原本有些微差異的掛號規格重新統一。
過去不同院區因為門診需求不同，在操作介面與系統邏輯上也存在一些差異。
短期來看沒有太大的問題。
但當院區、科別與服務持續增加，如果每一套掛號流程都各自發展，後面的管理與維護只會越來越複雜。
因此這次我們先從系統本身開始整理。
重新確認共用的掛號邏輯、操作流程與資料規格，再回頭處理畫面。
官網與醫院 APP 也可以共用同一組 API，不需要各自維護一套掛號邏輯。
對使用者來說，不需要因為換了一個院區，就重新理解一次怎麼掛號。
對後續管理來說，也能減少不同系統各自為戰的問題。
這次不是先問「新版要長什麼樣子」
而是先問「這套系統接下來要怎麼繼續使用？」
工作中的 wireframe 流程規劃：
我習慣把線稿做得精確，填入真實資料，而不是使用假字
在和客戶討論的時候，也可以很精準知道現在還缺了什麼，還有哪些資料不足。
03. 這次最難的，是修改自己原本的設計
過去我們接手網站改版時，多半是在重新整理別人留下來的舊系統。
原本的資訊架構、操作方式與視覺風格都有比較大的調整空間。
你只要提取裡面的資料，打掉重練，差不多就會有個樣子出來。
但這次不太一樣。
因為被我們拿出來重新檢視的，是自己幾年前做的設計
再從裡面找到好的區塊、還有不足的地方
這其實滿有趣的。
有些當時覺得很合理的設計，經過幾年的實際使用、不同使用者的操作，再回頭看，確實會發現有更好的方法。但我們也不希望為了讓新版看起來「改很多」，就把原本已經熟悉的操作全部推翻。
所以這次一直在兩件事情之間來回：
哪些東西真的需要改？
哪些東西其實應該留下來？
視覺上也是如此。
新版仍然保留原本茂盛醫院網站的設計語言，但重新整理資訊層級、按鈕狀態、操作回饋與手機版體驗。
04. 查詢方式從四種收斂成兩種，重新整理掛號入口
原本的掛號系統提供四種查詢方式：依門診表查詢、依醫師查詢、依科別查詢，以及依日期查詢。
回頭看這四個選項，其實有些需求是重疊的。
找醫師最後還是要選日期，選了科別也需要查看門診安排。使用者一開始卻得先決定，要從哪一種查詢方式進去。
這次我們把入口收斂成兩種，名稱也寫得更明確：
- 依科別找醫師：知道要掛哪一科，就從該科的醫師與門診安排開始找。
- 依醫師找診次：已經有指定醫師，就直接查看他的看診日期與診次。
日期選擇整合在後續的掛號頁面裡。原本分散在不同入口的查找需求，可以在這兩條路徑中接著完成。
在預約掛號的入口下方，也保留「看診進度查詢」和「掛號紀錄／取消」的快捷入口，方便已經掛好號的人直接使用。
我們也一起調整了最上方的頁籤。
以前這裡放的是「台中院區、板橋院區」，用來切換院區。
新版把院區選擇移到掛號主頁，進入所選院區後
上方改為三個主要功能：預約掛號、看診進度、掛號查詢。
先確認要去哪個院區，再選擇要辦的事情，兩個層次就分開了。
這次整理的重點，是把每個入口的用途交代清楚，讓使用者比較容易決定下一步。
05. 從時間表格，改成一筆一筆看得清楚的列表
把原本的時間表格改成列表，是這次我很喜歡的設計之一。
以前的掛號介面，把一週的日期、科別和早午晚診放在同一張表格裡。
好處是可以一次看到整週安排，但要找到某一天、某位醫師的門診，就得在橫向日期與縱向欄位之間來回對照。
尤其到了手機上，同一張表格裡要容納這麼多資訊，每個格子能使用的空間就很有限。
這次我們把日期選擇獨立出來，下方依早診、午診、晚診分組，用列表呈現當天的門診。
每一筆都有自己的位置，可以放進醫師照片、姓名、診間與掛號狀態，也讓掛號按鈕更容易辨認。
已額滿、停診或代診等情況，也能直接標示在對應的門診上。
使用者選好日期後，就可以往下查看當天的安排，不用再沿著表格的行列找交叉位置。桌機與手機也能沿用相同的閱讀順序。
配合前面兩種掛號入口，列表也有各自的呈現方式。
醫師有自己專屬的掛號頁面，集中呈現他的門診安排；科別頁則列出該科在所選日期的醫師與診次。
同樣的列表結構，可以配合不同的查找需求使用。
這也是我喜歡這次調整的原因。從選擇入口到查看門診，前後的資訊可以順著接起來。
06. 看診進度：這次自己最有感的一個改動
這次自己最有感的，其實是「看診進度」。
以前查詢看診進度，最重要的通常只有一個數字：
現在看到幾號？
但真的坐在候診區等待時，使用者想知道的其實不只這件事。
前面還有多少人？
哪些號碼已經看完？
哪些人過號？
現在正在看誰？
我自己的號碼到底還要等多久？
所以這次我們把原本單一的進度資訊，改成比較完整的看診進度表。
透過不同顏色與狀態，可以直接看到：
- 已完成
- 過號
- 看診中
- 未看診
- 已報到
不用只盯著一個不斷變動的號碼，猜自己到底還要等多久。
我們希望減少的，不只是操作步驟，也包括等待時那種「不知道現在到底輪到哪裡」的不確定感。
這大概也是整次改版裡，我自己最喜歡的一個小地方。
07. 把自己的設計再做一次
這次開發的時間還蠻長的，主要落在前置規劃作業。
中間也有很多來回討論與實際操作後的修正。
有時候我們認為這樣比較好的設計，真的交給非參與此專案的使用者操作，才發現事情沒有想像中那麼理所當然。
然後再改、再測、再討論。
某種程度上，這次的工作很像一直在打槍幾年前的自己（笑）。
但我其實滿喜歡這種工作方式。
因為網站真的上線之後，才會開始遇到各種設計階段不一定想得到的情況。
而這些實際發生的問題，也會再回頭影響下一次的設計。
好的介面不一定是第一次就把所有事情想對，而是上線之後，還願意繼續看、繼續改。
看到新版順利上線，我們自己都滿喜歡最後的成果。
還是會有小小的成就感，很滿足。
也希望實際來掛號、等待看診的使用者，可以感受到這些藏在操作裡的小小調整。
Project Information
專案客戶： 茂盛醫院
UX / UI Design： 超能力設計戰隊 Innovation Plus
專案內容： 網路掛號系統 UX / UI 優化、掛號流程整合、看診進度介面設計
正式上線： 2026 年 9 月
