移动产品设计之ios系统的导航

做道题:[不定项选择题]

OS中导航设计模式有几种?

A.平铺导航

B.标签导航

C.树形导航

D.模态视图导航

正确答案:A B C

讲解:

导航始终是产品设计的重头戏,往往产品设计中90%的事情就是在做导航。在iphone中预置了3种可以直接使用的导航模式:平铺列表、标签页、树状结构,每种模式都配有不同的工具栏和控件。三种导航模式可以独立使用也可以混搭,让你的用户可以优雅的穿行与你的应用之中。

(图片来源:Tapworthy

平铺列表

这种方式主要用于只有一个主屏的简单应用。这种方式很适合浏览并发现类的应用,因为他的信息架构简单到极致,没有信息层级也没有组织结构,就像一叠卡片一样。主要信息在卡片的“正面”展示,“反面”就是简单的设置,向左右滑动即可翻页,典型应用比如内置的天气应用。

当然,平铺列表式导航也可以根据你的需要随意的添加、删除卡片。从某种意义上讲,他的扩展性优于标签页式导航,因为标签页模式中类目与顺序都是固定的。

在平铺列表模式的页面底部都添加了页面分页控件,其表现为一排小圆点。小圆点的数量代表了平铺的页面的数量,而高亮的小点则是另外一种形式的导航, 他显示了当前所在页面的位置。同时,页面分页控件也是可以操作的,点击控件的左半部分或者右半部分或者直接左右滑动可以切换上一个/下一个页面,不过,页 面分页控件每次只能翻一页,而不是直接跳转到某一页去。一般而言,页面分页以不超过10个为最优,超过了20个就会溢出屏幕了….

另外,为了更好的表达”卡片堆“的隐喻,最好不要在平铺模式下设计多个不同的滑动手势。在触摸屏上大家都能在单一方向上进行滚屏,但是2个方向的滚屏需要更好的精度,这种做法有些挑战人机工程学了。

标签页

在ios上标签页一般依附在屏幕的底部,标签栏将应用功能一一归类,点击一个标签就会跳转到相应的页面上,然后该标签以高亮的形式表明你当前的位置。在标签页模式下,每个标签对应的页面都可以有自己的界面风格和特定的内容与功能,看起来就像是在运行一个独立的应用。

标签栏的高度是49像素,每个按钮都会包含一个文本标签和图标,按钮的宽度取决于放置按钮的数量,标签栏限制最多可以放5个图标,超过之后会在第5个按钮的位置出现”更多“的标签。

当然,标签栏以49像素的高度存在其实占用了不少的屏幕空间,所以在某些情况下可以适当的去掉标签栏,典型的就是图书类应用的全屏阅读模式。

树状结构

这种模式简单来说就是将层级信息分类到一棵倒置的树枝上。这种导航模式很适合列表,点击列表中的一项可以看到新的列表,列表可以再进行分拆,直到进入项目的详情。树状结构的一个变形就是表格视图,也就是我们常说的”9宫格”,这种变形更加的图形化。

当然,根据信息的不同,树状模式中的标签也可以进行分组。一个树状模式可以分为若干的组,每个组可以包含任意数量的行数。

3类导航模式的比较

导航模式的组合应用

平铺列表、标签页、树状结构3种导航模式并不是互斥的,完全可以在一个应用里对他们进行混搭。这种混搭可以帮助我们克服单个导航模式的短处。

模态视图

我们经常会遇到在某个路径中滑出一个单屏、进行编辑、查看信息、操作界面的上的内容的情况发生。这是一种应用行为的特定形态,一般带有流程的界面变 更的情况发生,比如一张页面临时取代了整个应用程序的显示屏,我们称这种处理方式为“模态视图”。默认情况下,模式视图从屏幕底部边缘滑上来切一半覆盖了 当前整个屏幕,模态视图完成和程序主功能有关系的独立任务,尤其适合于主功能界面中欠缺的多级子任务。这种操作会暂时绕开应用的正常操作。

模态视图常常被用来编辑或添加内容,当你需要的时候模态视图一般从屏幕底部滑出而后遮盖先前的页面,当你完成任务后滑出的页面也会相应的缩回去,然 后可以继续之前的流程。有些控件和界面元素只在次要任务中被偶尔用到,模态视图很好的把他们暂时隐藏了,并且当需要的时候出现,有效的节约了屏幕空间。

模态视图有点像是导航中的死胡同,为了能够让用户也可以同样方便的回到正常的流程中去,模态视图除了正常的操作之外一般还有加上一个“完成”按钮,或者“取消”按钮。

最后,一个移动产品设计的礼仪问题

当用户从你应用的一个地方跳转到另外一个地方再原路返回来的时候,应用应该主动恢复到他上次离开的样子(千万不要重新加载,你懂的!)。这玩意学名叫状态恢复,这种保持不变的礼仪对移动产品的体验来说相当重要!

本文为转载内容,仅作为学习使用!如果转载请注明原文地址!

原文地址: http://www.ikent.me/blog/3798

时间: 2024-09-30 05:22:10

移动产品设计之ios系统的导航的相关文章

iOS 系统根据导航栏和状态栏自动修改布局

问题 条件:1.有一个全屏大小的带导航的controller 2.隐藏导航栏,最顶上还会留出状态栏的位置,而不是全屏显示 解决方法 self.automaticallyAdjustsScrollViewInsets = NO;

一些关于iOS系统导航栏与自定义导航栏的事情

关于系统导航栏是真的让人又爱又恨,爱的是苹果本身对这个控件的封装已经是很完美了,包括内存.美化.渐变动画等等,一般来说,基本上所有需求都可以满足的.但是你要知道什么东西到了中国,就会发生翻天覆地的变化,例如后台的数据并发.在国内奇葩的产品设计之下,导航栏也是面目全非,反正我看了比较著名的APP,发现他们的导航栏基本都是自定义,其中牵扯最大的问题就是导航栏自身的隐藏.颜色渐变. 其实通过APP运行时,你可以看到系统NavigationBar的分层.一个navigationBar是分很多层的,并非我

ios系统架构及常用框架

1.iOS基于UNIX系统,因此从系统的稳定性上来说它要比其他操作系统的产品好很多 2.iOS的系统架构分为四层,由上到下一次为:可触摸层(Cocoa Touch layer).媒体层(Media layer).核心服务层(Core Services layer).核心操作系统层(Core OS layer)如图: (1) 触摸层:为应用程序开发提供了各种常用的框架并且大部分框架与界面有关,本质上来说它负责用户在iOS设备上的触摸交互操作.它包括以下这些组件: Multi-Touch Event

苹果iOS系统下检查第三方APP是否安装及跳转启动

\ 在iOS系统,使用Url Scheme框架在APP间互相跳转和传递数据,本文只介绍如果检测和跳转. Url Scheme框架 如果你想知道ios设备中是否安装QQ这个软件,我们可以通过一个简单方法判断到: if ([[UIApplication sharedApplication] canOpenURL:[NSURL URLWithString:@"mqq://"]]) { NSLog(@"install--"); } else { NSLog(@"n

ios系统的特点

iphone系统特性:*用户只能同时和一个应用进行交互.只有一个程序启动正在运行,其他程序只能后台运行.后台运行机制大大缩短了程序再次启动花费的时间. *后台运行程序占有系统内存空间,当系统内存不足时,系统强制关闭空闲应用,回收系统资源.2.虚拟内存机制 *iOS和Mac OS都具有内存机制,每个进程都拥有自己的虚拟地址空间,IOS不能使用页面文件扩展进程的地址空间.系统内存不足时,会发送给应用程序一条消息,应用程序受到后释放自己地址空间的空闲内存.ios系统的特点:比较稳定,因为他是一个完全封

ios系统和安卓系统到底哪个好

现实生活中,很多朋友想知道ios系统(http://www.maiziedu.com/course/ios/)和安卓系统哪个好,更想知道安卓和iOS谁是赢家,事实上,这个标准没法衡量,更没有可比性,今天,麦子学院专家就针对各自的优势来给大家作具体介绍. 不过对于普通用户来讲,它们运行诸多相似的软件,用户转换率也很高.下面腾讯科技带你盘点这两款最流行的智能手机系统各自有何优势. 应用数量:Google Play反超App Store 近日,掌握成千上万iOS和Android开发者信息的智能平台Ap

设计一个 iOS 控件

代码的等级:可编译.可运行.可测试.可读.可维护.可复用 前言 一个控件从外在特征来说,主要是封装这几点: 交互方式 显示样式 数据使用 对外在特征的封装,能让我们在多种环境下达到 PM 对产品的要求,并且提到代码复用率,使维护工作保持在一个相对较小的范围内:而一个好的控件除了有对外一致的体验之外,还有其内在特征: 灵活性 低耦合 易拓展 易维护 通常特征之间需要做一些取舍,比如灵活性与耦合度,有时候接口越多越能适应各种环境,但是接口越少对外产生的依赖就越少,维护起来也更容易.通常一些前期看起来

【iOS开发之旅】iOS系统架构

iOS的系统架构分为四个层次:核心操作系统层(Core OS ).核心服务层(Core Services ).媒体层(Media )和可触摸层(Cocoa Touch ).下面是IOS系统结构图. 一.Core OS(核心操作系统层) 是用FreeBSD和Mach所改写的Darwin, 是开源.符合POSIX标准的一个Unix核心.这一层包含或者说是提供了整个iPhone OS的一些基础功能,比如:硬件驱动, 内存管理,程序管理,线程管理(POSIX),文件系统,网络(BSD Socket),以

为什么ios系统比android系统更为流畅

1优先级别不同:iOS最先响应屏幕 不少人都反应苹果iPhone要比一般Android手机流畅,这是一个现象要说是大问题谈不上,毕竟两者是完全两个不同的系统所以严格来说放在一起对比是不公平的.不过因为Android以及iOS是当下两大主流操作系统,对比抗衡之类的说法自然难以避免.今天我们就来谈谈为什么iOS产品在使用过程中会让人觉得更加流畅一些,而为何一些Android手机则容易出现卡顿延迟的情况. iOS手机为什么比安卓流畅 优先级别不同:iOS最先响应屏幕 当我们使用iOS或者是Androi