当前位置:首页 > SEO经验分享 > 正文
已解决

如何打造超全面的B端设计规范指南(二):展示组件?

来自网友在路上 1080提问 提问时间:2025-05-28 16:56:38

最佳答案 问答题库08位专家为你答疑解惑

超全面的B端设计规范指南(二):展示组件

二、 展示组件概述

展示组件基本上包括徽标、标签、走马灯、文字提示、气泡卡片、折叠面板、表格等。它们在页面中承担着向用户传达信息的功能,以帮用户飞迅速地定位和浏览数据。

三、 展示组件详解

1. 徽标

徽标常出眼下通知图标或者头像右上角,用来展示需要处理的消息或任务条数。常见徽标类型有带数字样式、圆点样式、许多彩圆点样式。徽标设计时觉得能加上一个颜色和巨大背景色一致的描边,以便徽标和底下内容清晰区分。

2. 标签

标签用于标记事物的属性和维度,以及进行分类。标签常见的样式有描边样式、浅薄色填充样式、描边+浅薄色填充样式、深厚色填充样式。有些标签可支持删除功能。

3. 走马灯

走马灯又称轮播图, 一般用于一组平级内容的并列展示模式,比方说图片或卡片轮播。轮播的方式一般支持用户主动触发或者系统自动轮播。轮播的数量觉得能控制在3~5个之间,一边应清晰展示轮播数量以及当前轮播位置。

4. 文字提示

文字提示如同一个产品类型不同分支优良几个团队完成的时候,能保证产品团队用同一份设计规范飞迅速完成产品原型设计。文字提示一般有如下12种样式,根据页面所处位置进行灵活选用。

5. 气泡卡片

气泡卡片适合文字较许多情况下且支持承载操作。一边填充一般为浅薄色,气泡卡片一般有如下12种样式,根据页面所处位置进行灵活选用。如文字轻巧松的气泡框,鼠标移入则看得出来提示,移出后消失。文字提示应有两不承载,一是不承载麻烦文本,二是不承载随便哪个操作。一般气泡填充为暗黑色半透明, 特殊场景下可用彩色填充,之所以用色块填充是基本上原因是文字太少许信息不明显,需要用巨大色块凸显。

6. 折叠面板

折叠面板常用于左右布局的设计方案中, 常见的做法是将左边的导航栏固定宽阔度,顶部栏固定高大度,对右边的内容展示区域进行动态缩放。

7. 表格

表格在B端设计中非常常见,用于展示一巨大堆数据。在设计表格时应注意以下要点:表格布局清晰,数据格式规范,操作按钮容易于识别。

B端设计规范中的展示组件种类繁许多,个个组件都有其独特的应用场景。在设计过程中,我们需要根据实际需求选择合适的组件,并注意组件之间的搭配与协调,以达到最佳的用户体验。


99%的人还看了