• 回答数

    4

  • 浏览数

    159

成都蜀道装饰
首页 > 学术论文 > 杂志网格排版

4个回答 默认排序
  • 默认排序
  • 按时间排序

小馋猫儿richard

已采纳

第一:什么是网格?在掌握网格的设计方法之前,咱们得先知道,到底什么是网格?为什么会有网格系统这一说?网格系统的存在,是为了解决设计什么样的问题?实际上,说到网格的历史,得追溯到文艺复兴时期。为了达到美的极致,艺术家从绘画中找到了完美的比例分布图,并尝试以辅助线来实现 「完美」 构图的方创建了一个这样的图表,固定版面中内容的结构及边距,来实现完美的布局。所以,网格的存在,最主要就是为了解决设计美感的问题,通过网格让杂乱无章的信息能通过一个较好的结构来进行约束,保障信息高效传达的同时,充分提升版面设计的美感。1. 网格的结构网格实际上,是一种结构,通过线的垂直或者相交,来构建一个参考界线。通过这个参考界线,我们可以在一个单一的容器中,把容器里的内容,以参考线进行对齐,来有秩序的布局组织并罗列分布。从而实现一个较好的视觉秩序感,提升阅读效率的同时增加美感。因为网格是一种结构,所以网格本身是不一定可见(少部分作品会使用网格做装饰),但这种结构会映射到内容元素的布局,影响信息的排列美感及阅读效率。所有在有确定了网格的边界和约束后,设计师就可以根据网格,来对内容的位置比例,进行调整约束元素的坐标,达到一个比较理想的版式设计。环顾我们的生活周围,实际上也能看到很多网格的运用场景。比如我很喜欢的这套宜家网格柜子~不过网格目前运用的最为广泛的场景,还是在书籍、杂志的版式设计中。实际上,网格系统诞生的初衷也是为了解决印刷制版的问题。所以从印刷术的兴起,网格就开始诞生了 ,并演绎的越来越丰富,越来越系统。2. 网格的制版在平面设计中,网格系统更常见,特别是用于书籍的装帧及印刷场景。所以如果有从事平面设计或者是从事视觉相关行业的同学,我推荐有机会也可以读读下面这本书。这本书是由瑞士的设计师约瑟夫·米勒–布罗克曼 编写的《平面设计中的网格系统》,文中主要介绍了在平面设计中,网格的功能和使用方法,旨在为平面和空间的设计师们提供一个实际的工具,让他们可以从概念、组织结构和设计上更有效、 自信地处理和解决视觉问题。书中很多方法及版式,基本上可以现学现用,掌握起来也非常方便。「事实上,绝大多数的设计师都不知道、也不理解为什么要建立这样的一个秩序系统。所以,如果想要合理、功能地运用网格系统,那就必须仔细地研究网格的所有原理。只要不嫌麻烦,任何研究网格的人都会发现,在网格系统的帮助下,他都能更快地解决设计中的问题,并让设计更具功能性、逻辑性和视觉美感。——约瑟夫·米勒-布罗克曼 」 第二:网格的组成部分讲了网格的历史,接下来咱们就开始讲正式的网格使用方法啦。目前网格设计主要运用在两大场景,一个是印刷读物,比如海报、书籍、封面等,而另外一个就是电子设备的荧幕,比如 iPhone、iPad、Windows 等,常见于 APP 设计、H5设计及 Web 设计中。在这些不同场景的网格设计中,都会有一些很通用的基础组件部分,如边距、列宽、水槽、以及交叉的模块,正是这些基础的元素组成了复杂的网格系统。所以在使用网格设计方法做图之前,我们需要先了解每个元素的具体含义以及其具体用法。1. 网格边距网格边距指的是内容外部边缘距离容器的空白距离,在纸质设备中,容器就是纸张的大小,在界面设计里,容器就是设计稿的尺寸分辨率。这个边距,一方面是为了信息不超出安全距离,二方面也主要是为了让内容看起来,能更加的聚焦在中心区域,以防信息太过于贴边导致的不利于阅读。在APP设计中,也会用到边距这个概念。基于@2x尺寸,很多APP内容到屏幕的边距,都采用的是24px,比如淘宝、支付宝、微博等。但也有不少的APP采用的是32px的边距,比如微信、QQ、知乎等,这个大家可以截图,缩到750的宽度,自行量~~当然,文章后面也会详细讲这块怎么定比较好2. 列宽及水槽除去边距,在内容区域的中心部分,网格主要由列宽及水槽组成,列宽就是每列中间的宽度,水槽就是每两列的中间预留区域。列决定网格的复杂程度,而水槽决定内容的疏密程度。3. 交叉模块这个指的就是网格中的交叉区域,实际上是一个空间单位。我们可以把固定的图片或者是段落,直接填充在这个模块里。当然,后面也有案例来解读。所有的网格,基本上都是由上面的基础元素组成。正是这些,组成了庞大且复杂的网格系统 Gird System 第三:三种常见的网格在我们的设计当中,目前这三种网格最为常见,且这三种也能满足我们日常的大部分需要。1. 单列网格在咱们目前设计中,其实最常见的,就是这种单列的网格。这种单列的网格大多数以水平,或者是垂直的形态出现。比如你看到的现在咱们发的这篇文章,实际上它就是一种以水平形态的单列网格所组成,文字与文字中间的距离,就组成了水渠,它也是目前最简单的一种网格。这种其实我们用文字的行高,就可以控制了,不需要设置特别多的信息。保证每一列的距离是一样的即可。2. 多列网格多列网格,顾名思义就是有多列的网格,会包含交叉关系。实际上,创建的列数越多,你的网格在使用过程中覆盖面会越广,能对齐的内容也会越多,不过处理不好的话,信息也会越碎。咱们根据这个网格,简单排一些文字,看看效果再把线去掉,顺便加点颜色看看,再修饰一下细节~~其实还是比较的简单,当然,我这个只是随意拼凑,小伙伴们可以在收藏本文后,抽时间自己动手试试~~相信肯定会比我这个好3. 交叉网格交叉网格也比较好理解,其实就是基于水平及垂直领域的交叉网格。这种网格的节奏感非常好,适合在海报、杂志、封面版本中使用。包括在部分App以及Web的场景中,也可以使用这种布局方式。比如:是不是明白许多啦,再强调一句,光看是不行的,这里我鼓励各位小伙伴们,多动手进行练习尝试,只有动手了,这些知识才能转化成你自己的能力!加油,奥利给

