版式设想底子常识整理

浩渺小竹排浩az

来历：知乎
1 根本常识点

1.1 版式设想的利用处景:

版式设想一般可分为印刷品和互联网产物（移动利用、web界面、硬件装备系统界面等）两个方面，包括书籍排版，海报招贴，宣传单页，banner、运营图、作品展现页等等。
1.2 根基概念

1.2.1 款式的八要素：

视觉度、图版率、笔墨的腾跃率、照片的腾跃率、网格的拘束率、版面率、组成的范例、字体印象。
1.2.1.1 视觉度：

可以了解为表示力、视觉张力。明快的插图，给人激烈的印象，视觉度就高。空灵/恬静的照片、纯笔墨等，视觉度低。
视觉度高，给人的感受就像是邻家大妈，加倍亲热、更具亲和力、“接地气”。合适招募、吸引人介入的活动宣传。
视觉度低，与人有间隔感、看上去高冷、专业、没有感情。合适奢侈品、“高峻上”的产物风格。
版式设想中，要根据想要表达的气概气质的差别，挑选合适的视觉度。



视觉度

1.2.1.1.1  布景纯洁度
图片的清洁、整洁水平。纯洁度高，空气恬静、舒缓；纯洁度低，则显得混乱、喧哗。与视觉度意义分歧。
1.2.1.2 图版率：

除笔墨外的视觉元素（图片、插图、装潢元素等内容）所占面积与整体版面的比率。如纯笔墨书籍的图版率为0%，全数是图片的杂志图版率为100%。
图版率高，整体加倍活跃、热烈，合适快速阅读，合适运营类、报表类等设想（气概也与图片内容强相关，假如图片自己留白较多、气概素雅，则只会放大图片自己的气质，整体气概气质与图片的气概气质更接近。）
图版率低，则加倍恬静、高雅，偏向于细细阅读，合适阅读、文档等利用的设想。
进步图版率的方式（目标都是增加图形元素、增加图形占比）：
将图片反复化、增加图片数目/面积；
添补底色、增加色彩面积；
将视觉信息图形化（如数字放高文为图形、利用数据图表取代数字、利用图解或标记等增加说明性）；
增加图形（点线面）、图标、纹理、图案作为装潢、布景；
信噪比
首要信息在整体中所占的比例。与“数据墨水比”类似。重点都是夸大弱化朋分线、帮助元素等，突出首要信息、首要指报。



图版率

1.2.1.3  jump（腾跃）率/优先率

各部份内容所占尺寸的比率。优先率高，各部份内容尺寸差别较大，具有鲜明的对照，页面内容富于变化，具有动感、节奏感；反之，则给人沉稳、牢靠的印象。
腾跃率包括笔墨腾跃率和图片腾跃率。别离指笔墨尺寸之间的对照和图片元素之间的对照。
对于图片而言，图片内容自己的气质和腾跃率一路，决议了全部版面的活力/沉稳。即视觉度较低的图片，尺寸放大，也不能表现活力，而是更夸大画面的恬静空气。是以，图片的选用与整体的气概气质也应当要和谐分歧。
对照片而言，大面积宜用部分特写照片，小尺寸用全局照片。夸大巨细对照，构成有腾跃间隔感的空间，视野移动时会有深度变化，加倍错落、节奏富于变化。



jump（腾跃）率/优先率

1.2.1.4 网格拘束率

起头版面设想之前，首先应当肯定结构网格，即栅格系统。
原则上，版面中的元素都要根据网格线放置。这样的版面，是被网格约束住的版面。大概疏忽网格线，自在设置，构成离开网格约束的版面。
约束率高表现理性、庄重、松散，男性化，合适严厉、传统的活动。约束率低则加倍自在、随性、女性化，合适轻松、愉悦的空气。
依照版式设想的流程，通常为先建立条理/次序：依照栅格系统，根据信息条理排布各个元素，然后是增加变化：按照整体的气概定位适当地制造对照、跳出网格约束。   
照片的外形包括角版和挖版。
角版：根据网格约束，四四方方，稳定、威望，合适重要的人物、松散的计划图。
挖版：退底，去除照片的布景，只保存主体，合适具有亲和力的人物、与布景更好融合的主题。打破网格的约束，加倍自在。
角版和挖版的分歧搭配、对照，可以在松散、规矩与自在、兴趣中调理整体的空气。例如，假如整体利用角版而显得过于拘束，可以将某些照片处置组成挖版，增加版面的自在度、透气性。



角版与挖版

网格系统/栅格系统
网格系统：经过竖向和横向的参考线，将页面朋分红巨细分歧的格子，经过网格作为参考来构建具有次序感的版面。
运营设想中，一般利用既有横向又有竖向参考线的穿插网格。
网页设想中，一般只要竖向的参考线，分为内容部分的列和用作间距的水槽，经过构建栅格来划份内容与留白。
栅格系统的感化：整理版面内的元素，让版面的结构更有条理、元素之间的关系更慎密。经过设定例则，在同一系统内部的分歧页面之间构成同一。
栅格系统的要素：版面的宽度、列数、列宽、水槽（Gutter）、平安边距。



栅格系统要素

常用的栅格系统：
960栅格系统（内容宽度为960px，分红12列，列宽60px，水槽20px）
8pt栅格系统（列宽、水槽、平安边距等均采用8的倍数）
1.2.1.5  版面率：

版面率是指一切内容在整体画面中所占的比率。版面率比力高时，留白较少，页面整体的操纵率比力高，让然感受丰富、热烈；反之，则给人一种安好、高雅、高真个感受。



版面率与气概

版心：
版面中，去除天头、地脚、页边距后内容所占的地区。



版心

留白
留白：版面中的空缺地区，负空间。
留白的感化：
    01 减轻榨取感；
    02 改变页面整体的印象：留白多——版面率低，高端、冷淡；留白少——版面率高，热烈、廉价；
    03 表示出页面内容之间间隔的分歧；
    04 赋予页面组成以变化，增加节奏感；
    05 使页面获得扩大，给人意犹未尽的感受；
    06 突出主体，主体四周留白大，所占的视觉强度也会增加。
留白的留意点：
留白比力完整、法则，页面会加倍清楚整洁。
1.2.1.6  组成的三品种型/笔墨对齐方式

笔墨的对齐方式：齐行型&齐左型、居中型、自在型。
齐行型&齐左型：齐行型两头对齐，公道的、标准的、面向贸易的。齐左型及只是左侧对齐，比齐行型加倍自然、自在，比自在型加倍标准、标准。
居中型：居中对齐，文雅、高品格、有风格。
自在型：没有一定的对齐中心，偶然也根据图片而变化排列的外形，或与图片穿插、堆叠。自在的、随意的、有活力的。



组成的三品种型/笔墨对齐方式

1.2.1.7  字体印象

字体的范例、字重、字号、字距、行距、色彩、字体腾跃率等，城市影响整体的气质。
如无衬线体感受清洁、现代、繁复；衬线体则表现高雅、古朴、时髦的气质；粗体字意味男性化、气力感，细体字意味女性化、时兴、纤细。



字体印象

1.2.2 外型八原则

