四、颜色(Color)
颜色是增加活力、提供视觉的连续性、传达状态信息、反馈用户的行为并帮助用户将数据可视化的好方式。在挑选应用色调的颜色时,请参考系统的色彩方案,以保证这些颜色无论是单独还是组合、在浅色背景还是深色背景上都看起来很棒。
明智地使用颜色进行沟通。 谨慎少量使用颜色以唤起对重要信息的注意力。 例如,当出于非关键原因在应用程序中的其他地方使用红色时,警告人们出现严重问题的红色三角形会变得不那么有效。
在应用内使用互补的颜色。你的应用内的颜色应该和谐共处,不会互相冲突和干扰。如果你的应用风格的基础色调是柔和的,那么使用一系列与之协调的柔和色调。
一般来说,选择与你的应用logo相符的颜色数量有限的色板。巧妙地使用颜色是一个传达品牌的好办法。
考虑在应用中统一使用一种关键色来暗示交互性。在Note中,可交互的元素是黄色的。在Calendar中,可交互的元素是红色的。如果你定义了一种关键色用于传递可交互性,那么你要保证其它颜色不会与之冲突。
避免给可交互和不可交互的元素使用相同的颜色。如果可交互和不可交互的元素是同一种颜色,用户就很难知道到底哪里是可点击的。
考虑插图和半透明对颜色的影响。变换插图有时也要变换附近的颜色,以保持视觉的连续性,并防止界面元素变得过于强大或平庸。例如,地图在使用地图模式时显示亮色,但当启用卫星模式时会切换到暗色调模式。颜色在半透明元素之下和之上(比如工具栏)都会看起来很不一样。
在多种光线条件下测试你的应用颜色方案。光线会在室内和室外、房间氛围、不同的时间、气候等条件下明显地变化。你的应用在现实世界中使用时看到的颜色不会一直和你在电脑上看到的颜色相同。你应该在不同的光线条件下预览你的应用来观察颜色的真实表现,比如在晴朗的户外。必要时,应当调整颜色以求在大多数的使用场景下提供最好的视觉体验。
考虑True Tone显示屏对颜色的影响。True Tone显示屏利用了环境光传感器来自动调整显示屏的白点,以适应当前环境下的光线情况。专注于阅读、照片、视频和游戏的应用可以通过确定一种白点纠正模式来强化或弱化True Tone 的效果。开发指导请查阅 Information Property List Key Reference。
注意色盲。例如,很多色盲用户很难分辨红色和绿色(以及任何颜色和灰色),或是蓝色和橘色。避免把这些颜色组合作为区分两种状态或值的唯一方式。例如,用红色方块和绿色圆形来表示下线和上线状态,而不是用红色圆形和绿色圆形。有些图形编辑软件含有能够帮助你证明你是否是色盲的工具。
考虑你在其他国家和文化中如何使用颜色。例如,在某些文化里,红色用来表示危险;但在另一些文化里,红色又有着积极的含义。请确保在你的应用中的颜色传达了恰当的讯息。
使用足够的颜色对比度。在应用中,过低的对比度会让内容难以阅读。比如,图标和文本可能会和背景相融合。在线的颜色对比度计算器能够帮助你精确的分析应用中的颜色对比度,以确保它符合最佳标准。请确保你的应用对比度至少达到4.5:1,但是7:1更好,因为它符合更加严格的辅助功能标准。
色彩管理
将颜色配置应用到你的图像中。iOS默认颜色空间为标准RGB(sRGB)。为了确保应用的颜色与此颜色空间匹配正确,请确保图像包含嵌入的颜色配置文件。
使用 P3 色彩空间增强广色域屏幕体验。iOS 设备的广色域屏幕支持 P3 色彩空间,颜色比 sRGB 更丰富,更饱满。因此使用 P3 色彩空间的照片和视频更加逼真,视觉数据和状态指示更具冲击力。适当时,使用 P3 颜色配置文件(每通道16位),并以 .png 格式导出图像。请注意,需要支持 P3 颜色配置文件的显示器才能设计相匹配的颜色。
当体验需要时提供颜色空间特定的图像和颜色变化。一般来说,P3 颜色空间和图片倾向于在 sRGB 设备中使用。然而,有时很难区分sRGB 设备中两个非常相似颜色的差异, P3 颜色的渐变效果也有时会在 sRGB 上会出现色带。为了避免这些问题,可以在 Xcode 的资源目录中提供不同色彩标准的图像,确保 sRGB 和 P3 屏幕上色彩还原度。
在 sRGB 和 P3 屏幕上都预览颜色。根据需要进行调整,以确保在两种类型的屏幕上有同样很好的视觉效果。
提示:在P3屏幕的Mac上,您可以使用系统颜色选择器来选择和预览P3颜色,并将其与sRGB颜色进行比较。
五、术语(Terminology)
应用中的每个用词都是与用户进行交流的一部分,让用户在使用应用中感到舒适。
用词应熟悉且好理解。专业技术术语可能会吓到用户。要避免使用用户可能不了解的技术术语和相关缩写。如果了解受众,可以衡量某些词语或是否得当。一般来说,受人喜爱的应用会避开高度技术性用语,它们只适用于先进或技术人群。
确保界面文字清晰简洁。用户能快速、轻松地理解简短文本,而且不喜欢被迫阅读长段落来完成任务。简明扼要地表达最重要的信息,并突出显现,以便用户不必阅读太多,就能找到他们需要的内容,或弄清楚下一步该怎样做。
恰当确定交互元素。用户应能一目了然地了解某个元素的作用,必要时应配上说明文字,建议使用动词,如连接、发送、添加。
避免歧义。避免使用我们、我们的、我、我的(例如“我们的教程”和“我的锻炼”)。用户有时会理解为一种侮辱或高人一等的态度。
善用友好语调。使用一种非正式且平易近人的语调,类似于在午餐时与他人交谈的方式。可以适时用谦卑的语调,如使用 “您” 作为尊称。
谨慎幽默。请记住,用户很可能会在界面中阅读文本内容,使用幽默的句式最初看起来可能很讨喜,但随着时间的推移用户会对这种这法变得恼怒。还要记住,一种文化中的幽默不一定在其他文化中被理解。
使用与设备一致的描述。始终确保内容能够指导用户。例如,当用户使用 iPad 时,不会显示 iPhone 的图像。用词也要和平台一致,点击、清扫、滑动、挤压和拖放触摸屏内容,按住 Home 键,使用 3D Touch ,旋转并摇动设备。
准确的参考日期。使用“今天”和“明天”这种友好的描述是合适的,但要是不考虑语境,这些术语可能会令用户困惑甚至误解。假设一个在午夜之前开始的事件,在一个时区可能从今天开始,在另一个时区可能在昨天就已开始。一般来说,日期是以用户所在时区确定的。但用户所在时区也会变化,例如在航班类应用中,明确显示飞行起始日期和时区会更为明确。
六、字体排印(Typography)
旧金山(SF)是iOS中的系统字体。这个字体类型已优化来使不匹配文本易读、清晰和一致。从 here下载旧金山字体系列。
强调重要信息。通过利用字体的粗细、大小和颜色来突出你应用程序中最重要的信息。
尽可能使用单一字体。混合几种不同的字体可能使你的应用程序显得支离破碎和草率。考虑使用单一字体,并使用此字体的一些变体和大小。
尽可能使用内置的文本样式。内置的文本样式让您以直观的方式表达内容,同时保持最佳的可读性。这些样式基于系统字体,并允许您利用关键的排版特性,例如动态类型,它会自动调整跟踪并引导每个字体大小。iOS包括以下文字类型:.
开发指导请参阅 UIFontTextStyle。
确保自定义字体是易读的。iOS支持自定义字体,但通常很难阅读。除非你的应用程序对自定义字体有强烈的需求,比如为了品牌目的,或者为了创建一个沉浸式的游戏体验,否则最好还是坚持使用系统字体。如果您使用自定义字体,请确保它易于阅读(即使是小尺寸)。
实现自定义字体的可访问特性。系统字体会自动对可访问性特性做出反应,比如粗体文本和较大样式。使用自定义字体的应用程序应该通过检查是否启用了可访问性特性并在更改时注册通知来实现相同的行为。请参阅 Accessibility。
动态类型大小
旧金山字体设计得在大字体和小字体上都易读。动态类型让读者选择他们喜欢的文本大小,这样提供了更多的灵活性。可以在 Resources 中下载动态类型大小表。
在响应文本大小的变化时优先考虑内容。并非所有内容都同样重要。当有人选择更大的尺寸时,他们想要使他们关心的内容更容易阅读;他们并不总是希望屏幕上的每一个字都更大。
更大的可访问性类型
除了标准的动态类型大小之外,该系统还为具有可访问性需求的用户提供了一些更大的字体类型。
字体的使用和跟踪
在接口模型中使用正确的字体变体。当你在标准控件(如按钮和标签)中使用旧金山的文本时,iOS会根据点大小和用户的可访问性设置自动应用最适当的变体。在接口模型中,使用SF Pro Text则文本大小为19点或更小,使用SF Pro Display则文本大小为20点或更大,并适当调整字母间距。