TV瀑布流列表组件详解
10英尺UI(10-foot UI)是专门为客厅环境设计的用户界面范式。其名称来源于用户与电视屏幕之间约10英尺(约3米)的典型观看距离。在这个距离下,屏幕上的界面元素需要足够大才能被清晰辨识,交互操作需要足够简单才能通过遥控器高效完成。本文将详细阐述10英尺UI的核心设计参数与实施标准。
视距与字号关系
根据人眼视觉分辨率的物理限制,在3米观看距离下,电视屏幕上的最小可辨识文字高度约为屏幕高度的1/30。对于55英寸1080p电视,这意味着最小字号不应低于24px;对于75英寸4K电视,最小字号不应低于28px。标题文字建议使用40px至60px,确保在远距离下具有足够的视觉冲击力。行间距安利1.5至1.8倍,段落间距不低于字号的1.5倍。
可交互区域尺寸
TV端的最小可交互区域(焦点目标)建议不小于120x80像素(@1080p分辨率)。这个尺寸确保焦点在放大10%至15%后仍然不会与相邻元素重叠,同时在远距离观看时具有足够的辨识度。对于主要操作按钮,建议尺寸不小于200x60像素,配合明确的文字标签与图标辅助。
安全边距设定
考虑到电视的过扫描(Overscan)问题与屏幕边缘的视觉衰减效应,所有内容应距离屏幕边缘保持至少5%的安全边距。在1920x1080分辨率下,这意味着左右各留出96像素、上下各留出54像素的安全区域。关键交互元素建议进一步内缩至8%的安全边距内。