江苏龙网

  1. 首页 > 人文 > >

本丞工业设计|你了解吗？，设计中常见的三种布局排版

通常建议使用几种布局模式 ， 以利用人们对设计的扫描或阅读方式 。 最常见的3种是Gutenberg图 ， Z-pattern布局和F-pattern布局 。 每个模式都提供有关在何处放置重要信息的建议 ， 但我认为这些模式经常被误解 ， 并且在未考虑其真实描述的情况下而使用 。 我希望了解每种模式的含义和原因 ， 然后提供一些其他方法 ， 使你作为设计师能够更好地控制用户的眼睛在设计中的移动方向 。
古腾堡图
在古腾堡图描述了一般模式下眼睛通过在均匀分布的信息游览时的移动 。 直到阅读最后一部分 。
该模式适用于大量文本的内容 。 想一想小说或报纸上的页面 。 该模式并不意味着描述每种可能的设计 。
本丞工业设计|你了解吗？，设计中常见的三种布局排版
文章图片
古腾堡图将布局分为4个象限：
【本丞工业设计|你了解吗？，设计中常见的三种布局排版】主光学区域位于顶部/左侧；
休憩区位于顶部/右侧；
休憩区位于底部/左侧；
终端区位于底部/右侧 。
该模式表明 ， 眼睛将以称为方向轴的一系列水平运动在页面上上下扫动 。 每次扫描都从左边缘开始一点 ， 然后向右边缘一点 。 整个运动是为了使眼睛从主要区域移动到末端区域 ， 该路径称为阅读重力 。
自然地 ， 这是从左到右的阅读语言 ， 而从右到左的阅读语言则相反 。
在古腾堡图中表明 ， 强弱休闲区属于这一读数重力路径之外 ， 并得到最小的关注 ， 除非以某种方式突出视觉 。
重要元素应沿着读数重力路径放置 。 例如 ， 在顶部/左侧放置徽标或标题 ， 在中间放置图像或一些重要内容 ， 在右下方放置号召性用语或联系信息 。
据说遵循古腾堡（Gutenberg）的设计可以与自然的阅读重力相协调 。
这些设计主张可以通过与自然的阅读节奏相协调来改善阅读节奏 ， 并提高阅读理解能力 ， 但没有任何实证证据可以支持该观点 。
同样 ， 古腾堡描述了大的文本块和很少的排版层次 。 一旦创建可视层次结构 ， 图表就不再适用 。 所以请记住下面描述的其他模式 。
Z型布局
正如你所理解的那样 ， Z图案的布局遵循字母Z的形状 。 读者将从顶部/左侧开始 ， 先水平移动到顶部/右侧 ， 然后再对角线移动到底部/右侧 ， 然后再完成另一次水平移动到底部/右侧 。
Z图案有时也被称为反向S图案 ， 这可能表明一个更多的弯曲路径 ， 而不是硬倾斜路径 。 否则 ， 它们基本上是同一回事 。
与古腾堡图的主要区别在于Z模式表明观众将穿过两个休闲区域 。 否则 ， 它们仍将在相同的地方开始和结束 ， 并且仍然穿过中间 。
与古腾堡图一样 ， 设计师将把最重要的信息沿图案的路径放置 。
Z模式适用于需要一些关键元素的简单设计 。 任何讲故事方面的设计都将遵循Z型路径 。
本丞工业设计|你了解吗？，设计中常见的三种布局排版
文章图片
锯齿型
我们可以通过将其更多地视为一系列Z移动而不是一个大Z移动来稍微扩展此模式 。
常识表明这是更现实的做法 ， 因为读者将继续向右移动 ， 然后稍微向下然后向左移动 ， 然后再次开始向右的另一次水平移动 。 这就是我们自然阅读大块文本的方式 。
这一系列的Z运动有时称为Z字形 。 如果我们继续向图案中添加更多的锯齿和曲折 ， 随着Z的对角线部分越来越浅 ， 最终我们将最终产生一系列接近水平的左右移动 。
本丞工业设计|你了解吗？，设计中常见的三种布局排版
文章图片
金三角图案
Z图案还会导致所谓的金三角形图案出现 。 如果先进行水平和对角线的第一次运动 ， 然后关闭形状 ， 则最终得到一个直角三角形 ， 其直角为上/左角 。
页面顶部的三角形区域将是最常看到的区域 ， 该模式表明您需要在其中放置最重要的信息 。


推荐阅读


上一篇：科技圈|家务放心交给它，吉米上手把吸尘器吸尘抛光一步到位

下一篇：TOM |京东C位抢先预约，华为企业智慧屏正式“出道”