https://developer.apple.com/design/human-interface-guidelines
清晰
整个系统中,任何字号的文字都必须清晰易读,图标表达含义准确易懂,修饰恰到好处,以功能驱动设计。留白、颜色、字体、图形和其他界面元素能够巧妙地突出重点内容并传达交互性。
1.使用留白:留白可以使重要的内容和功能更加醒目、更易理解。留白还可以传达一种平静和安宁的心理感受,它可以使一个应用看起来更加聚焦和高效。
2.让颜色简化UI:使用一个主题色——比如Notes中用了黄色——高亮了重要区块的信息并巧妙地用样式暗示可交互性。同时,也让应用有了一致的视觉主题。内置的应用使用了同系列的系统颜色,这样一来,无论在深色或浅色背景上看起来都很干净,纯粹。
3.通过使用系统字体确保易读性:iOS的系统字体(pingfang)使用动态类型自动调整字间距和行间距,使文本在任何尺寸大小下都清晰易读。无论你是使用系统字体还是自定义字体,一定要采用动态类型,这样一来当用户选择不同字体尺寸时,你的应用才可以及时做出响应。
4.使用无边框的按钮:默认情况下,所有的栏(bar)上的按钮都是无边框的。在内容区域,通过文案、颜色以及操作指引标题来表明该无边框按钮的可交互性。当它被激活时,按钮可以显示较窄的边框或浅色背景作为操作响应。
顺应
流畅的动效和清晰美观的界面有助于用户理解内容并与之交互, 且不会干扰用户。当内容占据整屏时,半透明和模糊处理通常会暗示 他更多的内容。减少使用边框、渐变和阴影,使界面尽可能轻量化, 从而突显内容。
纵深
清晰的视觉层和生动的动效赋予界面层次感,使其富有活力并有助于理解。使可触发界面元素更容易被找到能提升体验的愉悦感, 让用户在触发相应功能或者获取更多内容时不至于茫然无措。当用户 浏览内容时,流畅的过渡能够提供纵深感。
iOS的延展原则有以下6条:
1.整体美感
2.一致性
3.直接操纵
4.反馈
5.隐喻
6.用户控制
1.整体美感
整体美感体现在一款 App 的视觉外观、交互行为与其功能结合的优异程度。例如,一款协助用户完成重要任务的 App 应该使用不易察觉且不会造成干 扰的图形、标准化控件和可预知的交互行为,从而使用户聚焦在任务本身。反之,一款沉浸式体验的 App(如游戏),需要提供一个有吸引力的界面, 在鼓励用户探索的同时为用户带来无穷的乐趣和激动。
2.一致性
一致的应⽤程序通过使用系统提供的界⾯元素,众所周知的图标,标准文本样式和统一术语来实现熟悉的标准和范例。该应⽤程序以⼈期望的方式结合了功能和行为。
3.直接操纵
屏幕内容的直接操作吸引⼈并促进理解。用户在旋转设备或使⽤用⼿手势影响屏幕内容时会遇到直接操作。通过直接操纵,他们可以看到他们行动的直接,明显的结果。
4.反馈
反馈能够响应交互操作,呈现结果,便于用户了解情况。系统自带的 iOS 的App 对用户的每个操作都提供了明确的反馈。
· 交互元素在点击时会被高亮显示
· 进度指示器显示了需要长时间运行的操作进度
· 动效和声音使用户能够更清晰地感知交互行为的结果
5.隐喻
当一个 App 的虚拟对象和行为与用户所熟悉的体验相似时——无论这种体 验来源于现实生活亦或是数字世界,用户就能够更快速地学会使用这款App。隐喻在 iOS 中能够起作用是因为用户与屏幕在进行物理上的交互。
· 可以通过移动分层视图来显示被遮挡的内容
· 可以拖拽并滑动对象
· 可以切换开关,移动滑块,滚动数值选择器
· 可以通过轻扫来翻阅书籍和杂志
6.用户控制
在 iOS 中,用户是决策者,而不是App。App可以对用户行为提出建议,对 可能造成严重后果的行为发出警告,但不应该直接替用户做决策。优秀的 App在用户主导和避免不想要的结果之间找到平衡。为了让用户拥有掌控性, App可以使用用户熟悉且可预知的交互元素,让用户二次确认破坏性的行为, 并且保证可以停止正在执行中的操作。