• 登入
  • 註冊網站會員
CIO Taiwan
  • 活動
  • 影音
  • 趨勢分析
  • CIO 雜誌
  • CSO精選
  • 電子報
  • 下載
  • 聯繫我們
沒有結果
查看所有結果
CIO Taiwan
沒有結果
查看所有結果
首頁 專欄

HIS的美學與人性化設計(上)

2021-04-29
分類 : 專欄
0
A A
0
孫10

前面幾期都在談有關後端微服務(Micro-Services)架構,如何將單體式服務拆解成微服務架構,運行在容器化。也是近幾年很熱門的軟體系統架構。但這一期的主角並不是後端微服務,不過微服務架構背後的理論跟實踐方法,跟本期所要談的主角-微前端(Micro-Frontends)有相當大的關聯。

因為兩者的基本概念是一樣的,如何把龐大的前端專案,依照不同的商業邏輯,拆分成不同的模組(Module),再針對每一個模組,用不同的技術或團隊來維護,也可以使用不同的技術或框架建構,甚至各個模組都可以獨立的擴展跟部署,達成「模組間低耦合,模組中高內聚」的特色。

HIS的早期UI設計未考慮美學與人性

早期的HIS在設計時,其實都是All-in-One,所有的資料都是大鍋炒,不管是新增、刪除、修改、查詢,都在同一個畫面完成。整個畫面雜亂無章,操作步驟又繁雜,使用者介面也不夠友善。另外,沒有任何的權限管控,每一個人都可以任意的刪除、修改、新增,畫面裡面也沒辦法依照步驟或是流程來控制,不管什麼流程,所維護的內容,都在同一個畫面去完成。

[ 下載 2020-21 CIO大調查報告,掌握最新企業IT導入趨勢 ]

另外,還有一種常見的問題,就是不同單位所使用的查詢報告,比如說醫院的檢驗報告,醫師可能有醫師的畫面,護理有護理的畫面,檢驗科有檢驗科的畫面,它們所呈現的資料跟內容畫面都不一樣,導致檢驗科跟醫師在溝通時,醫師講A,檢驗科講B,造成很多的誤會跟糾紛,形成很大的溝通不良。

早期有很多的HIS畫面設計,並不太貼近於使用者,沒有「就源輸入」的概念。也就是說,整個畫面的流程,第一個流程可能要輸入兩個欄位,第二個流程要輸入三個欄位,如果把不同時間產生的資料,都設計在同一個畫面一起完成,就有可能發生前面輸入的欄位,會被後面輸入的人不小心蓋過去或者打錯了,造成很大的問題。

此外,早期的HIS設計,所有人都是看同一個畫面,未能依使用者關注不同資訊去設計,比如說骨科所關注的項目,跟新陳代謝科所看的項目不同,如果不依照科別或醫師屬性,去設計不同的呈現資訊,會造成很多診斷方面的困難。另外,醫師要查詢另一個病歷資料時,往往需要切換不同的畫面。譬如說要看檢驗報告,要切到檢驗報告,要看放射科,就要切到放射科,要看病人的體溫、脈搏時,又要切換到另一個地方,讓醫師沒辦法很連貫的去思考病人的徵兆,以及相關的檢查數據。更慘的是不只切畫面而已,可能還要重新登入到不同的系統,才可以看到報告。

早期有很多HIS的子系統操作,因為是由不同的人在不同時期開發,每一個子系統的操作介面都不盡相同,不管是按鈕或是提示資訊,擺放的位置都不一樣,再加上字型大小、背景顏色,五花八門,毫無美學可言。另外,一些重要的提示跟異常值、顏色沒辦法統一標準,有的是紅色,有的是藍色等,畫面大小也不一,有的畫面看起來,很多資料擠在一起,很多畫面又留了一大堆的空白,造成使用者在檢視畫面時,非常的傷眼傷神。

[CIO都在讀: 導入微服務重構現代化HIS架構 ]

最可憐的就是醫師,看一個門診可能要彈跳很多的視窗,要不斷的按確定,有時候很多相同的視窗,在按下確定以後,還會再重複提醒,導致醫師就只能不斷的按確定,而且量一多,醫師根本也就不看裡面的訊息,應該是要做到統整一次提醒訊息,讓醫師可以一目了然的看清楚才對。

另外,彈跳的訊息在出來提醒以後,醫師有可能想要再看一次,往往卻找不到地方可以再看,也會成為問題。再來就是很多資料擠在一起,沒有去分類,不相干的東西擠在一起,沒有去做歸納分類,醫師要找個資訊,都非常的費力氣。

早期HIS系統的每一個欄位大小,往往沒有設計得很妥善,有的資料很長,欄位卻設計的很小,有的資料很短,欄位卻設計得很開,導致醫師對這樣子的畫面,真的是傷透腦筋,整個視力都變差了。

所以我們應該要從UI/UX的設計角度出發,思考要怎麼樣去設計HIS系統的架構,才能有效發揮HIS系統的價值。

前端設計UI/UX 密不可分

