美文网首页
移动端导航栏——交互基础篇

移动端导航栏——交互基础篇

作者: 金哥Ipo | 来源:发表于2020-06-12 11:02 被阅读0次

1:导航栏位置

状态栏下面部分就是导航栏

各热门行业app首页导航栏展示

京东导航栏:左侧logo,右侧扫一扫,消息

网易导航:左侧logo,右侧消息

微信导航栏:右侧操作按钮

抖音导航栏:两个栏目切换,左侧直播按钮,右侧搜索

2:导航栏内容

同一个app的不同层级界面导航栏的区别

超市页:左侧返回,右侧关注,操作按钮

分类页:左侧返回,右侧分类按钮

详情页:左侧返回,右侧分享,操作按钮

总结:除首页外,通常情况导航栏面左侧都有返回按钮,个别也会有放在左下,具体情况看设计本身。若无返回,那一定是取消(退出当前页面)

3:导航栏的模式

常见的导航栏的模式

图一:首页导航栏

图二图三:第二或者更深层次的导航栏

相关文章

  • 移动端导航栏——交互基础篇

    1:导航栏位置 状态栏下面部分就是导航栏 京东导航栏:左侧logo,右侧扫一扫,消息 网易导航:左侧logo,右侧...

  • 交互设计之(三)标签栏&导航栏设计

    来源:UI中国 在交互设计中,各个不同的场景需要不同的标签&导航栏设计 标签式导航又叫Tab式导航,是目前移动端市...

  • 移动端标签栏规范——交互基础篇

    一:标签栏的位置 在移动端整个界面结构中,标签栏位于底部区域。 在ios规范里面界面结构如图所示,ios的标签栏是...

  • vue bootstarp 左侧导航栏可收缩,移动端适配成滑入画

    左右布局,支持左侧导航栏固定可收缩,鼠标移动可触发伸展,左侧导航栏手风琴模式,支持移动端适配,小屏左侧导航栏会变成...

  • Tailwind Navbar

    导航栏 PC导航栏仿Airbnb导航条 PC导航条添加图标 PC导航条上图下字 移动端导航条

  • 移动端导航栏

    可以作为应用主体导航 标签导航 标签导航是IOS系统中最常见的导航,它继承了桌面导航的样式,对图标进行了扁平化处理...

  • 移动端原型图设计

    一、移动端界面的6大模块 移动端界面的包含了6大模块:状态栏、导航栏、内容区域、标签栏、轻提示、弹出层。 状态栏显...

  • 滑动菜单栏

    手机移动端可滚动的导航代码 /滚动水平导航栏 start/.lr_n...

  • Vue 实现一个头部导航栏

    一个移动端的前端肯定是需要头部导航栏的,头部导航栏需要通过路由知道是否要显示返回按钮,并且根据底部导航栏改变tit...

  • 移动端交互之导航

    讨论两种导航架构在应用中的区分:底部横向导航和侧边纵向导航 1、底部横向导航 特点:横向排列与界面底部,可直接方便...

网友评论

      本文标题:移动端导航栏——交互基础篇

      本文链接:https://www.haomeiwen.com/subject/gdtvtktx.html