论文部分内容阅读
摘要：在科技发达的现代生活里，移动终端设备无时无刻都围绕在我们身边，便携的智能手机、平板电脑等改变着我们的生活。在使用过程中，实现人与设备连接的桥梁就是交互行为或者说交互设计，而导航则是交互中的重头戏，是受众在移动终端设备中获取所需的通道。在不同类型的应用程序中，都有不同的符合其内容的导航模式。比如说：阅读类应用多采用隐藏导航，搜索类应用或浏览类客户端多采用标签页模式的导航，每种导航都有其独特的魅力和价值，它是根据其内容应运而生的。所以在众多终端设计导航占着至高的位置，一个简单易操作的号航可以带来更多的用户。
关键词：IOS系统 移动终端产品 应用程序 导航设计
伴随着科技的发展和计算机硬件技术的更新，以苹果和安卓为主流的智能手机、平板电脑等移动终端设备逐渐走进人们的视线改变着人类的生活。在信息爆炸的时代，人们通过这些移动的设备去获取海量的信息，不可否认移动终端成为了传递人与科技的一条桥梁。在众多基于移动设备的运用程序中如何去设计一款适合消费群体的交互应用程序是检验交互设计成功的关键。在设计的过程中，面临着内容信息的多样性，交互的模式也呈现着不同的变化。本文以传统的移动交互模式为契机，研究和分析在不同的内容信息条件下，设计符合功能性要求的交互模式，并通过具体的案例分析对导航交互设计进行研究。
一、前期选题制定和准备
传统的导航模式主要有三种：平铺列表、树状结构和标签页。这几种导航模式大部分普及及应用所有的app。在前期的选题中，我们根据目前手机市场的产品多样化及用户心理进行分析，通过手机屏幕的尺寸大小从而重新设计导航模式，在苹果公司产品中Assistive Touch被广大用户所青睐，方便快捷的导航模式代替任何功能键。由此，我们根据目前App设计中的几种传统导航模式和Assistive Touch相结合进行设计，取其精华。给用户一个全新的导航模式及概念。每一个设计师要根据当下的产品样式与市场分析来发散思维改变传统产品模式。
在IOS系统下的移动终端设备应用中，传统的导航模式主要有三种，分别是平铺列表、树状结构和标签页。
1.平铺页面
平铺页面，顾名思义就是一张或者一叠纸片，平铺展示给用户，用户通过左右拂动来切换不同的页面，它适用于没有信息层级，没有组织架构，且每个页面的界面类型一致的应用，一般在短小精炼的功能工具性应用较为常见。平铺列表式这种方式主要用于只有一个主屏的简单应用。这类应用的信息架构简单，并没有没有复杂的信息层级和组织结构。例如我们最常用的IOS自带的天气应用主要信息在屏幕上展示，细节信息就是简单的推拉进行查看，向左右滑动即可翻页选择不同的城市。当然，平铺列表式导航的另一好处是用户可以根据需要随意的添加、删除卡片。平铺列表更自由，用户有更多选择。如果为了更好的实现这种左右滑动切换页面的模式，最好不要在平铺模式下设计多个不同的滑动手势，避免混淆。
2.tab标签栏
这种类型的导航模式最为常见，它将界面最下方的区域作为导航区，通过tab标签的形式划分为3至5个标签，每个标签对应不同功能。这种模型适合功能精炼层级较少且需要频繁切换功能的应用；它的优点在于可以直接将最核心的tab界面最为默认选中状态，用户打开应用时便直接呈现出用户最关心的信息内容，比如社交应用的信息流，邮件应用的收件列表等；同时，用户可以在大部分页面中直接切换tab标签而轻松跳转页面，并清晰告诉用户该应用的主要功能以及当前所在功能；缺点在于tab标签数量有限，IOS HIG建议不超过5个标签，如有超过的功能菜单则统一放在“更多”标签中；同时，该标签占据50px高度的区域，且在大部分界面中始终存在，占据着10%的信息展现区域。
3.树形列表
树形列表形式的导航模型在邮件系统比较常见，它将每一级别的功能通过list列表形式展现，点击之后展开下一级的lis列表，如此类推直到最终的功能展现界面。这种导航模型的优势在于可扩展性大，能应对具有大量的类别、功能和项目的应用，比如购物分类等，这种list的组织形式Eweb中比较常见，用户容易理解，并且可满足用户自定义列表的需要，比如对列表进行新增、删除、排序等，微信的应用插件模式也采用了列表来展现。树形列表的缺点在于层级深，父级的所有其它列表在子列表中不可见，必须要返回到上一级，来回返回比较麻烦，往往从一个子功能切换到另一个子功能时需要在漫漫路途上“奔波”。
二、用户调研及市场分析
iPad中的电子杂志中，尤其是时尚类的奢华的电子杂志，像诸如一些CHANEL，Gucci或者BMW这样的精致的奢侈品类，会更突出其内容中产品的高清图片，让用户更加体验到其产品的精细和奢华，一般都会使用隐形的导航栏模式，就是在触控屏幕是弹出导航栏，在点击之后导航栏会隐藏起来，这样用户可以在这个屏幕观赏其内容，这一点和QQ阅读等阅读类软件所采用的导航模式相似。纵观整个QQ阅读的导航设计，它并没有像微博客户端或一些浏览器客户端一样直接运用标签页形式的导航模式，而是将其隐藏起来，当用户触控移动设备屏幕后它才會出现，再次点击后又会隐藏起来，这样真正实现了阅读文字的全屏化，使用户的阅读文字面积达到最大化，辨识度也被提高。在选题之后通过作品分析及用户调研进行设计，当前各种玲琅满目的App无论是社交软件、阅读应用、少儿应用等大都运用了目前传统导航模式：平铺模式、列表模式、侧边栏等。通过其他产品的分析，我们所设计的这款应用根据产品屏幕的尺寸和用户心理来由此设计，在几项调查问卷中所了解到了大多数人们在对手机界面中触控范围上的限制及不便有很大困扰，因此我们这款导航模式是有必要在各类产品中展示的，来改变用户传统导航模式的概念。
三、作品设计
在作品设计中我们确定了设计课件的整体风格为简约、时尚。通过实物去研究纹样，了解纹样后用纹样装点生活。首届以类似展廊的形式移动，受众可根据兴趣进行选择了解（见图一）。并隐藏传统导航，整个界面的移动展廊就是导航。从多媒体教学软件的开发流程中，我们不难看出：教学设计是开发的基础，对多媒体教学软件的设计起着一定的理论指导作用。在首页我们为了用户方便使用，把导航设计成平铺导航，用户可直观地选择纹样类型，简单明了（见图二）App系统主要详细介绍了中国传统吉祥纹样的历史发展、不同种类、常见图案组合与古今用途。吉祥纹样是以含蓄、谐音等曲折手法，组成具有一定吉祥寓意的装饰纹样，表达了“富、贵、寿、喜”（见图三）；并以“富贵寿喜”作为二级界面导航，触碰时的动画可带给用户一种互动感。同时在左侧隐藏的搜索条中还能分别依照纹样种类、用途与个人喜好三种形式让受众直接找到自己想了解的内容（见图四）。导航的多样性更便于用户依照个人的习惯，准确和便利的搜索出用户想要了解的内容。而导航的不规则图形更加突出了作品的主题，以“万字纹”的纹形导航来排列纹样供用户选择，是我们这作品的新颖和创意之处。并不是以单一的横竖列表来表现导航，导航并不只是为了达到切换内容的目的，也同样是作品设计中的点睛之处。因为隐形导航的最大问题就是它的导航模式是隐藏起来的，那么必须有教程或提示用户如何使用这些功能，当用户第—次使用此款应用时要有明确的标注及使用方法，以免用户操作不便。
随着path出现，左侧导航可以说脱离了传统的ios交互结构，这种新颖的导航模型也越来越受到大家的青睐。可以说左侧导航是集众家之所长，取其精华去其糟粕，具有无限的功能拓展『生，可实现用户自定义；界面逻辑清晰，物理层次明了；不喧宾夺主，却又给人留下深刻印象。
由于目前各类移动终端产品屏幕尺寸越来越大，所以这就增加了用户使用难度，一个手指很难触摸到屏幕上的各个角落。通过大量的用户体验测试中我们得到了一个答案，在用户使用中，手机屏幕左上角是用户很难操控区域，其次是屏幕右下角，所以我们设计师在设计时要考虑这两个问题，避免更多的信息量或导航放在这两个区域，一个好的产品不仅仅时页面风格炫丽就可以吸引用户，更多的是从用户心理出发设计交互，怎样能更方便的把产品内容展示给用户。我们通过以上的结论中设计了一款隐藏导航。在用ios系统的用户可能都知道在设置里面有—项功能叫AssistiveTouch，我们打开之后它可以代替手机上的一些按钮键，方便易操作。通过ios的这个交互设计我们想以此把它改变成产品导航的形式，但是它不会固定的在某一个位置，是处于隐藏的状态，比如当我们在看—本书的时候，我们把所有的导航都隐藏，整个页面只展示书架或者读书文字，当用户想调节读书模式，可以双击屏幕两次，此时页面会弹出来一个圆圈导航在屏幕中间，以此来操作改变读书模式，这样用户在使用的时候就不会考虑环境因素，在挤地铁等环境下可以单手操作，不会因屏幕过大触控不到导航而使用两双手。怕避免导航频繁的弹出，因此我们设计只有用户在双击屏幕的情况下才方可使用。
当然，隐形导航的最大问题就是它的导航模式是隐藏起来的，那么必须有教程或提示用户如何使用这些功能，一般这种提示只出现在软件第—次使用时。这些提示尤为重要，当用户看着全屏的文字找不到返回时，可能就会很失望了’尝试无果后可能就会直接卸载应用程序，用户如何知道该如何使用导航，应用应该如何引导受众去操作？这个问题设计师应该思考的，要遵从避免冲突，前后、左右，全局统一。
App导航设计需要在明确了设计的总体框架和结构后，根据硬件的特点和用户的使用习惯进行设计。通过理性的架构分析，感性的体验设计，好的导航结构能让你的App设计事半功倍。
关键词：IOS系统 移动终端产品 应用程序 导航设计
伴随着科技的发展和计算机硬件技术的更新，以苹果和安卓为主流的智能手机、平板电脑等移动终端设备逐渐走进人们的视线改变着人类的生活。在信息爆炸的时代，人们通过这些移动的设备去获取海量的信息，不可否认移动终端成为了传递人与科技的一条桥梁。在众多基于移动设备的运用程序中如何去设计一款适合消费群体的交互应用程序是检验交互设计成功的关键。在设计的过程中，面临着内容信息的多样性，交互的模式也呈现着不同的变化。本文以传统的移动交互模式为契机，研究和分析在不同的内容信息条件下，设计符合功能性要求的交互模式，并通过具体的案例分析对导航交互设计进行研究。
一、前期选题制定和准备
传统的导航模式主要有三种：平铺列表、树状结构和标签页。这几种导航模式大部分普及及应用所有的app。在前期的选题中，我们根据目前手机市场的产品多样化及用户心理进行分析，通过手机屏幕的尺寸大小从而重新设计导航模式，在苹果公司产品中Assistive Touch被广大用户所青睐，方便快捷的导航模式代替任何功能键。由此，我们根据目前App设计中的几种传统导航模式和Assistive Touch相结合进行设计，取其精华。给用户一个全新的导航模式及概念。每一个设计师要根据当下的产品样式与市场分析来发散思维改变传统产品模式。
在IOS系统下的移动终端设备应用中，传统的导航模式主要有三种，分别是平铺列表、树状结构和标签页。
1.平铺页面
平铺页面，顾名思义就是一张或者一叠纸片，平铺展示给用户，用户通过左右拂动来切换不同的页面，它适用于没有信息层级，没有组织架构，且每个页面的界面类型一致的应用，一般在短小精炼的功能工具性应用较为常见。平铺列表式这种方式主要用于只有一个主屏的简单应用。这类应用的信息架构简单，并没有没有复杂的信息层级和组织结构。例如我们最常用的IOS自带的天气应用主要信息在屏幕上展示，细节信息就是简单的推拉进行查看，向左右滑动即可翻页选择不同的城市。当然，平铺列表式导航的另一好处是用户可以根据需要随意的添加、删除卡片。平铺列表更自由，用户有更多选择。如果为了更好的实现这种左右滑动切换页面的模式，最好不要在平铺模式下设计多个不同的滑动手势，避免混淆。
2.tab标签栏
这种类型的导航模式最为常见，它将界面最下方的区域作为导航区，通过tab标签的形式划分为3至5个标签，每个标签对应不同功能。这种模型适合功能精炼层级较少且需要频繁切换功能的应用；它的优点在于可以直接将最核心的tab界面最为默认选中状态，用户打开应用时便直接呈现出用户最关心的信息内容，比如社交应用的信息流，邮件应用的收件列表等；同时，用户可以在大部分页面中直接切换tab标签而轻松跳转页面，并清晰告诉用户该应用的主要功能以及当前所在功能；缺点在于tab标签数量有限，IOS HIG建议不超过5个标签，如有超过的功能菜单则统一放在“更多”标签中；同时，该标签占据50px高度的区域，且在大部分界面中始终存在，占据着10%的信息展现区域。
3.树形列表
树形列表形式的导航模型在邮件系统比较常见，它将每一级别的功能通过list列表形式展现，点击之后展开下一级的lis列表，如此类推直到最终的功能展现界面。这种导航模型的优势在于可扩展性大，能应对具有大量的类别、功能和项目的应用，比如购物分类等，这种list的组织形式Eweb中比较常见，用户容易理解，并且可满足用户自定义列表的需要，比如对列表进行新增、删除、排序等，微信的应用插件模式也采用了列表来展现。树形列表的缺点在于层级深，父级的所有其它列表在子列表中不可见，必须要返回到上一级，来回返回比较麻烦，往往从一个子功能切换到另一个子功能时需要在漫漫路途上“奔波”。
二、用户调研及市场分析
iPad中的电子杂志中，尤其是时尚类的奢华的电子杂志，像诸如一些CHANEL，Gucci或者BMW这样的精致的奢侈品类，会更突出其内容中产品的高清图片，让用户更加体验到其产品的精细和奢华，一般都会使用隐形的导航栏模式，就是在触控屏幕是弹出导航栏，在点击之后导航栏会隐藏起来，这样用户可以在这个屏幕观赏其内容，这一点和QQ阅读等阅读类软件所采用的导航模式相似。纵观整个QQ阅读的导航设计，它并没有像微博客户端或一些浏览器客户端一样直接运用标签页形式的导航模式，而是将其隐藏起来，当用户触控移动设备屏幕后它才會出现，再次点击后又会隐藏起来，这样真正实现了阅读文字的全屏化，使用户的阅读文字面积达到最大化，辨识度也被提高。在选题之后通过作品分析及用户调研进行设计，当前各种玲琅满目的App无论是社交软件、阅读应用、少儿应用等大都运用了目前传统导航模式：平铺模式、列表模式、侧边栏等。通过其他产品的分析，我们所设计的这款应用根据产品屏幕的尺寸和用户心理来由此设计，在几项调查问卷中所了解到了大多数人们在对手机界面中触控范围上的限制及不便有很大困扰，因此我们这款导航模式是有必要在各类产品中展示的，来改变用户传统导航模式的概念。
三、作品设计
在作品设计中我们确定了设计课件的整体风格为简约、时尚。通过实物去研究纹样，了解纹样后用纹样装点生活。首届以类似展廊的形式移动，受众可根据兴趣进行选择了解（见图一）。并隐藏传统导航，整个界面的移动展廊就是导航。从多媒体教学软件的开发流程中，我们不难看出：教学设计是开发的基础，对多媒体教学软件的设计起着一定的理论指导作用。在首页我们为了用户方便使用，把导航设计成平铺导航，用户可直观地选择纹样类型，简单明了（见图二）App系统主要详细介绍了中国传统吉祥纹样的历史发展、不同种类、常见图案组合与古今用途。吉祥纹样是以含蓄、谐音等曲折手法，组成具有一定吉祥寓意的装饰纹样，表达了“富、贵、寿、喜”（见图三）；并以“富贵寿喜”作为二级界面导航，触碰时的动画可带给用户一种互动感。同时在左侧隐藏的搜索条中还能分别依照纹样种类、用途与个人喜好三种形式让受众直接找到自己想了解的内容（见图四）。导航的多样性更便于用户依照个人的习惯，准确和便利的搜索出用户想要了解的内容。而导航的不规则图形更加突出了作品的主题，以“万字纹”的纹形导航来排列纹样供用户选择，是我们这作品的新颖和创意之处。并不是以单一的横竖列表来表现导航，导航并不只是为了达到切换内容的目的，也同样是作品设计中的点睛之处。因为隐形导航的最大问题就是它的导航模式是隐藏起来的，那么必须有教程或提示用户如何使用这些功能，当用户第—次使用此款应用时要有明确的标注及使用方法，以免用户操作不便。
随着path出现，左侧导航可以说脱离了传统的ios交互结构，这种新颖的导航模型也越来越受到大家的青睐。可以说左侧导航是集众家之所长，取其精华去其糟粕，具有无限的功能拓展『生，可实现用户自定义；界面逻辑清晰，物理层次明了；不喧宾夺主，却又给人留下深刻印象。
由于目前各类移动终端产品屏幕尺寸越来越大，所以这就增加了用户使用难度，一个手指很难触摸到屏幕上的各个角落。通过大量的用户体验测试中我们得到了一个答案，在用户使用中，手机屏幕左上角是用户很难操控区域，其次是屏幕右下角，所以我们设计师在设计时要考虑这两个问题，避免更多的信息量或导航放在这两个区域，一个好的产品不仅仅时页面风格炫丽就可以吸引用户，更多的是从用户心理出发设计交互，怎样能更方便的把产品内容展示给用户。我们通过以上的结论中设计了一款隐藏导航。在用ios系统的用户可能都知道在设置里面有—项功能叫AssistiveTouch，我们打开之后它可以代替手机上的一些按钮键，方便易操作。通过ios的这个交互设计我们想以此把它改变成产品导航的形式，但是它不会固定的在某一个位置，是处于隐藏的状态，比如当我们在看—本书的时候，我们把所有的导航都隐藏，整个页面只展示书架或者读书文字，当用户想调节读书模式，可以双击屏幕两次，此时页面会弹出来一个圆圈导航在屏幕中间，以此来操作改变读书模式，这样用户在使用的时候就不会考虑环境因素，在挤地铁等环境下可以单手操作，不会因屏幕过大触控不到导航而使用两双手。怕避免导航频繁的弹出，因此我们设计只有用户在双击屏幕的情况下才方可使用。
当然，隐形导航的最大问题就是它的导航模式是隐藏起来的，那么必须有教程或提示用户如何使用这些功能，一般这种提示只出现在软件第—次使用时。这些提示尤为重要，当用户看着全屏的文字找不到返回时，可能就会很失望了’尝试无果后可能就会直接卸载应用程序，用户如何知道该如何使用导航，应用应该如何引导受众去操作？这个问题设计师应该思考的，要遵从避免冲突，前后、左右，全局统一。
App导航设计需要在明确了设计的总体框架和结构后，根据硬件的特点和用户的使用习惯进行设计。通过理性的架构分析，感性的体验设计，好的导航结构能让你的App设计事半功倍。