全部新闻提供最新行业动态,分享前沿设计理念
后台产品设计之详情页
时间:2024-09-12 来源:朝夕友人 点击:

后台产品设计过程中,列表页、表单页、详情页都是非常常见的页面类型,之前已经分别介绍过列表页和表单页,今天咱们来接着说说详情页。

详情页顾名思义就是用来承接详细信息的。在列表页,由于展示空间的限制,我们有时候不得不隐藏一部分数据,只展示最为重要的数据,但是隐藏的数据并非是不需要的数据,因此为了能让用户可以看到完整的数据,就需要一个详情页。

由于详情页通常包含了大量的信息,所以在设计详情页的过程中一定要保证每条数据条理清晰,重点突出,这样才能提高用户的易读性和查找效率。

下面我们将从详情页的入口、形式、视觉展示以及外延功能四个方面来具体介绍一个好的详情页该怎么设计。

1.入口

详情页的入口一般有两种处理方式:

1)放在列表页的操作区

跟其他操作统一放到列表页右侧的操作区,点击,跳转至详情页。

2)列表的标题字段作为入口

另一种处理方式,是将入口放在列表的标题字段上,将列表的标题字段显示为蓝色,表示可点击链接。

这两种处理方式并无明显的优劣,但是在使用标题字段作为入口的时候,需要考虑的是这个标题字段代表的含义是否跟这条数据代表的含义一致。例如一个订单列表,它的标题字段可能是商品名称,那么这个时候,给商品名称上加链接,跳转至订单详情页就不对了。

详情页最常见的入口是在它对应的列表页上,但是由于后台系统各个数据列表之间的数据会有关联,为了能让用户方便的浏览数据,有时候也会在相关数据的地方提供入口,例如商品详情,一般来说入口在商品列表页,但是在订单列表、订单详情也可以提供详情页的入口。

2.形式

详情页的常见形式有如下几种:

1)弹窗形式

当详情页内容不多时,可以使用弹窗形式,减少页面的来回切换,可以提高用户的效率。

2)新标签页形式

当详情页内容较多,同时,在一个列表中,用户有可能需要打开多个详情页进行对比时,可以采用新标签页的形式。

当详情页内容较多,同时,当前页为表单页的情况下,为了不打断用户填写表单的操作,也会采用新标签的形式,例如在创建一个促销活动,选择商品时,想查看商品的详细情况,这时候就可以在新标签页打开。

3)当前页打开

当详情页内容较多,同时,没有比较、操作表单等情况下,可以采用在当前页打开的形式。

在整个系统的设计过程中,可能会存在某些详情页的信息较少,适合用弹窗形式,某些详情页的信息较多,适合用新页面的形式,这种时候根据实际来决定即可,不必非要在系统内保持所有页面的形式统一。

3.视觉展示

详情页的使用,往往是因为有较多的数据需要承载,所以如何放置这些数据才能让用户能更好的查看使用,是一个需要考虑的问题。常见的方式如下:

1)分组展示

将繁多的信息

如果您也有此需求,欢迎咨询我们立即咨询