界面设计基础

两平台的差异体现在六个层面。一是导航逻辑，iOS 倚重左上角返回与边缘右滑返回手势，全局返回入口在屏幕左上；安卓早期用系统返回键现在是预测性返回手势，且 Material 提倡底部导航或抽屉。二是系统组件，iOS 用 SF Symbols 图标体系与原生表单控件，安卓用 Material 组件如悬浮按钮、 Snackbar 提示条，直接混用会造成水土不服。三是字体与排版，iOS 默认苹方加 SF 字体，安卓 Roboto 加思源黑，字阶规范各自定义。四是交互细节，iOS 列表滑动操作在行内，安卓更多在长按菜单；iOS 分段控件与安卓 Tabs 的形态与用法不同。五是权限与系统 UI，状态栏沉浸、剪切板提示等行为各不相同，需按各自规范适配。六是视觉风格，历史上 iOS 偏大标题与卡片化，Material 用海拔与涟漪反馈表达层级。实践中常以一套主设计适配两平台差异，或按平台分别出稿。

列表页是信息密集型界面的主战场，要素包括：列表项的构成（标题、摘要、缩略图、状态标签、操作），行高与信息密度的平衡，分隔方式（通栏分割线、留白、卡片），单选多选与批量操作，以及空状态与加载态。长列表体验处理手段有七条：一是分页或无限滚动，无限滚动要配回到顶部按钮与位置记忆；二是滚动性能，图片懒加载与占位骨架屏，避免卡顿掉帧；三是吸顶分组索引，通讯录式字母条或日期吸顶帮助定位；四是搜索与筛选常驻，长列表必须给直达手段，筛选器记住用户偏好；五是信息分层，行内只放决策必需字段，详情进二级页；六是加载节奏，首屏快速可见优先，首屏内容不足再补；七是边界状态，无结果给引导与清空筛选入口，加载失败给重试。评价列表设计好坏的指标是定位效率，用户多快找到目标条目。这是 UI 基础面试的高频实操题。

三种临时容器各有适用场景，选择依据是内容量、打断强度与操作连续性。居中弹窗打断性最强，强行聚焦，适合必须处理的短决策，如确认删除、协议授权、简短表单；内容应控制在九宫格内，给出明确的确认与取消，滥用弹窗是体验灾难。侧边抽屉在桌面端从右侧滑出，不打断主内容上下文，适合辅助信息与次级表单，例如订单详情、编辑面板，主列表仍可见可对照，宽度可自适应内容。底部面板（Bottom Sheet）是移动端友好容器，拇指易达，适合内容较多或需要滑动浏览的场景，如筛选器、分享列表、地图地点详情，支持半开与全开两档更灵活。打断强度排序大致是弹窗大于底部面板大于抽屉。通用原则：能不打断就不打断，内容超过一屏慎用弹窗，涉及原上下文的操作用抽屉或面板，强制决策才用弹窗。各平台规范对这三种容器都有具体定义，落地时对齐平台习惯。

按钮是最基础的交互组件，细节决定专业度。一是尺寸与热区，可点击区域不小于四十四乘四十四点或四十八密度无关像素，视觉尺寸可以小但热区要足，相邻按钮间距防误触。二是状态完整性，默认、按压、加载中、禁用、成功失败态都要设计，加载中要有 spinner 且防重复提交，禁用要说明原因而不是灰掉了事。三是主次层级，一屏一个主按钮，主按钮用品牌填充色，次按钮描边或文字钮，破坏性操作用危险色并二次确认。四是文案，按钮写动词与结果如立即支付而不是确认，避免模糊的确定按钮承载重大操作。五是位置，移动端主操作放拇指易达的底部或右下，表单跟随键盘流动；桌面端主按钮在对话框右下且顺序遵循平台惯例。六是全宽按钮注意圆角与安全区，适配刘海与手势条。面试中能把按钮拆出这些维度讲，基本功就立住了。

空状态是页面无内容或无结果时呈现的界面，常见于首次使用、无数据、搜索无结果、筛选无匹配、离线与加载失败六种场景。它不是异常而是宝贵的教育与转化时机。好的空状态包含四个要素：一是清晰的状态说明，用一句人话解释为什么是空的，例如这里还没有你的订单；二是引导下一步行动，主按钮指明出路如去逛逛、创建第一个项目，让空页面有出口；三是情绪化插图或轻量图形，缓和挫败感并传递品牌温度，但插画不喧宾夺主；四是针对性区分场景，搜索无结果要给换关键词建议与清空筛选，首次使用给示例数据或新手引导，错误态给重试。反面案例是只丢一句暂无数据让用户死路一条。数据上空状态优化直接影响新用户激活与搜索满意度。这是考察 UI 设计师同理心的小切口的经典题，回答时按场景分类比背定义更能加分。