明白主题、分隔副主题、群化（组合化）、暗昧给人不安的感受、整理流向、空缺时主题的领地、抑制四角、操纵版心线。
明白主题：分清主次，区分层级，使空间整洁。明白主题，可以让视野有焦点，而不会无处安置，可以增加安宁感。
分隔副主题：主题、副主题都应当有各自的空间。整体才会加倍平衡、透气。避免压制、狭隘。
群化（构造化）：四大原则中的构造原则，格式塔心理学的接近/邻近律。将同一类信息构造到一路，让页面信息更有条理，经过形式反应信息结构。
暗昧使人不安：元素之间的关系需要明白，如照片和对应的说明笔墨、段落与段落之间的关系、分歧位置元素之间的关系。
整理流向：视野的移动偏向，元素之间应当只管调和，让视野的移动流利、有序，而不是相悖、混乱。
空缺是主题的领地：留白的巨细，反应了元素的重要水平，留白越大，元素的重要性越强。
抑制四角：四角是版面中最重要的部分，只要在四角设置小的形状，就能安宁全部版面。
操纵版心线：版心线是隐藏的基准线，沿着这条线停止设想，可以轻松稳定版面。
1.2.2.1 缔造形状的窍门

节奏：在一味的反复中构成差别，构成变化。
对照：尺寸、粗细、色彩等的变化，构成变化。
重点：对于重点的内容，利用差别化的形式来突出，强化主题。
比例：操纵斐波那契数列、黄金朋分比、白银朋分比等，让元素之间的变化更有纪律。
平衡：版面的重心应当稳定，增加牢靠性、相信感，而不会让人感受不安。
融合：即元素之间的照应，让整体关系加倍慎密而不是显得疏松、拼集。同时元素之间应当发生联系，非论是形式、偏向、位置还是前后关系上，才像是一个整体。
款式八要素、外型八原则参考：《七日把握版面设想根本》。
1.3 陌生化

俄国形式主义活动的魁首人物维克多·什克洛夫斯基在《作为手法的艺术》中提出了奇异化的概念，就是说在表达的时辰，不但要关注表达的内容，也要关注表达的形式。经过陌生化的视角所显现的工具，即即是之前已经很熟悉的事物，也能激起人们的爱好，叫醒人们心里的感受。
即用新奇的形式表达人们熟悉的概念，也会让人有线人一新的感受，会更有吸引力。
1.4 视角

俯视 - 物体味显得高峻、表达尊重，威望
平视 - 和蔼、普通的空气
俯视 - 自在、掌控全局的感受



视角

以常规的视角看物体，人们比力熟悉。以很是规的视角看物体，会给人新奇、怪异的感受，构成陌生化表达，从而显得更有创意。
1.5 四大原则

《写给大师看的设想书》中，提出了版式设想的4大根基原则：对照、对齐、密切、反复。
1.5.1 对照

1.5.1.1 对照的意义

对照可以突出视觉焦点，构成节奏感。让页面加倍错落、更有条理、变化，提升笔墨腾跃率、图片腾跃率，增加版面的视觉度，给人以更强的视觉印象，从而避免呆板、无趣。
对照的目标是突出首要元素，所以首先应当对信息的层级停止区分，然后经过强化与其他元素的差别来突出重点。
冯·雷斯托夫效应（Von Restorff Effect）：也称为隔离效应（The Isolation Effect），在多个类似的工具中，与众分歧的阿谁比别的的更能让人记着。
1.5.1.2对照的形式：

空间：布满-空置、积极活跃-悲观被动、进步-前进、近-远、二维-三维、封锁-开放
形式：简单-复杂、美-丑、笼统-具象、清楚-模糊、多少形式-有机形式、直线-曲线、对称-非对称、完整-破裂
结构：层次清楚-紊乱无序、排列成序-随意放置、衬线字体-无衬线字体、机械-手工、麋集-稀疏
纹理：细-粗、平滑-粗糙、反光-哑光、滑-黏、锐-钝
位置：顶部-底部、高-低、右-左、上-下、前-后、有节奏-随意、零丁-分组、接近-阔别、中心-边沿、整洁排列-互不关联、内-外
偏向：垂直-水平、垂直线-对角线、向前-向后、稳定-活动、内聚-分离、顺时针偏向-逆时针偏向、凹形-凸形、正体字-斜体字、正-反
尺寸：大-小、长-短、窄-宽、扩大-收缩、深-浅
色彩：黑色-彩色、亮-暗、暖色-暖色、明度-暗度、自然-人造、饱和（深色）-无色（素色）
密度：通明-昏暗、浓密-淡薄、液体-固体
重力：轻-重、稳定-不稳定
（摘自《平面设想道理》一书）
笔墨：字体、字号、字重、字间距、行间距、偏向、色彩、纹理、真假、描边/添补

1.5.2 对齐

对齐可以发生次序感，让人感觉内容不是混乱无章的随意处置，而是经过经心放置的，看起来松散、专业。

《社会性动物》：在一个简单的演示中，阅读用清楚易辩的字体打印出来的论点的人，比阅读一样的内容但用模糊字体打印出来的人更轻易相信他们所读过的工具。

设想是一种表达方式，经过对照、清楚大图等形式，与要转达的信息一路，来构建整体的专业感、可相信感。
同时，对齐让分离在页面中的元素构成联系，增加整体感。经过对齐所发生的“无形的线”会指导用户的视野。



对齐

1.5.3 密切

如同格式塔心理学的接近法例所说，同一模块的内容间隔上应当更亲近，这样人材会把他们当做一个整体。
在UI设想中，经过间距的巨细来分别分歧的内容，可以削减朋分线的利用，削减视觉干扰，让页面的内容加倍突出。



密切

1.5.4 反复

格式塔心理学的类似法例，人们的眼睛常常将设想中类似的元素视为完整的图片、外形、组合，即使这些元素是分隔的。
各元素之间尺寸、款式、色彩等一种或多种属性的分歧性，可以相互照应，让版面加倍同一，构成整体感。反复也可以构成节奏，增加画面的韵律感。
在反复中增加变化（巨细、色彩等），可以避免过度反复带来的单调。在反复的“度”中更好地平衡。



反复

1.6 平面组成相关

组成是“组装”“组合”的意义，是研讨“要素”和组合原则、思维方式。
平面组成的概念要素：点、线、面。
元素之间的关系要素：偏向、位置、空间、重心。
形象是指视觉所能见到的事物的外形、特征等，或是设想中借以表达一定寄义的视觉要素。形象的存在方式：分手、打仗、覆盖、透叠、结合、减缺、差叠、重合。



形象的存在方式

组成的手法：反复、突变、发射、近似、变异、对照、集结、特异、空间与冲突空间、朋分、肌理及错视等等。
反复组成：一个或一组不异的单元形不竭反复出现的组成。纯真、安静、同一、有趣。
突变组成：单元形象与编排遵守某一方面做纪律性变更的组成。包括：形的突变、巨细突变、数目突变、位置突变、偏向突变、空间突变、重心突变等。
发射组成：单元形或编排环抱着一个或几其中心所作的组成。包括：齐心发射、离心发射、向心发射。
对称组成：单元形或编排呈对称关系。包括点对称、线对称、近似对称。
平衡组成：对称组成以形的关系为准，平衡以重心的连结和重心感的安宁为主。
对照组成：对照组成夸大部分与部分的差别性，使整体成为有明显对照关系的组成。
特异组成：特异组成或称突变组成，整体具有某种法则性，部分由于打破法则，而出格引人注视标组成。
比例组成：按一定的比例渐进变化，常见的有等差数列、等比数列、黄金朋分比、斐波那契数列等。
朋分组成：将一个整体按需分别红份歧的部分，如龟裂的地盘。朋分组成有法则朋分、自在朋分、功用朋分、装潢朋分。
群化组成：将简单的根基形，用分歧的方式，组合在一路成为新的根基形。



