面板在对象展示中的应用
人人都是产品经理社区推出产品经理培训课程，让BAT产品总监手把手带你学产品吧！ 点此查看详情！
列表的展示方式，在工具类的产品中，类似于万金油的感觉，但凡遇到同一个类型多个对象的展示界面，用列表总是能够解决掉，前端处理的快~设计上也不需要花费太多的心思，可谓是一举多得~例如：
然而~列表这种展示方式，正是因为简单，所以存在着一些局限
展示信息的局限
一个界面最多能展示的列数是固定的，如果列数过多，就会让整个界面看起来像北京的地铁站，满满的全是数据。为了保持界面的整洁性，设计师在处理列表界面时，务必会考虑列间距，展示哪些必要信息等，有时候甚至会因为必要信息而难以取舍。
在这个嘈杂的社会（呵呵~），即便是设计师整理汇总了关键的信息，也不能保证能够 直观 的展示对象中存在的各种信息。（我想强调直观这一点，是因为直观对于工具类的产品来说，意味着效率）
无法有效的减少用户的操作路径。
当然，如果对象内部的操作路径本身就很简单，这样的设计也是无可厚非，但是如果对象内部仍然存在着更深入的操作路径，就需要一种能把内部路径外置的方式来加快用户的定位。
最近在做（或者说重构？）一个工具类型的产品，刨去产品固有的第一级和第二级的菜单，单单“应用”这个对象的一个二级功能，其内容就包含了3-4层的结构~（擦来~），也就是说，是一个对象包含了多个对象，简单绘制结构如下：
那么，如果用户需要查看某次部署的详细记录，他需要应用-环境-具体环境-历史记录-历史记录详情这样一个路径走过来~而就对象这个层级而言，应用属于一级对象，多个环境属于二级对象，如果所有的对象都通过列表展示，用户的确是需要这样一个路径的操作。
面板设计的尝试
之前在做一个XX的产品的时候（当然也是以应用作为一级对象）就曾经尝试通过面板的方式多样化的展示应用的内容~当时只是想增加应用的展示信息（demo比较简陋~）
第一次尝试虽然没有成功实现，不过根据当时同学们的表现可以看出大家对这种方式还是挺赞同的。
于是这次，有了第二次尝试的机会，我尝试把应用的关键信息通过面板的方式展示出来，并能够减少用户的操作路径，哪怕只是减少一层。
如下（工作数据，所以打了一下码）：
或者
第一种方式的设计参考于
（这种常见于社交类的网站的设计，拿来用到工具类型的产品设计中感觉也还不错呢~）
第二种设计还是基于第一次尝试的设计，进行了略微的改造。
而在应用中的环境页面，也进行了类似的改造：
为什么引入这类面板替代列表？
- 直观，不仅能够展示应用自身的属性信息，还可以将应用中不同功能的关键信息都放置在面板上，用户可以在不深入到应用的前提下获取更多的信息。
- 快捷，内部功能键外置，不需要一层层的深入，间接相当于快捷入口啦~
- 信息多样化，面板相对于列表的优点就是展示性强，图表、数据、标签.....在这里都可以尝试。
- 可塑性强，对于面板中央这么一大块的留白，设计师可以充分的发挥自己的优势来丰富应用的展示方式。
但是，面板相比于列表，会占用较大的空间，导致一个界面上展示的对象数量会变少~这种情况如何解决？
我想到的是通过视图的切换来实现对象的列表与面板展示方式的切换，就如同mac 文件夹中的视图选项：
正文到此结束
热门推荐
相关文章
近期评论
-
文章和留言都翻到11页了 没有OOM
-
-
朋友，翻页到11页，及以后，会出现OOM，无法访问
-
-
搞个gitee的项目
-
-
版本号是多少，你可以下载哪个代码仓库，jdk选1.8 直接跑就行
-
-
-
Loading...
![[HBLOG]公众号](https://www.liuhaihua.cn/img/qrcode_gzh.jpg)
