一些点
- AppStore市场引导 提供了一些和苹果相关的素材
- 系统提供的Icons 能用系统的就尽量不要自己去画
- 跟随系统字体设置的动态字体
- 颜色设计
腾讯翻译
APP设计文章
UI设计基础重要点
三大设计原则
- 遵从(Deference):UI应该有助于用户更好地理解内容并与之交互,并且不会分散用户对内容本身的注意力。
- 清晰(Clarity):各种尺寸的文字清晰易读;图标应该精确醒目,去除多余的修饰,突出重点,以功能驱动设计。
- 深度(Depth):视觉的层次感和生动的交互动画会赋予UI新的活力,有助于用户更好地理解并让用户在使用过程中感到愉悦。
让颜色简化UI
-
使用一个主题色——比如Notes中用了黄色——高亮了重要区块的信息并巧妙地用样式暗示可交互性。同时,也让应用有了一致的视觉主题。内置的应用使用了同系列的系统颜色,这样一来,无论在深色或浅色背景上看起来都很干净,纯粹。
Note样式
使用无边框的按钮
默认情况下,所有的栏(bar)上的按钮都是无边框的。在内容区域,通过文案、颜色以及操作指引标题来表明该无边框按钮的可交互性。当它被激活时,按钮可以显示较窄的边框或浅色背景作为操作响应

自定义Icon规范

iOSAPP的间距参考
单位用pt最好了,开发者不用换算









网友评论