Interface 设计各种屏幕尺寸的软件接口

Interface 设计各种屏幕尺寸的软件接口,interface,user-interface,usability,Interface,User Interface,Usability,如今,我们有1920x1200和1680x1050这样的屏幕在广泛使用,有些甚至使用2560x1600分辨率,而一些较旧的系统仍然依赖800x600分辨率。我正在编写一个软件,它在1680x1050上看起来不错,但在1920x1200上太小,在1024x768上太大。你对如何设计不同屏幕尺寸的应用程序有什么建议吗 以前,当我们在决议上几乎没有差异时,事情就简单多了,但现在似乎没有好的方法来处理这个问题 我知道这个问题更多的是关于设计/布局而不是编程,但我打赌这或多或少是程序员生活的一部分,所以我

如今,我们有1920x1200和1680x1050这样的屏幕在广泛使用,有些甚至使用2560x1600分辨率,而一些较旧的系统仍然依赖800x600分辨率。我正在编写一个软件,它在1680x1050上看起来不错,但在1920x1200上太小,在1024x768上太大。你对如何设计不同屏幕尺寸的应用程序有什么建议吗

以前,当我们在决议上几乎没有差异时,事情就简单多了,但现在似乎没有好的方法来处理这个问题


我知道这个问题更多的是关于设计/布局而不是编程,但我打赌这或多或少是程序员生活的一部分,所以我在这里发表了这篇文章。

一般来说,你的设计是为了达到你期望的最低屏幕分辨率

你是对的,有很多合理的屏幕分辨率


您可以选择为多个屏幕分辨率设计用户界面,并让应用程序根据实际屏幕分辨率选择适当的布局。

应用程序应自动调整以适应各种窗口大小和屏幕大小。你不应该假设用户总是希望全屏运行你的应用程序。即使您的所有用户都有巨大的屏幕,在某些情况下,他们可能希望并排显示多个窗口

当数据以列表/表格或图形格式(后者包括地图、图表和大多数WYSIWYG应用程序)显示时,设计(如果不是开发)多窗口大小非常容易。显示表格或图形的窗格应随着窗口大小的调整而调整大小。通常,您可以根据需要包括水平和垂直滚动条,以允许用户在当前任何窗格大小内平移数据。用窗口大小调整窗格的大小通常意味着所有数据都可以通过滚动条访问。将数据拆分成页面(例如,像谷歌搜索结果拆分的方式)效果不好

只要用户水平滚动时标识行的第一列仍在视图中,就完全可以接受对表格进行水平滚动(与以散文为主的网页不同)。同样,当用户垂直滚动时,列标题应保持在视图中。对于图形,更改窗口大小通常不应更改缩放级别。相反,缩小时显示更多数据,放大时显示更少数据,同时提供单独的缩放功能

对于以表单形式布局的数据,如果一条记录的字段和标签在窗格中运行,那么实际上没有处理多个窗口大小的好方法,您必须选择一个窗口大小来进行设计。对于可用性,您应该设计为在标准文本大小下,当窗口大小调整到您可能遇到的最低屏幕分辨率时,所有字段都可以看到,而无需滚动。使用选项卡或其他类似控件来适应该空间中的所有必填字段。通常,这意味着设计的应用程序大小为1024x768,假设您的用户可以在笔记本电脑上使用您的应用程序。可以接受的是,表单布局要求以较小的分辨率进行垂直滚动(这在web应用程序中很常见),但对于典型情况,用户永远不必水平滚动。因此,在您的情况下,如果您的大多数用户使用台式机,并且只是偶尔使用笔记本电脑,那么您可能需要为1024x1050进行设计。测试用户是否意识到在使用低分辨率时必须滚动,然后再继续此操作。如果您希望用户在查看其他窗口时定期使用该窗口(例如,它更像一个属性对话框),则可能会对窗口大小设置其他限制

对于表单布局,调整窗口大小时,文本大小或字段之间的空格不应改变(尽管允许用户显式增加文本大小是个好主意)。如果调整的尺寸大于设计尺寸,则只需在右侧和底部添加空白页边距即可。换句话说,为表单布局调整更大的尺寸并没有多大意义。没关系。至少您的一些用户会将未使用的屏幕空间用于其他用途(例如,另一个窗口或应用程序)。拥有大屏幕的真正超级用户可以并排打开同一窗口的两个实例,并让每个实例显示不同的选项卡,这样他们就可以同时监控尽可能多的内容


如果调整的大小小于表单布局的设计大小,则会导致出现滚动条,并提供对不再显示的字段的访问。如果您选择了可能遇到的最低屏幕分辨率,则后一种情况应该是边缘情况。

您使用什么技术构建界面?您是在构建传统的桌面应用程序,还是在构建web应用程序?或者是别的什么?@Greg Hewgill:我正在构建一个复杂的web应用程序,它利用JavaScript、HTML(5)、CSS(3)和PHP。为所有不同的屏幕大小设计不同的布局不是有点复杂吗?与随着屏幕变大而使界面变大相比,这种方法怎么样?@Tower:随着屏幕变大而使界面组件变大是一种选择。有时,更好的选择是使用更多接口组件的不同布局。这取决于用户界面。