码迷,mamicode.com
首页 > 移动开发 > 详细

iOS interface guidelines (界面设计指南)<一>

时间:2016-06-10 23:10:13      阅读:240      评论:0      收藏:0      [点我收藏+]

标签:

一.      为iOS而设计

     1.iOS体现的主题:

         (1)Deference(顺从):UI的存在就是为了让顾客更加容易理解和进行交互,而不是要和顾客玩智力游戏

         (2)Clarity(清晰):在每个尺寸中都能清晰的显示文字,表达精确和图像清晰的图标,装饰物要合适且搭配自然,设计的功能要击中一点,表达明确

         (3)Depth(深度):生动的视觉和真实的感情能够让界面充满生气,也可以提高用户的兴趣和使用户更加容易理解

 

无论你是想要重新设计旧app的界面还是创造一个,你都需要考虑下面的工作:

        (1)借鉴过去用户程序的核心功能界面,确定它的相关性

        (2)使用iOS的主题通知设计的用户界面和用户体验,耐心的添加细节和装饰

        (3)确保设计你的用户界面,以适应各种设备和模式,让用户可以尽可能多的环境中尽可能多地享受你的应用程序。

    2.按照内容进行设计

        漂亮的用户界面和流体运动是iOS的经验强调,它核心的表达能够给予用户想要的内容

      这里有一个设计能够提高功能性,并符合客户的内容:

         (1)利用整个屏幕,例如天气的应用,利用合适的图片占满全屏来更加容易让顾客知道天气的情况

技术分享

         (2)考虑现实的视觉指标,要么使用斜面、阴影、渐变来突出UI的主题,要么就然UI作为内容的配角,就像地图那样,当现实路径的时候其他的元素都是配角

技术分享

         (3)让半透明的用户界面元素来覆盖它后面的内容,半透明的元素如控制中心提供上下文,帮助用户看到更多的内容是可用的,并且可以信号短暂。

技术分享

    3.表达清晰

         提供清晰是另一种方式,以确保在您的应用程序中的内容是最重要的。这里有一些方法可以使最重要的内容和功能清晰,易于交互

         (1)多使用空白的背景,白背景界面的重要内容和功能更显着,更容易理解。白背景还可以赋予一种平静和安宁的感觉,它可以使一个应用程序看起来更加专注和高效

技术分享

         (2)让颜色简化用户界面。如黄色能够更加突出主题

技术分享

      (3)确保通过使用系统字体的易读性,三藩(iOS系统字体)与动态类型自动调整字母间距和行高使文本更容易阅读,无论是使用什么字体,都要使用自动类型,这样用户就可以根据自己的爱好进行调整

技术分享

      (4)使用无边框的按钮,在内容方面,无边框按钮使用背景,颜色,和行动的召唤标题表明互动。当它是有意义的,内容区域按钮可以显示一个薄的边界或有色背景,使其独特。

技术分享

    4.使用深度进行交流沟通

     (1)在一个设备,支持三维触摸,快速查看,弹出,快速行动,在不失去他们的背景下让用户获得重要的功能

技术分享

    (2)通过使用一个半透明的背景,并出现在主屏幕上浮动,文件夹将其内容从屏幕的其他部分中分离。

技术分享

   (4)提醒显示列表中的层,如图所示。当用户在一个列表中工作时,另一个列表是在屏幕底部收集起来的

技术分享

     (5)提高过滤的功能,层级分明,让用户更加容易找到想要的内容,如日历

技术分享

     二 . 解剖iOS app

     在大多数的app界面中都是使用uikit的框架进行设计的,所以掌握这个框架的组件就显得非常重要。

       

技术分享

       (1)导航条bar

       (2)内容视图,内容视图包含应用程序的具体内容,可以使行为,如滚动,插入,删除和重排的项目。

       (3)控制视图,控制执行动作或显示信息

       (4)临时视图,短暂的视图会给用户提供重要的信息或其他选择和功能。

        UIKit定义实现功能的对象,如手势识别、绘图、可达性、和打印支持。在应用程序中管理一组或层次的视图,通常使用视图控制器。这里的一个例子,视图和视图控制器是如何能将目前的iOS应用程序的UI。

      

技术分享

 

 

              

iOS interface guidelines (界面设计指南)<一>

标签:

原文地址:http://www.cnblogs.com/lelun/p/5573561.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!