陈子木 iOS7 的用户界面设计比以往更卓越,并为用户提供了更具吸引力的独特体验,带来更大的机遇。在正式写代码之前,认真考虑UI设计是否符合这十条设计准则,可以提高App的可用性与吸引力。如果要更深入了解iOS7的设计,你可以阅读苹果官方的iOS人机界面指南(英文版),或者下载知乎用户翻译的中文版iOS7人机界面设计指南

iOS7的10大设计准则涵盖了UI设计的交互性、界面信息可读性、图形设计规范以及信息的组织性等四个方面。读下去,看看你设计的UI都做到了么?

1、格式化内容

interactivity-formatting-content
dos

创建屏幕布局的时候,应该适适配iOS设备屏幕。用户应该一次看清主要内容,而无需缩放或水平滚动。
点此查看更多

2、触摸控制

interactivity-touch-controls
dos9

尽量采用专门为触摸和手势设计的界面元素,这样可以使应用程序的交互更加轻松自然。
点此查看更多

3、命中目标

interactivity-hit-areas
dos4

设计可触控的控件的时候,尺寸不得小于44x44px,只有这样才能确保触摸的精度和命中率。
点此查看更多

4、字体尺寸

readability-text-size
dos1

文本中的文字尺寸不得小于11点,这样才能确保在常规距离下,无需缩放就可以清晰地阅读。
点此查看更多

5、对比度控制

readability-contrast
dos2

尽量确保文字色彩对比更明显,并且调整文字与背景的对比提高可读性。
点此查看更多

6、间距调整

readability-spacing
dos3

不要让文字出现重叠的状况。适当地增加行高和行间距,提高文字的易读性。
点此查看更多

7、高分辨率

imagery-high-resolution
dos6

为所有图片资源提供高分辨率的版本(@2x)。那些未曾@2x的图像在Retina屏幕上会出现模糊的状况。
点此查看更多

8、防止拉伸

imagery-distortion
dos5

始终控制好图片的高宽比,可以缩放,但是一定要避免拉伸,这样可以避免失真。
点此查看更多

9、信息架构

clarity-organization
dos7

创建易于阅读易于调整的布局,确保界面内容的可调整性。
点此查看更多

10、保持对齐

clarity-alignment
dos8

让文本、图片、按钮在界面上保持对齐,相似相关内容合理靠近,让用户更容易理解界面信息。
点此查看更多

原文地址:Apple UI Design
优设网翻译:@陈子木



=========================关于学ui网=========================

xueui.cn 学ui网发布高质量ui设计教程和设计分享经验,希望打造一个最好的ui学习教程平台!

APP截图站:app.xueui.cn  海量APP截图,让你灵感爆发!

qrcode_for_gh_672cf3f94568_25841131QQQUN

转载请注明:学UI网 » IOS7 UI设计的十大准则

登录收藏
 
你可能喜欢的:
如何设计好一款APP的首页?如何设计好一款APP的首页?
B端品牌如何面向C端用户B端品牌如何面向C端用户
如何搭建一个易学性高可用性强的功能框架?如何搭建一个易学性高可用性强的功能框架?
盘点 | 4个成为标杆的超强体验设计盘点 | 4个成为标杆的超强体验设计
设计驱动案例-如何优化金融产品购买体验?设计驱动案例-如何优化金融产品购买体验?
Material Design Gestures 手势Material Design Gestures 手势
设计沉思录丨如何利用场景化设计提升用户决策效率设计沉思录丨如何利用场景化设计提升用户决策效率
用灰色文本字段来拯救你的注册表单设计用灰色文本字段来拯救你的注册表单设计
1套流程,带你看遍1000万个产品设计的从0到11套流程,带你看遍1000万个产品设计的从0到1
聊聊加载等待的那些事之“进度指示器“(落地篇)聊聊加载等待的那些事之“进度指示器“(落地篇)