238 评论

I小蘑菇I

Wallpaper*是全球比较有影响力的设计生活杂志品牌。自1996年创刊以来,Wallpaper*便肩负着确定生活潮流、传递设计最新资讯的责任,更致力推进创意与新思维,以设计改变世界的面貌。图书馆里有,只是很偶尔的翻一翻,没有太多感觉。但还是觉得它的读者很多,有一定影响力。wallpaper毕竟是一本商业大众杂志,设计也就比较接地气了。版式较为规整,每页放的内容多,它也是会和不同设计师合作来进行内页插画的创作。是由创意单位伦敦的CHAMP CREATIVE与东京分部联手打造的 Ala Champ,是一本基于图形和摄影的半年刊文化杂志。杂志整体设计偏日式,比较简洁,精致,是新手排版很好的参照对象。

265 评论

张小繁繁繁

框架网格仅针对文本框而言。它是在ID中作为对文本的一种通用对齐方式。当你对文本框右键点击-启用网格框架之后就可以对此框架做进一步设定,你可以在再次的右键中找到框架网格的设置。它的功能是强制忽略在此网格框架中文字其原本设定的行距、字距等设置,而强制性地将每个文字,以框架网格中的一个网格作为占位单位来设定位置。这样的做法使很多东方象形文字的排版严谨有序。配合版面网格可以实现方正飞腾的网格排版方式。

203 评论

Lucy…黄小猪