组成的手法

1.7 格式塔心理学（完形心理学）

Design Principles: Visual Perception And The Principles Of Gestalt — Smashing Magazine
格式塔心理学的格式塔是德文Gestalt的音译，一般又称为完形心理学。
格式塔心理学首要研讨整体与组成整体的各个部分之间有何联系，夸大研讨工具的整体性，不是纯真的各个元素自己的特征，而是他们所组成的整体的特征。格式塔心理学以为一切元素相加上和一定会小于研讨工具的整体性显现。
经过补全、简化等机制，经过简化、构造、归纳的方式来了解内部天下的复杂信息点，将多个点看成一个整体，削减大脑的认知负荷。
视觉偏向于感知持续的、整体的形式而不是分离的碎片，经过找到元素间很是细小的共性，将多个分歧的信息连系成一个整体，削减视觉触点，减轻认知负荷。
题目标处理不是由于尝试毛病，而是由于顿悟。所谓顿悟，就是内在地把握情境的关系性，并依此改变全部情境。
格式塔的几个根基原则：

Proximity （接近/邻近）、Similarity （类似/类似）Continuity （持续/连通性）、Closure （闭合/封锁）、figure-ground （图形-布景原则）、common fate（同偏向/配合命运）、Simplicity （简单/简化）、曩昔经历原则、简化对称性原则、知觉恒常性。
接近/邻近：间隔的远近可以转达关系的亲疏，放在一路的会被以为是一组的；间隔较远的会以为是分歧的组的。两个元素越是接近，组合在一路的能够性就越大。
类似/类似：形式上（如色彩、外形等）类似的元素，人们在感知进程中会以为其是一组的。就像球赛中，穿着一样队服的，就是同一个球队的成员。
持续/连通：持续性是指，人们会将分手的各个有关联的点，在脑海中自动构建一个完整的线，终极成为一个整体的外形。
闭合/封锁：与持续性类似，也是大脑的一种自动补全机制。我们的视觉感知系统会经过已知的模糊信息，经过以往的经历自动补齐残缺的部分，将部分的信息当做一个整体的形象来感知。可是这类查漏补缺的形式是建立在，我们已感知的工具供给的是有纪律的形状，而非完全分手的碎片和信息。
图形-布景：我们在看到一个事物的时辰，大脑会自动帮助我们在视觉地区区分出主体和布景两个部分，在这个事物中占据了我们首要的留意力的就是主体，然后剩下的部分就是布景。
“图形”是一个格式塔，一个突出的实体，是我们知觉到的事物。“布景”是尚未分化的、陪衬图形的工具。知觉帮助我们从布景中将图形分化出来。图形与布景的对照差别越大，图形的表面越明显，则图形越轻易被发觉。
同偏向/配合命运：类似原则的一种，这里配合的形式就是活动偏向。即具有不异活动偏向的元素，会被以为是具有关联的，一个组内的。
简单/简化：格式塔的焦点思惟，是指为了更方便的了解这个天下，人类会将接管到的大量信息停止过滤和简化，由于这类诠释需要我们支出最少的认知尽力，避免我们被纷纷复杂的内部信息所沉没。
1.8 别的道理/法例

古滕堡图表，又称为对角线平衡法例。由于人们凡是都是从左至右、由上往下地阅读，久而久之视野自然会沿着这一途径移动。
第一视觉区(Primary Optical Area)：左上方，读者首先留意到的地方。
终极视觉区(Final Optical Area)：右下方，视觉流程的尽头。
强闲置区(Strong Follow Area)：右上方，较少被留意到。
弱闲置区(Weak Follow Area)：左下方，最少被留意到。
1.9 视觉焦点与视觉条理

1.9.1 视觉焦点

视觉焦点是受众第一眼就留意到的工具，是转达信息中的重点。视觉需要有焦点，才能吸引留意力、构成节奏感。假如焦点，观众的视野就会游离、飘忽，继而落空爱好。
冯·雷斯托夫效应：也称为隔离效应（The Isolation Effect），在多个类似的工具中，与众分歧的阿谁比别的的更能让人记着。
视觉焦点的构成：焦点就是纷歧样的、怪异的、占比力大的、占据视觉重心元素。
1 对照构成差别、反复后异化。（巨细对照、外形对照、色彩对照、位置对照、间距/疏密对照、肌理对照、形式对照、角度对照、偏向对照、字体对照）
2 视野指导。经过具有指向性的元素（箭头、三角、线条等）、图片（门路、灯光等）、人物视野等，指导用户视野关注到重点内容。
3 特别视角。不常见的视角照片会让人感应陌生、新奇，从而吸引人的留意力。
4 增加布景。在首要信息的下方增加布景层，经过外形、纹理、色彩等的与众分歧来吸引视野，突出主体。
焦点的位置
页面的黄金朋分点、网格结构的穿插点、左上角到右下角的连线上。
1.9.2 视觉条理

视觉条理就是信息的重要优先级区分，经过形式来表白信息的层级结构关系。信息表达需要有层级、有主次，就像音乐旋律需要有节奏、剧情需要有升沉一样。原封不动、陈旧见解会让人感应无趣、有趣，难以集合留意力。
视觉条理是操纵格式塔心理学的接近、类似等原则，对内容停止构造，以条理化、结构化的方式，简化信息的复杂度，经过预先设定好的结构，指导、暗示用户，让受众依照你设定的思维轨迹解读、思考、组合信息，而不会由于每小我的常识布景、文化风俗、生活履历、性情等的差别而形成千人千面的解读。
视觉条理的丰富，可以增加画面的空间感、腾跃率，让整体空气加倍活泼，避免显无暇洞。
对于笔墨而言，视觉条理的分别首要经过字体、字号、字重、色彩、字间距、行间距、布风景、图标等方式来区分。
对于一般的元素而言，区分的方式则主如果尺寸巨细、线条粗细、色彩色彩与明暗、通明度、模糊水平、复杂水平、与布景的对照反差、留白的巨细、阴影、有无装潢元素、边框等。即经过制造对照、构成差别来分别层级。
条理的分别应当适度、公道，没有条理就没有节奏，可是分别得过于噜苏就落空了构造信息的寄义。条理之间应当也有反复、照应，来连结整体感。
1.10 视觉设想的维度

1.10.1信息传递：

让用户看得大白，快速、清楚获得信息
容器整合 —— 信息构造，构成整体，让信息分层，在大的层级上削减视觉触点，加倍整体、整洁一些。
部分放大 —— 拉开视觉条理，突出重点，强化节奏。
1.10.2视觉美化：

