苹果sf字体_苹果 iOS 13 黑暗模式设计指南

苹果在 WWDC 大会上发布了黑暗模式，从 macOS Mojave 到 Google I/O 开发者大会来看，iOS 加入黑暗模式已经是一件可预期的事情了。

那么对于设计师来说，我们在设计黑暗模式的时候需要注意哪些问题呢？以下是我针对苹果 Human Interface Guidelines 和最新给出的 iOS 13 beta 源文件，总结的几个的重点。

主色

从苹果人机交互设计指南和官方给出的 iOS 13 beta 源文件来看，iOS 13 提供两种版本的色调，主色在黑暗模式下，会比浅色模式“更亮”，以此来增加文字与深色背景的对比度。

它可以自动适应一些系统设置的变化，比如增强对比度和降低透明度设置。

灰色

iOS 13 还引入了六种不同色阶的灰色。看参数显示，灰色是偏蓝的高级灰，并非像谷歌 MateriaDesign 那样，使用纯灰色 (#121212)来定义的。

背景色

黑暗模式中的 background color，包括较暗的背景颜色和较浅的前景色。可以看到的是，除了纯黑色外，其他三个颜色都是基于上面提到的灰色色阶来定义的。

文字色

使用系统提供的 label color 作为 label 。它有四种颜色的级别：初级，次级，三级和四级，并且会自动适应明和暗的外观。

SF Symbols

尽可能使用 SF Symbols

SF Symbols 提供了一组超过1,500个图标，你可以在App中使用这些图标。Apple设计的SF Symbols 可与旧金山字体无缝集成，因此可以确保 Symbols 与所有字重和大小的文本进行光学垂直对齐。

SF Symbols 里的图标有多种重量和尺寸可供选择。

SF Symbols 有九种重量，从Ultralight 到 Black - 每种重量对应于旧金山系统字体的字重。这种对应关系可以在 Symbol 和相邻文本之间实现精确的权重匹配。

SF Symbol 也有三种尺寸，包括：小型，中型和大型。比例是相对于旧金山系统字体的高度定义的。

设计资源下载

目前官方只出了Sketch版本的设计源文件，等Photoshop版本出来后再推送给大家。

SF Symbols

https://developer.apple.com/design/downloads/SF-Symbols.dmg

iOS 13 beta (28.2 MB)

https://developer.apple.com/design/downloads/iOS-13-Sketch.dmg

微信群

One more thing，还有个微信群，主要讨论交互、产品、设计相关内容。目前群已满100人，进不去的同学可以关注公众号，后台回复”入群“即可。

阿洋，网易资深设计师，不定期分享关于交互、产品、设计上的思考。

苹果sf字体_苹果 iOS 13 黑暗模式设计指南相关推荐

苹果sf字体_苹果UI设计的改变意味着什么？
WWDC虽然已经过去了一段时间,虽然没有什么硬件产品,但还是给我们带来了许多新的惊喜.但我们这篇文章不谈技术问题,只谈苹果的UI变化.因为这可能是近10年来苹果第二次颠覆性的升级,上次还是2013年的 ...
苹果sf字体_还在用 iPad 看剧吗？苹果全新发布的 iPadOS 不止能让你做图了！
注:本文由优设网独家撰写,未经优设网许可请勿转载.授权请添加编辑微信:「gg_and_xb」 WWDC19 可能是最近几年最令人激动的苹果开发者大会了. 重回高端专业领域的 Mac Pro 不仅仅是性 ...
苹果sf字体_原来苹果偷偷爱了这些字体
说到苹果大家都会先入为主的把这个科技品牌代入到设计领域,他的高科技设计感产品外观和简洁精英式界面设计都成为了众多对生活品质有高要求的设计师和精英们的心头爱.那么今天热爱平面设计的小编就来着重为大家科普 ...
js ios调用ios方法_通过iOS 13的模式演示调用生命周期方法
js ios调用ios方法 iOS 13 was legendary iOS 13传奇 iOS 13 brought many cool things; dark mode, sign in with ...
ios单应用模式_如何为iOS 13暗模式设置应用
ios单应用模式 Apple launched the much-awaited iOS 13 updates globally on September 19 across all iPhones ...
苹果工具条_苹果iOS 13.4 Beta 1来袭：网友直接吐槽0创新
文|明美无限当广大的果粉们一旦聊到苹果公司最新发布的iOS系统时,相信有持续关注明美无限的果粉们应该都明白,明美无限准会准时地给众多关注我的果粉们分享iPhone.iOS.苹果最新的那些事. 这不就 ...
苹果iOS 13暗黑模式概念图曝光将于iOS 13.1版本更新
iOS的暗黑模式一直是广大用户迫切关注的功能之一.此前在iOS 12发布之际,很多用户都非常期待苹果可以推出基于iOS的深色主题模式,网友们也将这种模式称为"暗黑模式".iOS 1 ...
余承东硬刚 iPhone11；苹果推送正式版 iOS 13；php-nsq 3.4.3 线上稳定版发布 | 极客头条...
快来收听极客头条音频版吧,智能播报由标贝科技提供技术支持. 「CSDN 极客头条」,是从 CSDN 网站延伸至官方微信公众号的特别栏目,专注于一天业界事报道.风里雨里,我们将每天为朋友们,播报最新鲜有 ...
余承东硬刚iPhone11；苹果推送正式版iOS 13；Facebook总部发生员工跳楼自杀事件 | EA周报...
EA周报 2019年9月20日每周星期五7分钟,元宝带你喝一杯IT人的浓缩咖啡,了解天下事.掌握IT核心技术. 热点大事件苹果推送正式版iOS 13,iOS 13.1发布日期提前至9月24日 9月 ...

苹果sf字体_苹果 iOS 13 黑暗模式设计指南

苹果sf字体_苹果 iOS 13 黑暗模式设计指南相关推荐

最新文章

热门文章