UI(User Interface)是指使用者介面,主要是在設計頁面上的功能,顧及使用的便利性跟整體性設計的美學,維持並創造網站的美觀性。UI設計師的目標,就是專注於「產品怎麼呈現」。

但近幾年來,強調的不只UI,希望UI在設計之前,還可以透過UX的使用者體驗設計師所傳達的路徑去展現UI。UX(User Experience)是指使用者在體驗系統的過程當中,是根據使用者的習慣,安排整個網站頁面的內容規劃,如那些區塊的內容要先在網站上出現,那些按鈕應該放在哪裡,確保使用者在使用UI的時候,可以很順暢的配合作業流程的邏輯一步到位。

也就是說,UI可以是將UX的理念實踐與美學工程師,包括整個網站的顏色、字型、字體大小以及配置安排,都可以通過UX的概念交由UI來設計,使用者跟電腦之間溝通的介面,利用電腦功能去「輸入」,來達成「輸出」的成果,也就是說,輸入輸出的規劃就是介面,透過介面來操作電腦完成所需,就是整個UI的功能跟精神。

[ 加入 CIO Taiwan 官方 LINE 與 FB ,與全球CIO同步獲取精華見解 ]

要辦到這一點,UX設計師必須要實施真人測試,他必須要先去觀察使用者行為,檢查出使用者沒辦法說出來的使用障礙,經過不斷的修改及使用者確認,創造出最棒的使用經驗。

UX及UI兩者是密不可分的,UX設計師關注的是整個介面的設計,更關心的是所有會影響使用者使用體驗的一切,例如資訊架構,互動設計、內容、使用認知、經驗、需求、價值觀等等,最終出發點就是使用者在使用系統的感受,解決及改善所有不便的地方。

UI是根據UX設計者所提供的設計架構,跟設計互動的內容,去考慮視覺的部分,將產品設計,以美學的概念,維持並創造出美觀性的介面。UI是關注使用者眼睛所看到的東西,強調的是「產品的呈現」,UX在乎的是使用者內心的感受,注重的是「產品使用的感覺」,所以要做好HIS的介面,就必須要兼顧美學及人性化的設計。

微前端的UI設計畫面

微前端的設計畫面,必須要去計一個可重複使用的樣板。譬如說我們必須要針對每一個企業和每一個系統制定CIS(Corporate Identity System),也就是畫面的標準模板,畫面可能必須要包括功能選單、系統功能顯示、最新消息、使用者是誰、我的最愛,還有哪些程式集。另外,查詢、存檔的一些按鈕,則統一放在工具列,以及操作時要顯示當下基本資料給使用者看,就必須要放在資訊列。

另外,側邊的輔助功能,則是提供相關的輔助查詢及選取項目的功能,還有系統的使用說明,系統是哪一個版本,還必須要不時地提供一些提示(Hint)功能,如不使用時要怎麼登出,儘量提供使用者智慧導引式的操作介面。

有前述這些前提,就可以去設計出微前端的UI介面。以圖一的中國附醫HIS優化再造標準操作畫面為例,其中有很多人熟悉的功能選單,會顯示功能項目,還有副標題,也會提供字型大小的切換以及最新消息。如果有最新消息,就會顯示還有幾封沒有閱讀的最新消息,還有程式集及使用者是誰,以及登出介面。

口述/孫培然 彙整/CIO編輯室

標籤: 孫培然醫療資訊系統
上一篇文章

Aruba ESP實現業務優先網路模式

下一篇文章

掌握「聲音經濟學」的市場商機

相關文章

1200 林宏文 250122
專欄

若見到三星李在鎔,我要送給他這句話

2025-07-01
I168s07 Web
專欄

AI 影響勞動市場的綜合性指標

2025-06-27
I168d05web
專欄

以永續金融驅動低碳永續

2025-06-25
下一篇文章
廖肇弘2

掌握「聲音經濟學」的市場商機

發佈留言 取消回覆

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

追蹤我們的 Facebook

近期文章

  • 汽車運算平台標準化 Arm Zena CSS 加速 AI 應用與開發
  • AI 應用新趨勢 UiPath 推新一代代理型自動化平台
  • 人臉導購與桌面偵測 金色三麥端出 AI 餐酒新體驗
  • 從供應鏈轉型遠眺長線戰略目標
  • OPSWAT 與 SentinelOne 建立 OEM 合作關係,導入AI強化多層次惡意軟體偵測能力