让用户看得舒服，美妙舒适。
照应 —— 页面内元素、色彩、形式的照应，整体感更强，加倍和谐而非拼集感。
节奏 —— 形式上有所变化，增加韵律感。避免原封不动的有趣无趣。
饱满 —— 负空间的规整，让整体感受加倍满足格式塔定律中的简洁定律，人们会以最简单的外形来感知内容块。
1.10.3创新创意：

让用户看得欣喜，构成记忆点。
品牌延展 —— 连系品牌形象，强化品牌认知。
图形延展 —— 将语义图形化，增加兴趣性、设想感，让人加倍轻易了解信息
参考：为什么你的界面看着不舒服？腾讯设想师从这 3 个维度优化设想！ - 优设网 - UISDC
2 设想流程

《版面设想的道理》一书中以为，版式设想是频频停止连结条理与增加变化的工作。
从设想计划的层面而言，设想的流程可大致分为：了解-提取-安插
2.1 了解：

了解是指对设想需求的梳理，领会设想目标和布景是什么、在何处展现、受众的特点等等，界说清楚题目。
明白设想意图、气概特点的要求（松散/活跃、高级感/亲和力）、受众特点、场景、贸易目标等。肯定设想的偏向，有的放矢。
对于设想师而言，最重要的是为品牌、产物、用户缔造代价。在面临分歧的需求描写时，应当分析需求背后的本质缘由、目标，再按照目标与气概的婚配停止设想。
获得设想师总结的对接需求时的处理思绪：

翻译需求，弄大白他说这个究竟是什么意义。
专业婚配，从我把握的设想技能中，找到合适的方式去实现需求。

对于常规需求表述的专业化翻译

当甲方说「字要大」时，究竟是在说什么？ - 优设网 - UISDC
需要时，可以经过情感板的方式来同一了解，同时吸收与方针气概相关的形式、元素、色彩等方式。
2.2 提取：

提取是指将所要转达对信息停止整理、构造、分类，并区分出优先级，明白作品内容中那些是最重要的。这个时辰还需要斟酌的是，若何让受众对最重要的的信息发生爱好/被重视。
提取的另一各方面是找到与主题关联的元素、气概形式等，预备好版面的“零部件”。
2.3 安插：

安插是将“零部件”组装的进程，部件之间的连系关系，最初总决议了版面的气质。
安插不是简单对摆放，需要从构图、形式、装潢点缀等角度让整体合适设想的目标，也就是转达主题气质与转达的形式之间相互映托，给人一种同一、了了的心理感受。
首要步调可分为建立条理/次序 —— 增加变化/突出夸大/图形化 —— 整体空气和谐
2.3.1建立条理/次序：

建立条理是让整体清楚、大白，为信息建立次序。一般会用到四大法例中的对齐、密切、反复原则。
建立条理的进程是将信息的结构、分类视觉化的进程。
2.3.2增加变化/突出夸大：

变化的意义：

建立条理的目标是让页面加倍规整、清楚，可是一味的对齐、反复，像康德的作息一样陈旧见解，会给人以呆板、无趣的感受。这时辰就需要增加变化来“打破”过度的分歧，让整体表达上加倍活泼一些。
增加变化的方式：

图形化、对照、打破常规（形式、色彩、视角、位置等停止变化、翻转等）
图形化：图形化的表达，增加兴趣性、设想感，让人加倍轻易了解信息。如增加图标、将笔墨图形化等。
对照：增加对照（色彩、巨细、形式）来区分信息的条理，构成差别，突出重要信息，让页面构成节奏感、韵律感。
对照的形式包括：光影、突变、纹理、装潢元素、留白巨细、扭转角度、添补/描边、远近、清楚与模糊、气概（传统与未来）、混乱与整洁、字体范例、字重、字号等等。
打破常规：故意的翻转、位移；采用特别的视角；夸张的放大；



增加变化的方式

2.3.3整体空气和谐：

在安插好一切元素今后，还需要斟酌色彩的冷暖、气概的软硬、视觉上的重心等的和谐、和谐，让整体的空气、气质与设想的主题方针相符合。
同时，元素、色彩、气概之间有照应，构成协力。视野的活动流利，负空间的外形完整、规整等。
2.3.3.1 冷暖和谐

色彩可以分为暖色与暖色，蓝色、青色等暖色让人联想到冰块、海水等意象，给人的心理感受风凉、安宁。红色、橙色等暖色则让人联想到太阳、火焰等意象，让人感遭到暖和、活跃。
当大面积利用某一品种型色彩时，如暖色，有能够会让整体空气阴冷、呆板；反之，则会让整体显得急躁、刺眼。除了让整体空气与表达的主题相符合之外，也要斟酌整体给人的感受，在过于偏向一方而让人不当令，经过点缀对应的色彩让整体加倍和谐。
冷暖色彩面积差别越大，对照的结果会越明显、突出，同时抵触、反面谐的感受会削减。



暖色与暖色

2.3.3.2 软硬和谐

曲线、圆角、粉色彩、明亮浅淡的色彩等偏软，直线、直角、深色彩、激烈鲜明的色彩等偏硬。偏软的元素让人更轻易亲近，气概上加倍心爱，更具女性化，可是轻易变得廉价、低幼。偏硬等元素显现出次序、理性等特征，可是轻易让整体变得呆板、无趣。
一方面，可以在比力呆板的画面中加入软一点的元素来和谐画面大概反之；另一方面，可以在不竭反复的硬元素中加入偏软的元素作为首要信息点来突出夸大。
2.3.3.3 轻重和谐（重心平衡）

版面中的元素根据巨细、色彩的差别，会发生巨细纷歧的视觉引力。全部画面的视觉重心就在各元素的拉扯中构成。如果首要元素都偏向于一侧，那末全部画面会有一种向一边倾倒的趋向，需要在对应的一侧增加一些元素来让左右平衡。
同时，视觉重心偏高会让整体空气加倍的具有跃动感、不服稳感；反之，则整体味加倍平稳、踏实。根据索要转达的主题意象的差别，也会挑选分歧的重心安插。需要公道的处置与安插元素的巨细、色彩等会，来构建与整体气质符合的视觉重心，让内容与形式加倍符合。
2.3.3.4 深浅和谐（头头是道）

在浅色形式下，深色部分一般被以为是比力重要的、侧重夸大的。浅色部分通常为主要的、帮助信息。
在深色形式下，深色部分一般会被当做布景，浅色、亮色的部分会在布景中凸显出来，成为首要的内容。
深浅和谐就是既突出内容，又与整体的气概气质分歧，或对照激烈，大概恬静和蔼。
2.3.3.5 气概和谐

将版面看做一个系统，每个元素都是系统的要素，每个模块就是子系统。依照《高效强人士的七个习惯》《系统之美》的概念，应当统合各个部分，让各部分的方针与整体的分歧，终极实现1+1＞2的结果。
页面的色彩、字体、帮助元素、布景的气概应当与整体的气概基调连结分歧，强化整体的气概印象。同时元素之间应当有一定的照应关系，强化整体感。
如稳重、恬静、风格感的空气需要柔柔色彩/浅灰色彩/浊色彩、印刷体、直线、纯洁度高的布景等元素来衬托，同时留白较多，元素变化较小、腾跃率低；而艳丽色彩/明亮色彩/激烈色彩、手写体、斜线、曲线等与活跃、热烈的气概更搭，同时留白较少，图版率较高，元素的腾跃率更大一些。
设想计划流程：整体-部分-整体（建立条理-增加变化/突出夸大-整体空气和谐）



