iT邦幫忙

2025 iThome 鐵人賽

DAY 13
0
DevOps

初探 LLM 可觀測性:打造可持續擴展的 AI 系統系列 第 13

【Day 13】不再需要 Dashboard?LLM 驅動的可觀測性介面

  • 分享至 

  • xImage
  •  

https://ithelp.ithome.com.tw/upload/images/20250927/20149562AfgU60jQyZ.jpg

概述

在可觀測性的世界裡,資料可視化與使用者介面,始終是我們從龐大數據中提煉洞見的最後一哩路。這正是為什麼像 Grafana 這樣的可視化平台,即便歷經多次技術迭代,至今依然是業界不可或缺的工具之一。Grafana 不僅支援上百種資料來源,更能透過豐富的圖表組件,讓資料的價值直觀呈現,最終服務於決策與行動。

進入 LLM ****主導的新時代,使用者介面似乎又將迎來一次顛覆性的變革。畢竟,介面始終是產品與使用者互動的第一線戰場,是資訊與行為的交會點。今天,就讓我們一起來探索:在 LLM 崛起的浪潮下,使用者介面正經歷哪些演進?又將如何重新定義我們與資訊互動的方式?

可視化 UI 的十字路口

https://ithelp.ithome.com.tw/upload/images/20250927/20149562B1rSRHavjC.png
https://x.com/felixhhaas/status/1928489808797511832?fbclid=IwZXh0bgNhZW0CMTAAYnJpZBExWUJHNHRrZkIxZExGU29QVwEeaPZArQdLbxreRKy6fQBLRG_zv8iURGWJUPYQvNmJXg1DaGFVaB0kcDVyZw0_aem_KkWTp_AOydLVYM7ZllEWiw

We’re moving from apps with 10 screens to apps with one.
From cluttered interfaces to minimal triggers.
The smarter the system, the less UI you need.
Eventually, the best UI might be no UI at all.

And the sooner you prepare for that, the better.

我們正在從具有 10 個螢幕的應用程式轉向具有 1 個螢幕的應用程式。
從雜亂的介面到最簡化的觸發機制。系統越智能,您需要的 UI 就越少。
最終,最好的 UI 可能根本沒有 UI。你越早為此做好準備越好。

根據生程式 UI 新創 Lovable 的觀點,未來的使用者介面將更加聚焦於「人類意圖」與「人機互動」的本質。過去,由於電腦難以理解人類的真實需求,我們只能設計出窮舉式的介面「列出所有可能的操作選項」,讓使用者透過學習與探索來達成目標。然而隨著 LLM 的崛起,這種限制正在被根本性地打破。現在的系統開始具備理解偏好、預測行為、甚至主動提出建議的能力,最終,使用者可能只需要做一件事:按下送出鍵。

以 Grafana 為例,它是現代基礎設施中最常見的「駕駛艙」介面,設計目標是整合所有關鍵的指標、日誌與追蹤資料,讓維運人員可以「一目了然」。但隨著系統規模的爆炸性成長,這些駕駛艙也日漸演化成類似 波音 747 儀表板 的複雜介面:面板密密麻麻、旋鈕與開關數不勝數,資訊不僅不清晰,反而帶來巨大的認知負擔與資訊焦慮。

這樣的落差源自於一個根本矛盾:儀表板是在「設計階段」試圖窮舉所有可能關注的資訊,而使用者的真正需求,卻往往在「執行階段」才浮現,並且高度依賴當下的角色、情境與意圖(Intent)。

我們正站在一個人機互動的重大轉捩點上。知名創投 a16z 就在其趨勢報告中,準確地將這個典範轉移總結為:Dashboards → Synthesis(儀表板 → 合成)。

這不僅是一場技術升級,更是一種理念革新:從被動地呈現資訊,走向主動地合成洞見。

GenAI 在 UI 中的設計模式

