百度商桥

400-660-9989

uipower@uipower.com

数据可视化怎么确定大屏的设计尺寸?

发布时间:2020-07-24 14:34:37

护航“数字生活” 进入“数字孪生时代”,大数据时代数据可视化的需求越显得重要。各行各业各种应用场景都能够看到大屏数据可视化的身影。不知道你们有没有注意到大屏有很多尺寸,有些大屏存在这样的问题:显示内容不全或被压缩或者拉伸,画面变形,非常影响呈现效果。

对于大屏可视化的设计尺寸问题,一直困扰着很多设计师,对设计尺寸没有一个正确的认识导致大屏呈现诸多遗憾,也会造成浪费时间返工,今天我们就认认真真讨论一下大屏设计尺寸的问题。

大屏成像原理几乎都是投屏,也就是把电脑屏幕通过有线信号投放到大屏上,电脑上显示什么内容,大屏上就会呈现什么内容。在电脑上的交互操作大屏会同步进行,这就是投屏。

那么现实中大屏和电脑的比列有可能不一样,我们怎么确定我们设计稿的尺寸呢?下面我分两种情况说明。

一、大屏和电脑同比例设计

首先我们强调一点,不可以用大屏的分辨率来定义设计稿尺寸,当大屏的比例和电脑屏幕的比例一致时,要结合电脑屏幕的分辨率来定义设计稿尺寸。

比如电脑屏幕分辨率为1920*1080,那设计稿就可以是这个尺寸,当电脑屏幕是3840*2160(4K)屏时,可以用1920~3840*1080~2160同等比例任意数值。

UIPower案列-UIpower

当使用的电脑是4k分辨率时,即使设计稿用1920*1080的设计尺寸也可以实现,但是最终在大屏的呈现画面清晰度不够理想。原因是开发人员使用1920*1080适配了4k分辨率,这本身就是同比放大的关系,再加上在投放中的画质损失问题就会更明显,不过基本上也算是可以接受的范围内。虽然画质影响不大,但优先级层级上更推荐电脑本身的分辨率3840*2160作为设计稿的尺寸,这样1比1的呈现最能保证画面的质量。

二、大屏和电脑不同比例设计

说完同比例的大屏电脑设计,下面来说不同比例的情况,一般的问题都是出在不同比例的设计上。当大屏和电脑屏幕不同比例时,请牢记一点,一定要确保大屏的展示是正常的,这是必须的。所以我们一般按大屏尺寸设计,一般都是主机直接输出给现场大屏或者使用NVIDIA软件在电脑上调试出大屏分辨率调试。保证大屏的正常呈现,电脑上差点无关紧要。

案例分析

一个4*7的拼接大屏,分辨率13440*4320,比例为28:9,如何配置最合适的电脑比例去屏幕投屏?

UIPower案列-UIPower

如果能找到28:9的最好,但是现实非常困难,定制显示器比例的服务商几乎没有。所以要找最接近的此大屏比例的显示器,最常见的如以下比例显示器:

1、16:9(1920*1080)

2、16:9(3840*2160)

3、16:10(1920*1200)

4、21:9(3440*1440)

根据同比例的分析得出结论,大分辨率的电脑显示器其扩展性更强,所以得首先考虑4k大分辨率的显示器,但16:9与28:9相差过大,如下图所示:

UIPower案列-UIPower

如此压缩程度在操作时会存在一些问题,例如有交互操作的大屏,很小按钮就会被挤压的很瘪,导致点击的准确率下降,影响操作体验。

下图,我们用两个屏幕拼接成一个屏幕称为32:9的比例,这样是比较接近28:9,所以最为合适。

UIPower案列-UIPower

虽然上面两个16:10的显示器比例与29:9最为接近,但分辨率实在过低,缺少很强的扩展性。

结论:

1、要以大屏的比例去设计你的设计稿,保证大屏呈现完美

2、4k分辨率的电脑,优先使用大分辨率来作为设计稿

3、优先使用,最接近大屏分辨率的电脑屏幕比例,去投屏