肥猫SEO论坛»论坛首页 › 行业交流 › 软件下载 › 产品之术：解析「底部导航」交互布局

高端网站建设可签合同可上门沟通	站群程序定制/蜘蛛池租用	全行业SEO接单QQ1624516415	全行业SEO接单QQ1624516415
2000+站点外链一键通发	原创SEO文章代写【点击】	点击加入本站VIP 发帖免审核	广告位招租

honghu2

23万积分	0 好友	7万主题

发消息

产品之术：解析「底部导航」交互布局

TA的其它主题

发表于 2021-9-26 09:48 | 查看: 206| 回复: 0

产物之术：解析「底部导航」交互结构

文章对底部导航举行响应的分解，但愿对你有所帮忙。

引·底部导航是产物的框架地点
底部导航是一个APP最直观的框架表示。从某乎的屡次改版、到导航动效的多样化，每次改版大师城市对底部导航倾泻很大的热忱。

在做功效模块时也同样，不少时辰咱们也必要为模块加一个底部导航。可是在需求评审的时辰，你也必定听带领说过这句话：“这不就是APP套APP吗？”。

并不然，底部导航的应用和意义细心揣摩收拾以后，是表现了功效模块的需乞降结构思绪的，下面笔者收拾四种场景的导航环境，举行梳理阐发。
理·四种常见底部导航模式1、全局底部导航

第一种，是最多见的全局底部导航。这类导航微信是用的最广泛且层级最高的。全局导航在切换时互不影响，在首页举行转动检察后换回来仍然还在原处，这类导航有四大特色：
四大导航内部界面互不影响切换后不会从新刷新界面四大功效同品级别随时切换，扁平瓜葛
那末这类导航的利用场景必要具备几大特色：
高频次切换模块的需求，多见于社交场景几大功效模块优先级较高且同等，多见于APP首页的全局2、H5底部导航

第二种，称之为H5底部导航。这类导航多见于H5功效模块中，也较常见。雷同于第一种，但功效切换上是关头区别点。这类导航在切换模块时，每次进入都是一次刷新，是没有缓存的，都是从0起头，这也就象征着其实不合用于高频次切换场景。

故咱们称之为伪底部导航，在不触及到切换保存、阅读保存等环境下，根基同等于第一种。
3、跳转底部导航

花聊第三种咱们称之为跳转底部导航，热点软件园这类就仅仅是情势上的底部皇冠交友导航了。由红杏交友于除主页以外的功效，跟首页导航是上下级的瓜葛。这也就象征着，剩下的几个导航根基完彻底全至关于按钮，只不外是导航样式的按钮摆放。特色以下：
点击后是跳转刷新，新界面导航不复存在不成切换，是进步撤退退却的瓜葛
这类导航在咱们但愿凸起某种功效的环境下可使用，且条件是多个导航功效之间没有切换的需求。
4、驼式底部导航

第四种，是特别版的底部导航，由于常见于一个加号外形的驼峰，故叫驼式底部导航。这类导航的关头在于驼峰，驼峰是处于略高于其他功效点的层级。这类导航的利用常见于社区型APP，具备多格局公布需求的环境下，会选择采纳驼式导航来凸起功效点。
联·四种模式的横向比力阐发功效雨燕直播布局阐发

如图所示，咱们假如ABCD为四大功效。按照上文的阐发钻研，咱们可以获得如下结论：
全局和H5的不同几近只在于切换时的真自力切换仍是必要刷新。跳转式的底部导航功效布局是分两个层级的。驼式导航的驼峰要略高于其他几个层级。对付功效模块想利用底部导航的环境，要按照功效布局需求而定。利用场景阐发

四种导航除利用在分歧场景以外，咱们必要对应分歧的交互和视觉方案，斟酌如下几点：
是不是必要滑动切换仍是仅仅容许点击切换？跳滚动画及动效合适哪一种？定名法则和划分是不是互不滋扰彻底自力?刷新场景的数据量巨细，是不是合适高频切换刷新？必要若何做当地缓存共同？
充实斟酌结构及交互后，咱们才能拿出一个完备的导航设计方案。
结·从导航起头
底部导航的利用今朝蜕变情势多样化，交互动效也比力丰硕。咱们要服膺这个设计的初心即“导航”二字，底部的导航是视觉习气的终点，也象征着当咱们这个界面操作竣事的时辰，想换界面的时辰，眼光是逗留在界面下方的。以是底部导航要做的就是在用户夷由的间隙，给出指引和导航。这是底部导航之余TAB页的区分，TAB页表现的是一种角度视角的划分，雷同于一种挑选，而底部导航则代表着门和通道。

至于这个门和通道怎样设置，你给用户的是四个互通的门，仍是四条平行的路，亦或是其它瓜葛层级，是必要咱们在做结构和阐发时斟酌的永久话题。

作者：花生酱师长教师，微博：Mr花生酱师长教师；公家号：产物之术

本文由 @花生酱师长教师原创公布于人人都是产物司理。未经允许，制止转载。

题图来自 Pexels，基于 CC0 协定

收藏0 回复显示全部楼层道具举报

返回列表

		自动登录	找回密码
密码			立即注册