https://ithelp.ithome.com.tw/upload/images/20250927/20149562dUPgChNSwi.png
UX Collective 中對 AI 介面設計的七種典型模式。雖然原文涵蓋的模式完整而廣泛,但我們將重點挑選其中幾種最具代表性的形式,進行分類與說明,幫助理解 LLM 驅動 UI 的多樣化設計可能性。

作為「輔助者」(The Assistant)

https://ithelp.ithome.com.tw/upload/images/20250927/20149562KZKb1uP29u.png
https://uxdesign.cc/where-should-ai-sit-in-your-ui-1710a258390e

在這類設計中,AI 並不改變既有的 UI 架構,而是以增強工具的角色存在。它融入使用者操作流程中,提供上下文感知的協助與建議,提升操作效率但不干擾使用者原本的操作邏輯。

  • 行內疊加提示(Inline Overlay Prompts)

    直接在元件旁顯示的提示與建議,依據上下文提供即時支援,常見於表單填寫、搜尋欄等場景。

  • 右側面板專家(Deep Context Expert in Right Panel)

    如 GitHub Copilot 一般,作為常駐的專家助手,能持續理解使用者上下文並提出智慧建議,提升使用者在複雜任務中的掌控感。

作為「對話者」(The Conversationalist)

https://ithelp.ithome.com.tw/upload/images/20250927/20149562aZwm8TTf0L.png
https://uxdesign.cc/where-should-ai-sit-in-your-ui-1710a258390e

這類模式以自然語言互動為核心,透過對話式介面讓使用者與 AI 直接交流,取代傳統表單與按鈕操作。

  • 浮動聊天機器人(Chatbot Widget as Assistant)

    常見於客服介面中,輕量級、非侵入式,適合處理 FAQ 或特定任務導引。

  • 全域對話助理(Center-Stage General-Purpose Assistant)

    如 Perplexity、ChatGPT 等產品,將對話介面放在核心位置,讓使用者的每一次操作都從一段語意互動開始。

作為「創造者」(The Creator)

https://ithelp.ithome.com.tw/upload/images/20250927/20149562HBiAfkunhc.png
https://uxdesign.cc/where-should-ai-sit-in-your-ui-1710a258390e

AI 不只是回應,而是主動創造內容。使用者僅需提供意圖或提示詞,系統便能從無到有生成視覺或文本輸出。

  • 空白畫布生成器(Blank Canvas Creator)

    如 Midjourney,使用者給定 prompt,AI 即可在畫布上生成高品質圖像或作品。這類設計解放了傳統工具的操作負擔。

這些設計模式並非互斥,而是構成 UI 設計師的工具箱。在真實產品中,往往會根據使用場景與角色需求混合使用。值得注意的是,UI 的演進史也正反映著這些模式從「輔助」走向「中心」的過程。AI 不再只是旁觀的工具,而逐漸成為使用者決策、創造與執行的主要引導者。

可觀測性 UI 演進三部曲

現在,讓我們運用上述的 AI 設計模式框架,來具體觀察 Grafana 這個深度整合生態系與使用體驗的指標性平台在三個不同的使用階段中,可能呈現出哪些典型的介面樣貌與互動方式。

傳統儀表板 —「人找資訊」的時代

https://ithelp.ithome.com.tw/upload/images/20250927/20149562GRQoL29BaQ.png

在這個階段,使用者介面的核心邏輯是資訊的「靜態陳列」。資訊以固定的圖表、指標和表格形式預先被設計好,使用者需要具備一定的系統知識與背景判斷力,才能從這些資料中自行整合出洞見。

這樣的 UI 模式雖然具備一致性與可預測性,但也帶來了巨大的認知負擔:使用者不但要知道該去哪個頁面找資料,還要能理解每個指標的意義與關聯性。當系統變得愈來愈複雜時,這樣的操作方式往往成為效率瓶頸,甚至造成資訊焦慮。

