最热门的12种导航模式

最热门的12种导航模式

ID:21704166

大小:1.07 MB

页数:22页

时间:2018-10-24

最热门的12种导航模式_第1页
最热门的12种导航模式_第2页
最热门的12种导航模式_第3页
最热门的12种导航模式_第4页
最热门的12种导航模式_第5页
资源描述:

《最热门的12种导航模式》由会员上传分享,免费在线阅读,更多相关内容在应用文档-天天文库

1、最热门的12种导航模式用户在使用应用时,需要随时清楚了解下一步应当前往哪一页面以及如何前往该页面。如果用户无法轻松在应用中进行导航,则将很快对你的应用失去兴趣。因此,能否为移动应用设计出有效的导航功能至关重要。在投入菜单、操作栏、弹窗、按钮、箭头、链接等内容的设计之前,你需要牢记几个基本的注意事项。导航设计的4大注意事项在弄清自己移动应用的架构和组织情况之后,就可以开始考虑导航设计了。在此时,你需要考虑下面的几个事项:1.可达性移动应用的导航功能可以说是所有界面最重要的组成部分,因此一定要保证其可达性,并把最关键的要

2、素尽量突出,同时不要影响到内容本身。2.是否有意义确保菜单、操作栏、弹窗、按钮、箭头、链接等导航要素简单明了,让用户一看就知道是什么意思以及操作结果是什么。不要弄的太过花哨,用户没有耐心去“猜”。3.易于理解如果你想设计比较高级的导航功能(例如链接图片、允许滑动或其他手势导航,或者访问隐藏菜单),请务必在设计过程中保证前后一致,以便用户熟悉你所使用的模式,同时还应加入一些额外的信息(例如小箭头、文字或改变颜色或高亮等)来吸引用户注意力,并以微妙的方式对用户进行引导。不要给用户呈上“看得见摸不着的导航功能”。4.通用性

3、你的导航功能应当以一定的形式显示于移动应用的各个界面。各个导航模式不一定要完全相同,但其基本结构应当在应用内保持一致,可以根据背景进行小幅度的调整。导航模式概述在记住上述设计目标后,下面是本文要详细说明(对这些设计模式的更深入探讨请见我们的电子书《移动UI设计模式2014》)的几个设计模式的概览:1. 说明与引导标记2. 溢出菜单3. 滑块4. 基于内容的导航5. 变换式控件6. “跟随式”固定导航7.垂直导航8. 弹窗9. 滑出页面、侧边栏和抽屉10. 无所不至的链接11. 高级滚动条12. 滑动视图1.说明与引导

4、标记Secret问题用户希望了解如何使用应用的各项功能。解决方案设计一套说明或教程来演示各项功能如何使用。现在很多应用都使用这种方式在用户首次启动时提供演示。这种方式可以分为两大基本方法。Secret和YouTube等应用采用了覆盖图指南的方法,并使用“引导标记”突出显示UI中的关键部分来说明其作用。另外,Carousel和Duolingo等应用则会在用户首次启动时以幻灯片的形式引导用户走完全部体验过程,从而有效地说明应用能够帮助用户实现哪些功能。这一引导过程同时也是收集重要信息(方便后期简单注册乃至更深入的需求)的

5、绝佳时机,类似于设置向导。这一模式对于无法第一时间直观了解功能的应用来说至关重要,因为用户对你的应用了解越深刻,就越有可能继续用下去。2.溢出菜单Whatsapp、Gmail问题用户希望能够快速使用附加选项或操作。解决方案将附加选项和按钮隐藏在溢出菜单中,这样它们就不会干扰主界面。溢出菜单在安卓系统中有着广泛的应用,其主要用于将不常用但与当前内容有相关度的选项和菜单项隐藏到操作栏中。Whatsapp和Gmail等应用对刷新和状态设置等菜单项(这些都是用户需要能够快速使用,但如果放在显眼位置会比较碍事的附加功能)就采用

6、了这种模式。在RelateIQ中,用户可以按住主菜单项来查看子菜单,从而实现快速导航到不同视图。3. 滑块Uber问题用户希望能够在不同选项之间无缝切换。解决方案使用滑动手指的方式实现选项切换的显眼、轻松过渡。例如,Uber可让用户在各侧间拖动滑块无缝切换四种出行服务方式。在这一UI设计模式中,其甚至可以放大缩小地图,从而给用户模拟出周边车辆的密度水平,让你能够自动看到各种可行的方案。4.基于内容的导航Tinder问题用户希望能够轻松、直观探索特定内容的细节。解决方案实现概览和细节界面的无缝过渡。Tinder和9Ga

7、g均实现了这方面的无缝响应。在Tinder中,其UI设计模式可让用户在两种用户资料界面无缝过渡,用户只需单击各视图的主照片即可。不仅如此,如果用户在用户资料的详细视图界面下滑动各个照片,然后单击某个照片返回基本视图,其还会保留显示你所单击选中的照片。这样即可实现极为流畅、直观的用户体验和流程。5. 变换式控件Pinterest问题 用户希望能够执行各种不同的操作,但屏幕空间有限,无法显示全部所需控件。解决方案使用其他功能替换按钮和屏幕控件。根据用户当前操作情况的不同,UI设计可以使用针对性的元素替换先前的元素。例如,

8、用“执行”替换“撤销”或“添加”替换“删除”。如果用户先后执行的操作存在一定的关联,那么这种方法绝对有效。Pinterest和Spotify会把“+”变成“x”按钮,这样用户就能知道自己可以取消添加别针或关注相簿。这一UI设计模式可大量节约空间,让撤销操作快速简洁,整体上堪称值得玩味的解决方案。6.“跟随式”固定导航Dropbox问题用户希望能

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。