vdi-cloud/ui/terminal/references/README.md

VDI 终端界面参考与设计依据

核对日期：2026-11-09。以下截图从官方文档的图片链接取得，作为研究材料保存在本目录，不放入产品界面。原始截图中的第三方品牌、组织和账号不用于越欣科技终端。

1. Microsoft Windows App：桌面资源选择

• 官方说明：https://learn.microsoft.com/en-us/windows-app/get-started-connect-devices-desktops-apps
• Windows 客户端截图：https://learn.microsoft.com/en-us/windows-app/media/get-started-connect-devices-desktops-apps/windows-devices.png
• Web 客户端截图：https://learn.microsoft.com/en-us/windows-app/media/get-started-connect-devices-desktops-apps/web-devices.png
• 本地材料：Windows 客户端、Web 客户端。

实际界面包含：设备页、桌面名称、服务类型、配置或组织、可连接状态、连接按钮，以及资源搜索和收藏入口。

采用：以桌面名称为主标题，状态靠近名称；每张桌面有独立连接入口；支持搜索和收藏。

调整：不采用截图的壁纸和文字叠层。越欣终端使用纯色卡片，让系统标识、名称、状态、配置、操作从上到下排列，消除深浅背景交叉造成的对比问题。三张桌面直接展示，不引入复杂导航或多工作区概念。

2. Amazon WorkSpaces：资源管理、设置与会话诊断

• 官方用户手册：https://docs.aws.amazon.com/workspaces/latest/userguide/amazon-workspaces-windows-client.html
• 资源列表截图：https://docs.aws.amazon.com/images/workspaces/latest/userguide/images/wsp-windows-newclient-workspace-list.png
• 显示设置截图：https://docs.aws.amazon.com/images/workspaces/latest/userguide/images/wsp-windows-newclient-display-fullscreen.png
• 会话诊断截图：https://docs.aws.amazon.com/images/workspaces/latest/userguide/images/wsp-windows-newclient-session-health-panel1.png
• 本地材料：资源列表、显示设置、会话诊断。

版本说明：官方手册将该组新客户端界面标为 Public Preview；它是成熟 WorkSpaces 产品中的新界面参考，不表述为已全面发布版本。

实际界面包含：收藏、资源名称与操作分离；设置按连接、显示、外观等类别组织；会话健康度以明确的网络状态和指标呈现。

采用：收藏与连接互不混用；设置入口固定；配置字段有名称与说明；连接中、取消、错误恢复有明确路径。

调整：当前 UI 原型不接入设备遥测或 WorkSpaces 服务，不显示捏造的延迟、带宽或实时健康度。网络状态只作示例，并在页脚标明。复杂诊断图表不塞入三台桌面的选择页。

3. Omnissa Horizon：按资源设置与连接流程

• 官方指南：https://docs.omnissa.com/HorizonClient-WindowsGuide-V2609/ConnecttoaRemoteDesktoporPublishedApplicationfromHorizonWindowsClient

已核对官方流程文字：登录后进入桌面与应用选择器；可在桌面资源上打开 Settings 调整显示；连接以具体资源为单位。本文仅作为操作流程依据，没有将其称为已取得的界面截图。

采用：每台桌面独立“设置”和“连接”；返回列表不退出账号；未配置地址时解释原因并保留设置入口。

4. 与本仓库代码的对应

• terminal/kiosk-shell/src/desktop_list_page.cpp：每张卡片都有“设置”，可用桌面有“连接”，忙碌时禁止重复操作。
• terminal/kiosk-shell/src/desktop_settings_dialog.cpp：服务器地址、应用名、分辨率、帧率；地址留空表示未分配，桌面不可连接。
• 原型的配置字段与上述真实代码对应；不增加没有来源的 CPU、内存、显卡容量或实时质量指标。

5. 保留的视觉系统与可读性规则

• 登录界面的 Logo、互动图形和深浅色视觉沿用原稿。后续按要求补充表单校验、登录状态、企业连接、SSO 和离线体验；相关浏览器验证见 ../output/playwright/login-verification.json。
• 登录后沿用深蓝灰背景、铜橙色强调、圆角卡片与低对比边框；去掉整块浅蓝、浅绿色带。
• 系统识别只占卡片左上角：Windows 窗格图形、Ubuntu 官方形态图形、麒麟软件官方品牌图片，加明确的系统名称。色彩局部使用，连接按钮统一铜橙。
• Ubuntu 图形来自 Simple Icons 的 Ubuntu 资源：https://raw.githubusercontent.com/simple-icons/simple-icons/develop/icons/ubuntu.svg 。
• 麒麟软件图片直接来自官网：https://www.kylinos.cn/upload/1/appLogo/20250820/1957999505938382848.png 。该图是麒麟软件公司标识，不冒充单独的银河麒麟产品 Logo。
• 主要桌面名称 22–24 px；正文和操作 14–16 px；辅助规格和设备状态 13 px。小字号正文按 WCAG AA 4.5:1 校验；大字号至少 3:1。
• 常用操作至少 44 px 高，有文字标签；收藏按钮同时提供名称与选中状态；不可连接状态同时提供原因。
• 深色、浅色、1280×720 / 1366×768 / 1920×1080 都独立渲染；不将“语法检查通过”等同于视觉验收。

6. 交付边界

这是 ui/terminal 下的 HTML 交互设计原型；连接配置保存在当前浏览器的本地存储供评审使用。真实终端认证、Moonlight 会话、设备遥测和 Qt 落地仍由 kiosk-shell 接入。原型不伪装远程连接成功，连接状态在预览等待后进入说明页，并提供检查设置的恢复路径。