您可能会有错误的印象,认为一旦找到正确的字体组合,就可以完成最具挑战性的任务。但是,正确放置文本以便用户可以扫描并轻松找到必要的信息,这与选择字体一样重要。内容的逻辑组织提高了可读性并增强了品牌的可信度。 网格帮助设计师设定节奏并计划他们想要放置的内容以及他们希望用户看到的顺序。您可以选择阻力最小的路径,并选择大多数设计软件(如 Figma 或 Sketch)提供的预定义网格。或者,您可以创建适合您项目需求的自己的网格。为此,您可能会问自己以下问题: 我希望正文跨越多少列? 如何设置垂直和水平节奏(这意味着应用排水沟和边距)? 我要为什么设备设计,或者网格应该有多灵活? 找出这些问题的答案将帮助您找出适合您项目的网格。网格  是指不可见线(垂直或水平)的组合,将页面划分为多个部分并帮助组织内容,包括类型、图像和 UI 元素。本质上,网格管理空间和信息,鼓励一致性和视觉层次。 标题、副标题、正文、图像和其他内容的清晰和合乎逻辑的组织使用户更容易阅读和理解信息,而不会影响他们的记忆。此外,这种有序性可确保数据的可信度并增强信心。 网格被错误地认为必须是刚性和对称的。在设置网格时,保持平衡与和谐的原则更为重要。毕竟,自然界中最美好的事物并不是完全对称的。本质上, 网格的 解剖结构 由两个基本的垂直组件组成—— 列 和 排水沟 。列定义了在网格中容纳内容的最宽区域,而装订线是指列之间的空间。从技术上讲,每个网格也有边距——内容外边缘的排水沟。 列数越多,布局就越灵活。另一方面,它变得更难管理。您可以让您的内容决定列数或坚持传统数字——台式机 12、平板电脑 8 和移动设备 4。 为了在水平和垂直元素之间实现良好的平衡,建议保持间距宽度与基线高度(台式机和平板电脑)或行高(移动设备)的一半相同。本质上,网格只是一种工具,在设计时应牢记这一点。 网格应 该 围绕  内容 构建,而不是相反。 [6]  否则,您可能会限制自己和您的设计,而不是为您的产品创造独特和量身定制的东西。 确立你的目标 想想你的品牌个性、你想要唤起的情感,以及你认为你的产品将涵盖的用户需求。 选择和组合字体 根据前面的步骤,您可以选择能够传达正确情绪并帮助您的用户轻松浏览产品的字体。 优先考虑您的内容 根据内容组及其优先级,设置您的网格:选择列数并定义垂直和水平节奏。基线网格  是在您的设计中均匀分布的水平线(基线),可用于水平对齐内容和排版。设计师还使用基线网格来确保元素之间有足够的垂直间距。 Material Design 指南使用基线网格来确定字体大小和行高配对,以及边距和填充。 虽然基线网格可能是静态网站的一个很好的解决方案,但它们并不总是对用户不断添加新媒体或内容的动态用户界面有所帮助。这里最好的方法是专注于在页面上保持清晰、一致的垂直节奏(行间距和文本框之间的间距)。多列布局  是指一个或多个由排水沟分隔的垂直内容块。您更有可能在报纸和杂志中遇到这些传统的排版安排。他们使用栏来分解故事中复杂的长文本段落,以提高可读性和可浏览性。 但是,多列布局并不是破坏文本内容的最佳匹配。一篇文章分成多列需要大量的上下滚动,使得用户很难关注主题。 一个更好的解决方案是对单个文章使用单列布局。为了提高其可读性,您可以将文本分成段落,确保它们之间有足够的间距。有了更多的列,布局变得更加灵活,可以安排不同的内容。例如,一些杂志使用两栏布局,将文本放在左侧,将图像放在右侧。柱状网格将页面分解为垂直部分,而 模块化网格 则添加了水平细分。相交的列、行和排水沟形成了一个单元矩阵——或者设计师所说的模块。 模块化网格比基线网格提供更多的灵活性,允许设计师将布局元素和排版锚定到特定的节奏。您可以根据需要以多种方式排列文本,将其扩展为一个或多个模块并按照您喜欢的方式对齐它,并且不一定必须将其设置为左对齐。荷兰平面设计师、字体设计师和排版师 Willem Hendrik Crouwel 曾经说过:“网格就像足球场上的线条。你可以在网格中玩一场精彩的比赛,也可以踢一场糟糕的比赛。” 不可否认,网格是设计师绘制布局计划的绝佳工具。但是,您的眼睛和常识应该是安排内容时的主要工具。 在设计产品时,不应该受到网格的限制。始终牢记就近原则,如果您需要分隔不相关的项目或减少相关组之间的空间,请随意打破网格。您还可以使用非常规的文本对齐方式或不跨越所有列的主图来创造一种意想不到的扭曲,从而吸引用户的注意力。

241 评论

相关问答

  • 杂志排版分析

    1、秩序 版式设计的第一步是对页面内信息的逻辑排序。 确定这个逻辑,然后用相应的设计语言兑现之,这是“设计”这个词的本意。 如果面积不够,就增加页码,如果画面太

    大尾巴狼外婆 7人参与回答 2023-12-10
  • word杂志排版

    根据我公司内部报刊编辑的经验,建议使用WPS软件。 在编辑内部报刊方面,WPS软件其功能非常强大。而且它与WORD及EXCEL办公软件相互兼容,用WORD及EX

    蓝色泡泡沫 4人参与回答 2023-12-10
  • 杂志文章排版格式标准

    目前国际上最常用的最专业的排版软件是Adobe公司的 InDesign,它具有强大的电子出版和网络出版的制作功能,可制作出令人满意的纸质出版物、电子出版物等。I

    董小小小姐 5人参与回答 2023-12-07
  • 散文杂志排版

    为了发表都要投稿到期刊、杂志社,这个时候论文就要经过审稿,才能决定是不是适合发表。壹品优刊网告诉大家论文审稿周期不一,核心级期刊审稿时间最长,时间大概是3-6个

    芝士大人 7人参与回答 2023-12-10
  • indesign排版杂志

    书籍和文档不是并列关系,在indesign里做东西都要用文档来做。书籍只是针对你做的一个项目页数很多,或者内容很大,所以要把文件分成几个文档来做,然后再用书籍这

    cherryhu111 3人参与回答 2023-12-06