设想计划流程

3  其他-处置技能

3.1 模块的分别

模块分别：当信息、数据过于复杂、需要停止模块分别，让平铺的信息初步分组成为自力的信息单元。
为什么区分：构造信息，简化认知负担。
区分形式：设想的道理包括同域原则、接近/密切法例、类似法例。具体的形式：间距、分隔线、卡片布景（纯色、阴影、线框等）、色彩。



区分形式

3.2 构图与结构

构图可以指导观者的视野活动，平衡整体的画面重心。一般而言，构图形式可以分为对称构图，中心构图，左右构图，对角线构图，发散构图，满版构图，外形构图，S形构图，X构图。
3.2.1 对称构图

格式塔心理学中的简化对称原则：人们常常偏向于感知均匀物体围绕中心对称后构成的外形。在纷纷复杂的信息中寻觅纪律、简单、有序的工具。
对称构图分为中心对称、左右对称、高低对称、对角对称、夹杂对称。构图中可以将笔墨、图片、装潢元素等相互融合、反转，让两者之间的关系加倍慎密，同时打破固化、呆板的印象。
中心对称即居中对齐，与组成的三品种型中提到的居中型一样，表示文雅、高品格、有风格的气质。画面比力恬静、和谐。
左右对称即均分画面，将版面朋分为左右1:1两部分，合适表达某种对峙、反差的事物，画面平衡、稳定、次序感。
高低对称将画面分为高低两个部分，重心靠上或靠下。
对角对称将元素放在画面的对角，在对称中增加一点活跃。
夹杂对称即连系多种对称方式，如中心对称+对角对称。



对称构图

3.2.2 中心构图

中心构图可以看成是对称构图的一种特别形式，将主体放在视觉中心，别的的元素围绕主题排布（通常为对称的，以连结平衡），起到突出夸大的感化。
经过主体与帮助元素在尺寸、色彩、布景、阴影等方面的对照、差别，构成视觉焦点。增加腾跃率，让整体的节奏加倍鲜明。
3.2.3 左右构图

左右构图可以看成是对称构图的一种特别形式，经过将画面分为左右两个部分，来到达一种平衡、稳定的状态。
构图的比例分别一般有1:1、1:0.618、1:1.414、1:2、1:3等。 均分的比例，两者之间半斤八两，画面比力平衡稳定；差池称的比例，腾跃率会更高一些，更有活力。
1:1将画面均等分别，两者显现一种对峙的关系。
1:0.618、1:1.414别离是黄金朋分比例和白银朋分比例，与1:1相比，更有条理和节奏感。
1:2、1:3则通常为图片作为主体，占据画面较大比例，笔墨作为帮助的题目、说明等。
左右的空间并纷歧定需要全数占满，占据一定比例后，经过留白、内部再次分别等方式，让画面的节奏感更强一些。
朋分的形式也纷歧定是直线朋分，外形蒙版、曲线、斜线等朋分形式，会显得加倍灵动一些，合适于稍显活跃的气质。
同时也可以增加毗连/跨越两个部分的元素、笔墨等，大概去除图片的布景，让左右两部分的关系加倍慎密一些。
3.2.4 高低构图

高低构图可以看成是对称构图的一种特别形式，将画面分为高低两个部分，只是切分的比例和左右构图类似，并非一定是对称构图中的1:1，也可以利用:0.618、1:1.414、1:2、1:3等。
分歧的比例和元素安插，重心会有所分歧。重心靠下，整体比力稳定；重心靠上，整体更具有动感。
与左右构图类似，分别的各个空间并纷歧定需要全数占满，占据一定比例后，经过留白、内部再次分别、内部的腾跃率提升等方式，让画面的节奏感更强一些。
朋分的形式也纷歧定是直线朋分，外形蒙版、曲线、斜线等朋分形式，会显得加倍灵动一些，合适于稍显活跃的气质。
分别的两部分中，面积较大的部分视觉度的提升，可以增加整体版面的活力与动感，避免空洞、呆板。
3.2.5 倾斜构图

主体、笔墨、布景、装潢元素中一切/部分的元素倾斜放置，让画面显得不稳定，构成动感、速度感。倾斜的角度一般在15° — 60°之间。



倾斜构图

3.2.6 发散/放射构图构图

发散构图是反复原则的极致应用，帮助元素围绕主体，呈发射状。形式上包括离心式、向心式、齐心式、移心式、多心式。指导视野、焦点突出、构成空间感。



发射构图

3.2.7满版构图

将图片、笔墨、装潢元素等布满全部版面，让画面视觉度更高、版面率更大、留白变少、丰富饱满。



满版构图

3.2.8 外形构图/多少构图

将元素构造成某种外形，让页面的结构加倍规整。常见的外形有三角形（正三角、倒三角、斜三角）、四边形（平面、透视）、圆形（平面、透视）
3.2.9S形构图

S形构图可以看成是外形构图的一种特别形式，画面的首要元素呈S型排布。
3.2.10  X构图

X形构图可以看成是外形构图的一种特别形式，画面的首要元素呈X型排布。
3.2.11  现实隐喻结构

模拟现实中的物体（与主题相关），将信息拼分解物体的外形，更紧扣主题。



多少构图

3.3 布景处置方式

布景的范例：纯色、色块、突变、高光点、笔墨、图片、图形、纹理等。
纯色
纯色的利用，具有激烈的视觉偏向，整体气概气质与布风景的气质接近。
色块/图形
色块的利用可以让整体显得现代、繁复，在画面比力空洞时，可以作为布景的帮助元素，让整体加倍丰富、耐看。
突变
突变色的利用，让整体色彩更丰富/构成光照发生的变化感。细节条理加倍丰富。
增加高光点
经过增加光源/高光部分，构成视觉指导，区分条理。
笔墨
经过将笔墨放大的方式，可以突出笔墨的图形感，弱化其作为说话载体的属性。削减视觉重量后，作为布景元素，可以让画面条理加倍丰富。
图片叠加
在图片上增加笔墨、色块等，图版率较大。
质感图片/肌理/图案
叠加质感图片/几里/图案，可以丰富画面，让布景加倍丰富、耐看、有品格。可以选用多张图片叠加的形式，连系蒙版、图层夹杂形式的变化，可以发生多样、奇妙的结果。
图形
图形的设想可以看成是纹理的一种。



布景的形式

3.4 字体的处置方式

3.4.1 字体的处置方式-UI设想

UI设想中的大部分字体都是跟从系统设备，所以一般不会特地指定字体。对于web真个产物，一般会制定倡议的字体顺序。设想中一般利用苹方、思源黑体等字重品种丰富、常用的字体范例。字体的处置一般而言就是字号变化、字重变化、行间距的调剂、字间距的调剂、字体色彩的调剂。
字号
即笔墨的巨细，web设想中一般最小为12px，移动端设想中，一般2X图的设想尺寸下，最小尺寸为20px，也就是10pt/sp。

在iOS中，默许字体单元是「pt」，正笔墨号不应小于11pt，倡议在15-18pt之间。在利用较大的字体来获得更好的易读性同时，也应当响应地减小字体的字重，由于太重的字体味过分夺目厚重，影响其他内容的显现结果。