傳統的 Grafana 儀表板 正是此階段的代表,它的核心價值在於資訊整合與視覺呈現,但洞察的提煉仍仰賴使用者主動去尋找與理解。

過渡時期 —「AI 助理與 UI」的共存與融合

https://i.postimg.cc/XvSNnJGD/grafana-assistant-1757782707359.gif

隨著大型語言模型的出現,許多工具開始嘗試將 AI 融入既有的 UI 架構中。這個階段的核心設計特徵是:「不打破原本介面邏輯,但提供智慧入口」。AI 的角色類似於一位熟悉情境的助手,在不改變操作流程的情況下提供即時支援。

設計挑戰也從過去的資訊呈現,轉變為:「AI 應該坐在 UI 的哪個位置?」

這種模式完美詮釋了我實作的「Grafana Assistant」構想。AI 以常駐側邊欄的形式存在,能理解整個儀表板的上下文,並回應像是「過去一小時內哪個 API 的錯誤率最高?」這類的問題。它不只是回應,而是能操作主畫面、重新整理視覺層級的深度專家。

這個階段的價值在於:在不顛覆使用習慣的前提下,降低了操作門檻。AI 的出現讓介面不再只是靜態容器,而是可以理解意圖、主動協助使用者完成任務的輔助者。

有興趣觀可以觀看完整 Demo

未來合成式介面 —「資訊找人」的時代

https://i.postimg.cc/y8KKCdLZ/Adobe-Express-65e9b9dd95692faa9f5bb1c0-6889c789027d04cdca22d61f-Dashboard-Website-transcode-1.gif

這個階段標誌著人機互動邏輯的根本轉變:不再是我們去找資料,而是資料主動來找我們。AI 不只是 UI 的一部分,而是整個 UI 本身。對話介面不再是輔助角色,而是成為使用者與系統互動的主要方式。

這與 UX Collective 所定義的 「Center-stage general-purpose assistant」 完全對應。畫面上不再有固定的頁面與儀表板,取而代之的是一個能與使用者進行深度對話的輸入框。背後的 AI 根據語意理解與任務推理,動態生成所需的資訊結構。

以這個 WrenAI 這類新世代 GenBI 專案為例,使用者僅需提問:「今天的 API Gateway 系統運作狀況如何?」AI 便會自動整合各種監控來源:包括 Logs、Metrics、Error Tracking、Deployment History,並將結果彙整成一份 動態生成的 Markdown 報告,內容包含文字敘述、表格摘要與可互動圖表。

結論

在我打造 Grafana Assistant 時,我就深深地對這幾篇趨勢研究的論點共鳴,也開始思考介面的定位以及如何讓 LLM 了解上下文,並且回應人類意圖的 AI 助手如何實現,最終更要搭配體驗良好的介面才算大功告成。

從傳統的「資訊過載」時代,到 AI 輔助的「意圖驅動」介面,再邁向真正實現「動態合成」的智慧應用,我們正經歷一場人機互動邏輯的根本轉變。

對我個人而言,UI 已經不再是設計師的專屬領域,對於開發者與產品設計師而言,這意味著:

  • 我們不再僅設計「如何呈現資料」,而是要設計「AI 如何理解使用者」。
  • 工具鏈與設計語彙需要擴展,涵蓋 prompt 設計、意圖識別、上下文記憶、AI 回應邊界等新的介面設計維度。
  • 對話流、動態回饋與多模態互動將逐漸取代傳統的頁面跳轉與靜態元件組合。

最重要的是,我們必須將「AI 如何呈現」與「AI 能做什麼」視為同等重要的設計課題。功能再強大的模型,如果沒有良好的互動介面,也難以產生真實的價值與信任。

AI-Driven UI 的時代已經來臨,請抓穩了火箭準備起飛!


References:


上一篇
【Day 12】打造企業級 AI Agent:認識 Agent 框架與選用指南
系列文
初探 LLM 可觀測性:打造可持續擴展的 AI 系統13
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言