📈 CIO點閱文章週排行

  • ASUS NUC 15 Pro

    那可太厲害!華碩NUC 15 Pro系列迷你電腦 釋放AI極致潛能

    0 分享
    分享 0 Tweet 0
  • Rovo AI 三利劍 引領企業轉型 Linktech 攜手 Atlassian 以 AI 賦能企業

    0 分享
    分享 0 Tweet 0
  • 若見到三星李在鎔,我要送給他這句話

    0 分享
    分享 0 Tweet 0
  • AI 導入對大型企業是良藥還是毒藥

    0 分享
    分享 0 Tweet 0
  • TA-DIF 打造可解釋可部署 AI OT 安全異常偵測機制

    0 分享
    分享 0 Tweet 0
  • AI 影響勞動市場的綜合性指標

    0 分享
    分享 0 Tweet 0
  • 數位憑證皮夾開跑 奠定臺灣數位基石

    0 分享
    分享 0 Tweet 0
  • AI 如何透過 FHIR 與 HIS 無縫整合

    0 分享
    分享 0 Tweet 0
  • NVIDIA 黃仁勳:代理式人工智慧(Agentic AI)引領產業變革,數位員工時代來臨

    0 分享
    分享 0 Tweet 0
  • 人工智慧驅動的預測內容行銷 ─ 滿足全球 B2B 科技產品客戶需求

    0 分享
    分享 0 Tweet 0

數位及平面

  • CIO Taiwan 網站
  • CIO 雜誌紙本
  • CIO 雜誌 HYREAD 版
  • CIO 雜誌 Zinio 版

關注社群

  • Line 加入好友
  • Facebook 粉絲頁

合作夥伴

  • CIO 協進會

關於我們

  • 公司介紹及工作機會
  • 隱私權政策

旗訊科技股份有限公司|統編:84493719|台北市 100 中正區杭州南路一段 15-1 號 19 樓|TEL: 886-2-23214335
Copyright © Flag Information Co.,Ltd. All Rights Reserved.

CIO Taiwan 歡迎你回來!

可用 使用者名稱 或 Email 登入

忘記密碼 註冊

歡迎註冊 CIO Taiwan 網站會員

請設定 Email 及 使用者名稱(使用者名稱不接受中文、將來無法更改)

欄位皆為必填 登入

找回密碼

請輸入 使用者名稱 或 Email 以重設密碼

登入
  • 登入
  • 註冊
沒有結果
查看所有結果
  • 活動
  • 影音
  • 最新文章
  • 產業速報
  • 新聞速寫
  • 風雲人物
  • CXO分享
  • 產業瞭望
  • 專欄
  • 精選文章
  • 原生現場
  • 供應商視野
  • 線上調查
  • CIO 雜誌
  • 電子報
  • 下載
  • 聯繫我們

© 2020 CIO Taiwan 版權所有

7/28 活動延期通知

因高雄市政府於7/28早上宣布全日停班停課,因此「智慧醫療研討會高雄場」活動延期舉辦。主辦單位將另行公告研討會相關訊息,歡迎報名參加!

您已閒置超過 3 分鐘了,為您推薦其他文章!點擊空白處、ESC 鍵或關閉回到網頁

資通院林盈達 文章首圖

【專訪】國家資通安全研究院副院長林盈達

推動政府零信任架構 強化關鍵基礎設施安全 面對網路邊界日益模糊,資安院發展零信任

1200

趨勢科技宣布成立新公司 VicOne 為電動車提供優異資安解決方案與服務

全球網路資安解決方案廠商趨勢科技宣布成立車用資安新公司 VicOne,專注於協助

1200 Wolters Kluwer Hq

碳管理系統初探 ─ Tagetik ESG 績效管理

ESG 完美整合 EPS 掌握績效管理完美脈絡 ESG 規範發起於歐洲,源自荷蘭

供應商視野u

Utimaco耕耘臺灣市場 多款HSM齊發

攜手叡廷深耕市場 提供全方位技術服務 在全球持續爆發資料外洩事件下,帶動市場對

 A2a8030logo

Crestron落實手術培訓應用 孕育優秀醫學人才

CIO Taiwan 智慧醫療研討會 會後報導 快思聰(Crestron)臺灣總

1200 Asian Reseacher Check Lung Chest Covid19 Patient Xray Report With Positive Result Infection Detech Corona Virus Outbreak Epidemic Analysis Effect From Covid Human Body Test Concept

從囚徒困境到共贏 ─ 醫療機構如何成功擁抱數位轉型

文/楊宗龍醫師(員榮醫療體系科技副院長) 曾經受過EMBA薰陶的過來人,「囚徒困

Ciotaiwan Logo 600 White

文章分類

  • 產業速報
  • 專欄
  • 影音
  • 風雲人物
  • CXO分享
  • 產業瞭望
  • 原生現場
  • 精選文章
  • 趨勢分析
  • 供應商視野
  • 新聞速寫
  • 下載
  • Sponsors

熱門標籤

  • 最新文章
  • 雲端運算
  • 人工智慧
  • 數位轉型
  • 製造業
  • 物聯網
  • 資料與分析
  • 資安
  • 區塊鏈
  • 5G
  • 儲存
  • 基礎架構

活動

  • CIO價值學院 四堂課
  • 智慧醫療研討會 台北/高雄場
  • 金融科技高峰會 春季/秋季場
  • 製造業CIO論壇 台北/台中/高雄場
  • 商業服務科技論壇
  • 亞太CIO論壇
  • CISO資安學院 金融/醫療/新竹場
  • CIO Insight 調查

影音

  • 影音