字重
字重即字体笔画的粗细。字重较大，比力夺目、稳重，合适于题目、夸大笔墨。字重较小，更偏轻盈、秀气一些，合适说明、帮助笔墨。
在UI设想中，字重于字号、色彩一路，是区分层级的重要手段。



https://www.w3.org/TR/css-fonts-3/#font-weight-normal-value

字间距
字符间的间隔，对西笔墨体而言，就是词距。一般连结默许的标准间距（NA）。对于大段文本，调大字间距可以让整体透气性更好，削减给人的榨取感，阅读性更好。
在设想软件中，一般经过调理对齐方式来调剂字距构成的留白空间，同时需要留意某些标点标记不能放在头尾的法则。
行高
一行笔墨所占据的高度，UI设想中，一般倡议行高为字号的1.5~2倍，奇数行高则向上+1取偶数。
行长
一行所占据的长度。行长太长易读性就会变差，读者阅读时轻易串行，形成阅读困难。
行间距
行与行之间的间隔。行间距与字间距一路，决议了一段内容的宽松/松散水平，也表现出舒适、疏松/榨取、慎密的感受。
段间距
段与段之间的间隔。分别分歧的内容块，让整体构成节奏感。一般取一行的高度的作为段间距。
字体色彩
笔墨色彩的挑选与布景、整体的色彩关系亲近。
对照度
对照度一方面影响笔墨的识别性，一方面也是层级关系的表现。在sketch中，可以利用插件（Color Contrast Analyser）来检核对照度能否满足WCAG的要求，一般最少到达AA级别。
Web Content Accessibility Guidelines (WCAG) 2.0
3.4.2 字体的处置方式-运营设想

运营设想中，字体包括题目、帮助笔墨、说明笔墨等，一般会根据整体的气概空气等对字体形状、款式、色彩等停止处置。同时，调剂字体的腾跃率来合适整体的空气。
根据目标、利用处景的差别，字体的处置需要在本性化与可识别性中获得平衡。
字体范例的气质：

黑体 —— 清洁、现代、繁复；
衬线体 —— 高雅、古朴、时髦；
圆体 —— 圆润、心爱、亲热；
书法体 —— 复古、气势澎湃、历史底蕴；
哥特体 —— 凌厉、魔法、童话等；
意大利体 —— 手写感，意大利体在英文中，凡是会在暗示夸大、标志外来语、以及暗示作品名时会用到。
铜板花饰体 —— 文雅、女性化，装潢感较强。
字体形状的处置技能：

字体&字号对照：如无衬线体中文+手写英文，在严厉中增加一丝活跃的空气。
图形化：放大笔墨、将笔墨排列成某种外形，强化装潢性。如将笔墨排成一个圆圈，作为装潢元素出现，可以在版面中增加一些曲线的元素，与直线的元素构成对照，柔化整体的气质。
间距与行距：扩大笔墨的间距和行距，也是图形化的一种形式，弱化笔墨属性，增加笔墨在版面中的空间占比。
反复：将笔墨不竭反复，然后排成某种外形。指导视野、增加图形感。
字体款式的处置技能：

重点在通太反复、变化于构成对照与节奏，图形化笔墨，让形式加倍新奇，构成陌生化的表达。
分歧字体、字号的搭配：构成对照、节奏。
笔墨的对齐与错落：比力自在随性。
增加间距：疏松、自在的空气，增加版面率。
角度变更（45°+45°、30°+60°），更具有动感
加描边/镂空：描边笔墨/镂空笔墨与实心笔墨构成对照，增加版面的变化。
加质感肌理：经过叠加、内发光等形式增加笔墨的肌理结果，让画面细节更丰富。
色彩对照：突出重点，构成节奏。
笔墨蒙版：将笔墨作为蒙版，剪切图片，增加笔墨的视觉度。
增加色彩布景：与布景区离隔，整体感更强。
加蒙版布景/边框：与增加色彩布景的目标类似，整体感较强。
加阴影（一般阴影、长投影、弥散阴影、层叠）：与其他的笔墨/布景等构成前后关系，增加条理感。
加icon/图案：丰富画面，增加兴趣性。
图形化：将笔墨与主题更好地关联起来。
增加透视、立体化：将笔墨三维化处置，强化图形感、空间感。
部分模糊：构成形式上的对照，笔墨的图形化属性获得强化。



笔墨的处置

3.5 增加装潢元素

视觉焦点是画面的主题、舞台的配角；装潢元素是群演、衬托空气的存在。
装潢元素的意义：装潢元素又被称为“视觉糖”，包括点、线、面、图标、纹理、阴影等，自己没有什么意义，可是被用来甜化原本无味和无意义的设想，让设想更有“味道”、更丰富。一般在运营设想中，装潢元素可以丰富画面、平衡版面、让全部画面加倍饱满、有条理，避免整体结果空洞呆板有趣。
装潢元素的形式：点-线-面-图标
点：包括圆形、方形、三角形、不法则形等，点缀画面，定位元素。可以构成视觉张力，平衡画面，让整体不显无暇。
线：线包括直线、斜线、曲线、实线、虚线、开放、封锁等，偏向与粗细的变化表达分歧的气质（恬静/动感、松散/自在等）。指导视野、划份内容、夸大重点、关联元素。
面：包括多少形、不法则形等，表达松散/自在的气质。可以构造内容、进步图版率，增加画面重量。
图标：图标按照巨细可以成为点元素或面元素，比笼统的点线面更符合主题，帮助诠释寄义。也更轻易表达出兴趣性、人性化，而不是冷冰冰的理性感、机械感。
肌理/纹理/图案：与元素连系丰富视觉条理、提升整体的质感。



装潢元素的形式

装潢元素的照应
格式塔心理学的类似法例，人们的眼睛常常将设想中类似的元素视为完整的图片、外形、组合，即使这些元素是分隔的，也会被以为是一个整体的。
照应让整体感更强，让一切的元素为同一个主题办事，而不是各不相谋，酿成没有偏向、目标的“视觉乐音”。
照应的方式并不是简单的反复，而是反复后发生变化，已构成节奏感。变化的部分包括外形、尺寸、偏向、色彩等要素中的一种或几种，既有类似，又有差别。



装潢元素的照应

3.6 投影

投影的感化：

1、与布景隔离，增加主体的识别性。
2、增加空间感、条理感、纵深感。
3、增加质感，表示出风格、高级的感受。
4、将投影作为画面主体，与常规的认知相反，形式上比力新奇，增加形式感。
投影的范例：

常规投影、外弧形投影、内弧形投影、打仗投影、倒影、悬空投影、弥散阴影、长投影、外形投影。



投影的形式

3.7 页面检查

3.7.1 检查的角度

