首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

送你一份B端常用列表设计总结,快来看看吧!

列表在B端设计中,算是一个非常基础的设计元素,无论是什么产品设计,绝大多数的内容都要通过列表进行展示,才能最大程度的体现出清晰与美观,帮助使用者快速定位内容。常用来预览、查询、筛选、项目增减等等。所以为了方便B端企业在产品设计过程中,更加高效且高质量的进行列表的交互设计,在此特为大家呈上一份列表设计总结。

基础型列表

纵向列表

常用于一个范围内相关的各项数据或选项项目的纵向平铺展示,通常左对齐、操作按钮位于右侧,用户只需上下滑动即可预览所有。

纵向列表一般条目详细,方便用户快速预览。

横向列表

常见于网站首页的横向轮播滚动面板,用户也是只需左右滑动面板,就会实现图片的一个切换。

较纵向列表,横向列表能更加充分的利用空间,但是页面一般较少,过多容易造成用户的视觉疲劳,并且不易操作。

网格型列表

除了纵向列表和横向列表外,还有一种兼顾了两种维度的列表形式,那就是网格列表,这也是一种非常常见的列表形式。

网格列表的信息承载内容更多,单一网格内可展示多行信息。数据项之间的边界清晰,方便对网格内的数据进行对比。操作按钮根据业务需求和用户需求可置于列表右侧或单个网格内。

主从型列表

主从列表即项目之间存在着从属递进的关系。常见为一个主项目下拉会出现从属项目。列表具有较强的层级关系、从属关系、递进关系时可选用。

主从列表也能够充分利用空间,不需要的项目可以选择隐藏,需要的项目详细展开。

(四)综合型列表

综合型列表即列表数据之间既包含并列关系,又包含从属关系等。综合型列表适用于展示复杂的项目场景。综合型列表可以对不同项目进行预览、下载、编辑、删除等操作。

基于综合型表格可方便地对业务数据进行组合、分解和重新布局排列。

JNPF快速开发平台上就是一个综合型的列表,从并列上看有创建人、创建时间、修改人、操作等,在操作栏下还可以再次编辑、删除等等。从属上看主项目有日常工作、人事管理、费用相关等,从项目又细分为库房管理、市场活动、入职申请等等。

最重要的是,在JNPF快速开发平台上用户可以自行新建一个列表设计,详细视频教程也已同步上线在公众号、视频号上,简单便捷,帮助您快速建立一个清晰美观的列表,赶快查看试一试吧!

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20211102A06YKR00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券