UI&UX设计 · 多端类型矩阵

多端学习对照表

按平台维度对比核心输入设备、屏幕特点、核心交互特征与代表平台。

序号	端 (Platform)	核心输入设备	屏幕特点	核心交互特征 (Component Focus)	代表平台	常用设计规范推荐	常用组件介绍
1	移动端Mobile	手指	小竖屏	底部导航、触控面积大、手势滑动	iOS Android 小程序	Material Design 微信小程序 iOS HIG TDesign 小程序版 TDesign 移动版 Vant Weapp NutUI Taro	iOS HIG Material Design 通用手机端常用组件小程序常用组件
2	平板端Tablet	手指 / 触控笔	中大竖屏 / 横屏	分栏布局、多指手势、拖拽、内容创作	iPadOS Android 平板鸿蒙平板	iPadOS HIG Material Design HarmonyOS 设计	iPadOS HIG Material Design 通用平板端常用组件 HarmonyOS 设计
3	Web端Web	鼠标 + 键盘	大横屏	Hover 悬停、下拉菜单、多列布局	Chrome Safari Edge Firefox	Ant Design ArcoDesign Element+ TDesign	Ant Design ArcoDesign Element+ TDesign 通用Web端常用组件
4	桌面端Desktop	鼠标 + 快捷键	窗口化	右键菜单、工具栏、数据表格	Windows macOS Linux	Fluent 2 macOS HIG Ant Design	Fluent 2 macOS HIG Ant Design 通用桌面端常用组件
5	电视端TV	遥控器	极大远屏	焦点态、大卡片、方向键导航	Android TV tvOS webOS	Android TV 设计 tvOS HIG	Android TV 设计 tvOS HIG 通用电视端常用组件
6	手表端Watch	手指 + 表冠	极小方 / 圆屏	卡片流、极简、语音输入	watchOS Wear OS 鸿蒙手表	watchOS HIG Wear OS 设计鸿蒙穿戴	watchOS HIG Wear OS 设计鸿蒙穿戴通用手表端常用组件
7	车载端HMI	物理按键 / 语音	横向大屏	超大热区、盲操、层级极浅	Android Automotive QNX 鸿蒙车机	CarPlay HIG Android Auto 设计鸿蒙车机	CarPlay HIG Android Auto 设计鸿蒙车机通用车载端常用组件
8	XR空间端XR Spatial	眼睛 + 手势	无限空间	空间悬浮面板、3D、无边界	visionOS Quest OS PICO OS	visionOS HIG Meta Horizon 设计	visionOS HIG Meta Horizon 设计通用XR空间端常用组件
9	自助终端 / 工业屏幕端Kiosk / POS	手指 / 触控 / 扫码	固定中屏	大按钮、防误触、常驻界面	Android Windows 嵌入式系统	Material Design ArcoDesign Ant Design	Material Design ArcoDesign Ant Design 通用自助终端常用组件