将全部版面看做是一个系统，各个元素是系统的要素，元素之间的关系是要素之间的毗连，版面的贸易诉求、气概定位等是系统的功用、方针。检查时首要斟酌整体的和谐、照应、平衡、活泼（陌生化的表达），各元素及关系与整体方针的分歧性。
四大原则：即对照、对齐、密切、反复。
条理的分别、内容的构造：页面的条理分别能否明白，重点能否突出。即整体的骨架、结构能否公道、有逻辑、有节奏感。
留白、呼吸性：留白部分的外形、整体的透气性、以及空间的延长感、坦荡感。假如信息贵阳冗、视野被阻挡、视野受限不够坦荡，会让人感觉比力压制、喘不外气。
细节部分：字体（字体范例、字号、字重、字间距、行间距），朋分线（粗细、色彩、朋分方式），色彩（冷暖、明暗、轻重、对照度），画面的平衡。
整体的分歧性、照应：整体气概的趋同、调和。版面率、构图、色彩、装潢元素、字体等元素的气概偏向是分歧的，让人感受是一个自然、有机的整体，而不是各类分歧的零件强行拼集出来的。
3.8 视野指导

视野指导的目标：

经过让指导用户的视觉焦点，成心识的影响观察的前后顺序，让用户关注到重点内容，保证信息转达的效力、质量。
视野指导的方式：

高光：高光点与四周的情况构成对照，吸引视野，结果与iOS Human Interface Guidelines 中所提到的“subtle”比力接近，奇妙地、奥妙地。
突变：突变的偏向性指导视野的活动，指导形式比力蕴藉。
线条：线条的趋向、偏向让眼光跟随，具有极强的视觉指导性。
偏向性的图形：具有指向性的图形、纹理等，让眼光移动到指示的偏向，比力决心、激烈。
活动趋向：画面中的物体有往哪个偏向活动的趋向，会指导视野随着这个趋向。
照片中配角的视野：对于画面中有人物元素的版式，人物对于人的吸引力较大，大大都人会首先关注人物的面部，并进一步遭到人物视野的指导。



视野指导的方式

3.9 别的技能

3.9.1 若何让页面不显无暇：

整体的思绪是增加画面的视觉度，进步图版率，削减留白。
常见的技能：
·增加水印笔墨作为布景
·增加帮助小元素——点、线、icon、小的笔墨（网格点，球状点，直线，斜线，海浪线，圆形，方形，不法则多边形，流体形，阵列的线，阵列点）
·增加光影，提升质感
·增加材质、肌理（星空，雾气，云，无意义的图案，纸张质感，石材质感，水波）
·增加色块（大，小，外形），指导视觉中心
·进步主体占全部画面的比例
·增加装潢图案（飘带、框线……）



若何让页面不显无暇

3.9.2 页面太乱若何处理：

交互设想繁复设想四大法例：构造、隐藏、删除、转移。视觉设想中，构造、删除、对齐、反复是简化页面的几个根基原则。
·增加内容容器，让整体构造关系加倍清楚。
·削减字体、字号、色彩（色相、明度、纯度）的数目/变化
·削减朋分线等元素，操纵间距、色彩、布景等实现模块之间的分别。
·对齐:无形/无形的对齐线
·同一元素间的关系：即反复。气概形式、色彩、元素之间的表面关系、布景款式等连结同一来构成整体感；



页面太乱若何处理


3.9.3 页面单调/呆板：
首要思绪是丰富页面，增加页面的视觉度、图版率、腾跃率，削减网格拘束率。优化节奏感、对照。
·选用视觉度更大的布景图片
·增加视觉糖（突变、阴影、描边、纹理、图标、动效、点线面元素等）；
·增加英文/拼音
·增加色彩的丰富度
·增加质感、纹理、色块等
·增加光影的应用（侧光、逆光……）
·元素角度变化（倾斜发活泼感、对称/翻转构成反复与变化）
·削减网格拘束率
·强化条理与对照、变化（形状对照、巨细对照、色彩对照、远小近大的空间对照、Z轴凹凸的空间对照，留白空间巨细对照）



处理页面单调/呆板

3.9.4 与主题不符：

首要思绪是明白主题，建立情感板（mood board），从页面整体结构、构图、色彩到细节的装潢元素、笔墨范例及对齐方式等方面，全数向方针气概靠近。同时整体调和、分歧、照应，强化印象。
·版心巨细/版面率
衬着节日空气、促销的宣传类设想，一般采用高版面率，给人热烈、亲热、有张力的感受。高级品牌、商务宣传一般采用低版面率，给人以稳重、高雅、有间隔的感受。
·构图形式
分歧的构图形式，版面率、平衡性、稳定性等会有一定的差别。如发散构图、倾斜构图更有动感，对称构图则加倍稳定。
·色彩气质
色彩的品种、数目，色彩之间的类似、类似、对照等关系，对于全部气质有较大的的影响。
·布景/图片的气质
布景/图片的气质，奠基了全部版面的根本气概。
·分轻视角对气质的影响
安静、温顺的画面，一般采用常规的观察角度，新奇、动感的气概，一般利用特地、不常见的角度（如俯视角度看一小我）。



处理与主题不符

3.10 设想形式：

设想形式是在要素和要素关系上，操纵一些技能，构成陌生化的表达。
位置叠压手法
经过元素的叠压，增加版面的图版率、让画面整体加倍饱满、元素更多，条理更丰富，画面整体气概也会加倍热烈活跃。
位置叠压的范例：图前文后、图后文前、图文穿插、笔墨透叠、图文透叠、图片透叠。
图文堆叠  《高手的平面课堂！聊聊图文叠加的四种常用技法》
标签化式设想
格式塔心理学的同域原则、信息传递中的容器整合。
《学会用标签式设想，让你的作品又快又好！》
笔墨补钉气概
笔墨下方加上别布风景块，面状化，加倍整体、突出、夺目。在复杂的布景中，增加色块也可以增加笔墨的辨识度。


补钉的范例：色块、描边、外形变化、色彩变化、通明度变化、质感变化（增加肌理、材质）、二维角度变化、视角变化（透视、俯视、俯视）、笔墨变化（字重、字号、间距等）、位置变化（笔墨与补钉的位置错开、补钉之间的堆叠与嵌套）、组合/连系（各个色块之间、色块与描边之间、各类气概之间）



补钉的范例

找不到排版灵感？来看这个平面高手都在用的「笔墨补钉」排版方式！ - 优设网 - UISDC
扭曲形式
对元素的处置形式，扭曲、反复等形式让常规的元素变得陌生。
《平面高手课堂！若何用扭曲工具快速强化作品设想感？》
4.0 总结

将版面看成一个系统，《系统之美》中提到系统的三要素：要素、毗连、方针。
对应到版式设想中，要素=笔墨、装潢元素、布景、纹理、色块、色彩等。
毗连=元素之间的组成关系，包括分手、打仗、覆盖、透叠、结合、减缺、差叠、重合。
方针=版式的气概定位、表达的诉求、信息的优先级。
在款式八要素中，视觉度、字体印象关注的是版面中的要素，即要素的改变对整体气概的影响。图版率、笔墨腾跃率、图片腾跃率、网格拘束率、版面率、组成的三品种型都是关注的要素之间的毗连关系，即个部分之间的毗连方式发生变化后，版面的气概气质会随之变化。
对于要素的处置技能：反复、扭曲、翻转、描边/添补、增加装潢元素、肌理、色块、投影、角版/挖版、改变字体/色彩。
对于毗连/关系的处置技能：对照、对齐、密切、构造、构图的形式、组成关系、明白主题、整理流向。
在版式设想中，应当以方针为中心，从要素和要素之间的毗连动手，逐层优化，每一层都应当是为整体办事的，统合各要素、各层级、子系统，终极到达整体的和谐分歧、气概明白。
参考

