Layout a「;“语言”;用于描述html页面所需的布局动态

Layout a「;“语言”;用于描述html页面所需的布局动态,layout,documentation,Layout,Documentation,我正在寻找一种工具/标准/概念/约定,它可以改善设计师和开发人员之间在描述UI元素及其布局方面的沟通 我将尝试举例说明: 考虑一个设计,显示一个200×200像素的红色盒子,里面有一个100×100像素的绿色盒子。 这很清楚,只要没有什么是动态的, 但当你想解释任何动态变化时,这已经不够了 如果设备的尺寸是300×400像素,那么考虑一下这个设计应该发生什么……而不是200乘200 可以解释为: 将200 x 200正方形固定在300 x 400区域的任何一个角上,留下不平衡的白边 保持200

我正在寻找一种工具/标准/概念/约定,它可以改善设计师和开发人员之间在描述UI元素及其布局方面的沟通

我将尝试举例说明:
考虑一个设计,显示一个200×200像素的红色盒子,里面有一个100×100像素的绿色盒子。 这很清楚,只要没有什么是动态的, 但当你想解释任何动态变化时,这已经不够了

如果设备的尺寸是300×400像素,那么考虑一下这个设计应该发生什么……而不是200乘200

可以解释为:

  • 将200 x 200正方形固定在300 x 400区域的任何一个角上,留下不平衡的白边
  • 保持200乘200的正方形与300乘400的正方形居中,会留下平衡的白边
  • 拉伸红色区域以适应新的可用区域,但使内部正方形保持原始大小不变
等等

这不是理论上的问题,这是为需要支持多种语言的应用程序设计UI的真正问题。 按钮的尺寸可能会因使用不同语言时按钮中包含的文本的变化而变化

我正在寻找一个(图形?)标准,用于显示锚/页边距/最小或最大尺寸、相对位置等

能够轻松传达信息的东西,例如:
这两个按钮的每侧边距应为5px,中间区域应至少为80px或更大,以容纳文本。两个按钮最终应具有相同的大小(通过将它们全部增加到最大按钮所需的大小)。

我在一家机构管理开发人员和设计师。我们确保我们的设计师为每一个可能的(设备)屏幕进行设计。如果用户界面是为个人电脑设计的,开发者会对布局如何从个人电脑到手机再到平板电脑产生疑问。大多数设计师都意识到这一点,并从一开始就为所有屏幕进行设计


对于您假设问题的具体答案,使用尺寸百分比将有助于将设计从大屏幕转换为小屏幕,并比使用绝对像素尺寸更好地保持设计美感。

我在一家机构管理开发人员和设计师。我们确保我们的设计师为每一个可能的(设备)屏幕进行设计。如果用户界面是为个人电脑设计的,开发者会对布局如何从个人电脑到手机再到平板电脑产生疑问。大多数设计师都意识到这一点,并从一开始就为所有屏幕进行设计


对于您假设问题的具体答案,使用尺寸百分比将有助于将设计从大屏幕转换为小屏幕,并比使用绝对像素尺寸更好地保持设计美感。

有趣,尽管可能更适合我,但我不知道它的存在。我也希望开发者比设计者更关心这一点。但是看到我在这里(还没有)得到任何回应,我有没有办法把Q移到graphicdesign.stackexchange.com?很有趣,虽然可能更适合我,但我并不知道它的存在。我也希望开发者比设计者更关心这一点。但是,鉴于我在这里(目前)没有得到任何回应,有没有办法让我将Q移到graphicdesign.stackexchange.com?