移动端导航设计

news/2024/12/2 19:53:12/

根据产品层级的深度和广度,选择适合的导航模式,是产品设计中的关键一环。
任何APP的组织信息都需要以某种导航框架固定起来,一个新的产品合适的导航框架,决定了产品之后的延伸和扩展。
移动端的屏幕尺寸就这么大,操作方式也无非就是点击、滑动、长按这些。接下来我们可以具体分析一下这几种导航模式。
一、标签导航(选项卡式)
标签导航分很多种,有底部标签导航,顶部标签导航,
底部标签导航是最基本的导航,几乎绝大部分 app 中都在用,tabbar 位于页面最底部,一般3-5个 tabbar,有文字+icon,也有纯 icon 形式,但大部分是文字+icon 的形式。
在这里插入图片描述

二、抽屉式导航
抽屉式导航将部分信息内容进行隐藏,突出了应用的核心功能。如果产品信息层级有非常多的页面和内容,难以在一屏内显示全部内容,抽屉式导航是个不错的选择。
在这里插入图片描述
在这里插入图片描述

三、列表式导航
列表式导航结构简单清晰、易于理解、冷静高效,能够帮助用户快速定位到对应内容。列表导航也是十分常见,几乎在每一个 app 里面都会存在,大部分时候是作为二级导航存在,但是也会存在于一级导航的时候
在这里插入图片描述
四、宫格式导航
宫格导航,也是十分常见的导航形式,除了一些工具类 app 外,大部分是作为二级页面展示出来,并且以 icon+文字的形式居多。
在这里插入图片描述
五、下拉菜单式导航
下拉菜单式导航一般位于App界面的顶部,用户通过点击相应位置呼出导航菜单呼出的菜单位于界面的上面,点击菜单导航以外区域可以收起菜单。下拉菜单式导航与所在界面的连贯性较好,展开和收起对当前界面没有什么影响。
在这里插入图片描述
更多导航设计模板,请下载(设计软件:Axure8.0)
免费下载模板地址:https://download.csdn.net/download/weixin_43516258/87708307?spm=1001.2014.3001.5503


http://www.ppmy.cn/news/49459.html

相关文章

【对话ChatGPT】如何看待java行业内卷的问题?

本文首发自「慕课网」,想了解更多IT干货内容,程序员圈内热闻,欢迎关注"慕课网"! 作者:ccLoveStudy 当今大环境,编程行业火热,而java行业更是首当其冲,但是为此&#xff0…

【部署YUM仓库】

目录 一、YUM概述1.1、YUM( Yellow dog Upadater Modified) 二、准备安装源2.1、YUM软件仓库类型2.2、RPM软件包的来源2.3、第三方yum源的网址查看:2.4、构建CentOS 7 软件仓库2.4.1、配置yum源仓库时要先挂载2.4.2、配置yum源仓库2.4.3、配置完后更新缓存 2.5、ftp…

基于脉搏波信号和人工智能方法的应用

目录 一、引言 二、脉搏波信号基本原理和特点 2.1 脉搏波信号的产生和传播 2.2 脉搏波信号的特征参数 三、人工智能技术在脉搏波信号处理中的应用 3.1 传统机器学习方法 3.2 深度学习方法 四、基于深度学习的脉搏波信号处理方法 4.1 数据预处理 4.2 深度学习模型构建…

【安全防御】防火墙(二)

目录 1、防火墙如何处理双通道协议 2、防火墙如何处理nat 3、防火墙支持哪些NAT,主要应用的场景是什么? 4、当内网PC通过公网域名解析访问内网服务器的时候,会存在什么问题,如何解决?请详细说明 5.防火墙使用VRRP…

集群聊天服务器项目(一)——模块分层设计

本项目对程序不同功能进行分层设计,分为网络层、业务层、和数据层。 C面向接口编程也就是面向抽象类,网络模块和业务模块尽量解耦。 网络层 网络层主要封装的是网络连接方面的一些功能,即socket相关操作,这里该项目采用的是muduo网络库作为…

【C++】海量数据面试题

海量数据面试题 文章目录 海量数据面试题一、哈希切割二、位图应用1.给定100亿个整数,设计算法找到只出现一次的整数2.求两个文件交集3.在100亿个整数中找到出现次数不超过2次的所有整数 三、布隆过滤器1.求两文件交集(近似算法)2.求两文件交…

vue2项目PC端如何适配不同分辨率屏幕

项目构建:基于vue-cli3构建,使用postcss-px2rem px2rem-loader进行rem适配 实现原理:每次打包,webpack通过使用插件postcss-px2rem,帮我们自动将px单位转换成rem单位前方有坑:UI框架部分组件使用JavaScript…

Thinkphp+vued大学生租房管理系统mysql校园房屋租赁网站系统

学生租房管理系统是计算机技术和网络迅速发展的一个大学生租房信息应用解决方案。大学生租房平台将Internet网络技术与现代管理观念相融合,针对信息技术的特点对大学生租房平台进行规划和重构,对大学生租房信息流进行优化及合理配置,生成动态…