《七日把握版面设想根本》
《系统之美》
《高效强人士的七个习惯》
平面根本小课堂！聊聊排版中的版面率和留白率 - 优设网 - UISDC
甲方说：放大！再放大！我该怎样办？ - 优设网 - UISDC
界面设想——视觉层面的三维剖析-UI中国-专业用户体验设想平台
当甲方说「字要大」时，究竟是在说什么？ - 优设网 - UISDC
平面高手课堂！用一篇干货帮你完全周全把握「投影」常识点！ - 优设网 - UISDC
《设想入门课堂1：版面设想的道理》 (豆瓣)
学会这6个特别视角的构图方式，让你的设想脱颖而出！ - 优设网 - UISDC
为什么做版式设想你总是没有思绪？ - 优设网 - UISDC
找不到排版灵感？来看这个平面高手都在用的「笔墨补钉」排版方式！ - 优设网 - UISDC
不成不知的版面编排小秘诀|平面|教程|研习设K师长 - 原创文章 - 站酷 (ZCOOL)
5000 字超长干货，帮你搞定 PPT 布景设想！ | 优设网 - UISDC
文案信息较多时，该若何编排版面才会都雅？ | 优设网 - UISDC
平面高手出品！若何让你的设想变的更有内在？ | 优设网 - UISDC
海报画面没创意？素材这样处置试试 | 优设网 - UISDC
做版式设想没眉目？来看这份保姆级的思绪详解！ | 优设网 - UISDC
用超多天下名画和实战案例，帮你学会平面构图 | 优设网 - UISDC
为什么你的作品缺少视觉焦点？用实战案例为你分析！ | 优设网 - UISDC
版式题目若何学会自我检查？高手从这三个方面动手！ | 优设网 - UISDC
用超多案例，帮你把握「左右构图」的排版技能 | 优设网 - UISDC
一万六千字！超周全的字体与排版利用指南 | 优设网 - UISDC
7000字干货！西笔墨体怎样看、怎样用（上） | 优设网 - UISDC
写给新手的版式设想根本指南（一）：表示力 - 优设网 - UISDC
为什么你始终做欠好版式设想？ - 优设网 - UISDC
有哪些轻易上手，而且出格出结果的版式设想技能？ - 优设网 - UISDC
总监说你的平面作品太散？这篇深度干货来帮你！ - 优设网 - UISDC
新手科普文！每个设想师都该懂的栅格系统根本六要素 - 优设网 - UISDC
看不懂不会用的栅格系统，这篇帮你完全把握它！ - 优设网 - UISDC
用超多案例，帮你把握栅格系统的结构设想 - 优设网 - UISDC
一篇文章让你学会栅格系统-UI中国用户体验设想平台
若何让你的设想看起来更高级？试试网格系统！ | 优设网 - UISDC
把握这套网格排版技能，版式不高级都难 | 优设网 - UISDC
网页设想的关键！版式设想之图版率 | 优设网 - UISDC
写给新手的版式设想根本指南（二）：图版率 - 优设网 - UISDC
想要用好留白？这篇文章帮你重新起头梳理 - 优设网 - UISDC
平面根本小课堂！聊聊排版中的版面率和留白率 - 优设网 - UISDC
写给新手的版式设想根本指南（三）：笔墨腾跃率 - 优设网 - UISDC
写给新手的版式设想根本指南（四）：图片腾跃率 - 优设网 - UISDC
平面设想高手是若何用好对照原则的？ | 优设网 - UISDC
作品不够吸引眼球，应当若何处理？ | 优设网 - UISDC
用一篇超周全的文章，帮你把握对齐原则 | 优设网 - UISDC
平面高手是若何用好反复原则的？ | 优设网 - UISDC
把握反复原则，帮你轻松塑造画面同一性 - 优设网 - UISDC
学会分别层级，是起头设想的第一步 - 优设网 - UISDC
用超多案例，帮你学会典范格式塔理论的7个视觉原则 | 优设网 - UISDC
近万字干货！带你周全领会格式塔原则 | 优设网 - UISDC
古登堡图：视觉流在设想中的利用 - 知乎
易懂好用的UI界面，都建立在杰出的视觉条理之上 - 优设网 - UISDC
什么是汉字图形化的设想？ – 学UI网
用一篇超强干货，帮你学会高手都在用的焦点配色法 | 优设网 - UISDC
若何让平面排版的条理更丰富？我总结了这15个方式 - 优设网 - UISDC
逼迫症最爱的「对称构图」，来领这份超全攻略！ - 优设网 - UISDC
用超多案例，帮你把握「左右构图」的排版技能（实操篇） | 优设网 - UISDC
作品不够吸引人？来试试结果超好的「中心构图」！ - 优设网 - UISDC
用超多案例，帮你把握「高低构图」的排版技能 | 优设网 - UISDC
画面呆板若何打破？非看不成的「倾斜构图」技能！ | 优设网 - UISDC
这类组成方式，让你的画面更吸睛！ | 优设网 - UISDC
《平面组成》.pdf
教你一招！处理内容太多的排版题目 - 优设网 - UISDC
想让平面结构更有章法？收下这份多少构图总结！ - 优设网 - UISDC
这样设想光影轻拟物，想不脱颖而出都难！ | 优设网 - UISDC
移动端笔墨与排版设想的六个原则 | 大家都是产物司理
写给新手的版式设想根本指南（三）：笔墨腾跃率 - 优设网 - UISDC
若何让你的电商题目更吸引人？平面高手总结了这四个方式 | 优设网 - UISDC
一万六千字！超周全的字体与排版利用指南 | 优设网 - UISDC
7000字干货！西笔墨体怎样看、怎样用（上） | 优设网 - UISDC
一样是描边字，为什么你做的总是很土气？ | 优设网 - UISDC
超级干货！高桥善丸的六个字体设想思绪！ | 优设网 - UISDC
版式设想中若何用好「面」？来看高手的分析！ | 优设网 - UISDC
版式编排中的王炸技能！完全把握「线」的设想用法 | 优设网 - UISDC
一样加素材，为什么你是堆砌，而高手就是在做设想？ | 优设网 - UISDC
怪了！为什么你单个设想细节都雅，整体看却不可？ | 优设网 - UISDC
平面高手课堂！用一篇干货帮你完全周全把握「投影」常识点！ - 优设网 - UISDC
投影一向做欠好？看这篇文章就搞定！ - 优设网 - UISDC
这篇超具体的教程，帮你周全把握 APP 中的投影设想！ - 优设网 - UISDC
提升UI界面设想结果的快速检查清单 | 优设网 - UISDC
版式题目若何学会自我检查？高手从这三个方面动手！ - 优设网 - UISDC
学会这8个要点，帮你正确检查设想作品黑白（附批改教程） - 优设网 - UISDC
一图胜千言！八个小窍门帮你玩转网站布景图设想 - 优设网 - UISDC
文章结构



原文地址：https://zhuanlan.zhihu.com/p/369133988
免责声明：本帖内容由机械人自动收集于互联网，如加害了您的权益，请联系我们【E-Mail:cb@yoyodoc.com】 我们会实时删除侵权内容，给您带来未便，深感歉意！

嘴边反复的话普

好文，走心了