专栏名称: 超人的电话亭
只分享有价值的设计经验。
目录
今天看啥  ›  专栏  ›  超人的电话亭

从基础讲起,教你多种B端表格设计方式

超人的电话亭  · 公众号  · 设计  · 2024-08-15 22:48
    

主要观点总结

本文分享了关于B端表格设计的最终集案例,总结了表格设计的关键细节,包括表格外框样式、选项卡设计、筛选表单、表头设计、表格主体列表设计、多选和操作以及页码控件等。文章强调了不同元素设计的多样性和样式的组合,旨在帮助读者更好地理解和应用这些关键设计要素。

关键观点总结

关键观点1: 表格外框样式决定表格的突出方式,分为有边框和无边框两种。

有边框通过描边或卡片形式突出表格主体区域;无边框则依靠元素组合形成视觉区块。选择需根据表格所处的环境和层级来判断。

关键观点2: 选项卡设计用于切换表格的不同数据类型,其样式应保证不同级之间的差异性。

一级选项卡通常采用页签样式,而多级选项卡则需要使用不同样式来区分包含关系。

关键观点3: 筛选表单与表格结合时,对齐、操作类型和矩形边框规格是关键。

对齐方式根据其他元素的位置确定,操作类型包括输入、下拉菜单和开关等,而矩形边框应使用较小的规格以节省空间。

关键观点4: 表头设计关注高度、背景色、属性列的宽和单元格内布局逻辑。

表头高度通常在28-36之间,背景色根据设计风格和场景决定。单元格内的布局通常为自动布局,包括文本、排序或筛选图标的布局。

关键观点5: 表格主体列表设计的关注点包括列表形式、行高和单元格内排版。

列表形式有基础网格型、分割线型、斑马纹型和卡片型等。行高由内容决定,包括上下间距和内容高度。单元格内排版注重信息识别效率,避免样式内容辨识度差。

关键观点6: 多选和操作设计关注数据的选择和批量操作,独立放置操作选项,避免和其他操作混合。

多选通常在左侧,操作按钮化时需注意权重分配,避免影响用户体验。

关键观点7: 页码控件设计应注意操作体验,频繁换页时可使用带框按钮的设计。

有框设计中,按钮的高应与上方筛选输入框尺寸一致。


免责声明

免责声明:本文内容摘要由平台算法生成,仅为信息导航参考,不代表原文立场或观点。 原文内容版权归原作者所有,如您为原作者并希望删除该摘要或链接,请通过 【版权申诉通道】联系我们处理。

原文地址:访问原文地址
总结与预览地址:访问总结与预览
推荐产品:   推荐产品
文章地址: 访问文章快照