欢迎访问智唯网络!专业H5响应式营销型网站建设、百度seo优化、网络推广服务!
营销之道 干货分享
了解企业新动态,分享前沿的营销推广干货,成长路上,我们携手同行
网站设计News

网页的点线面排版设计

发布时间:2017:08:27 03:00:22 | 已阅: | 作者:智唯小编 | 来源:智唯网络 | 共 0 条评论

扫一扫
手机访问

本文共有1507个文字,预计阅读时间4分钟
导语
每个设计师多少都有一点强迫症,有时候会为一个像素的间距而纠结,有时候又会割舍不下自己做的元素,满屏的信息都想突出,导致画面混乱。设计师培养自己对画面的全局观是很重

每个设计师多少都有一点强迫症,有时候会为一个像素的间距而纠结,有时候又会割舍不下自己做的元素,满屏的信息都想突出,导致画面混乱。设计师培养自己对画面的全局观是很重要的,所以我们的脑子里时刻都需要有一把“尺子”在,这把尺子,就是“点线面”。在使用这把“尺子”的时候,抛开那些装饰和颜色还有材质,将画面抽象成点线面来把控你的设计,也许会有不一样的启发和看到画面不和谐的原因所在。

设计师对版面的全局观,就是“点线面”的处理。“点线面”是所有视觉画面的基本结构,点线面可以把不同的部分或者元素组合成一个整体,进而打造一个视觉舒适平衡的版面。

一 . 点的运用

点,单独存在时,是空间的一个痕迹;点也可以作为线的开端。很多点聚在一起可以组成韵律和图案,点的疏密,重复,规模和数量变化都能对画面效果起到很关键的作用。


网页的点线面排版设计

点成线,线成面,点是几何中最基本的组成部分。比如,在基本平面设计当中,你可把点当做一个文字或单独小元素,线是一句文案,而面,则是一段文字等等。

不同形状的点


网页的点线面排版设计

圆,平稳,完美无瑕疵的,给人的感受是饱满,有力量的。

方形,除了平稳外有端庄,大方感,在给人的感受踏实依靠的。

三角形:菱角分明,且有指向性,也给人尖锐的情感。

菱形比三角形对称,在个性中又有平衡。其他不规则的图形,各自有自己的个性,是独立的,张扬的。


网页的点线面排版设计

△ 以点为主要元素作为画面的主体,有层次的分布点的位置,同时点的形状又各不相同,使得画面细节特别丰富,有很多看点,同时有时有节奏变化的。需注意,这时点的面积大小都是很接近的,不然反而会导致画面凌乱不堪。


网页的点线面排版设计

△ 这个例子是点用得极致的做法,每个文字都是单独的点,但整体的一段又可以看做是面,这么多颜色运用在一起也不会显得凌乱,可见这位设计师是功力扎实的。

二. 线的运用

线具有很强的视觉引导性,它是连接任意两个点的路径。有直线、曲线、粗线、细线、水平线、斜线、波浪线、实线、虚线等等。柔和、感性的线条暗示平静、和谐,而锋利,曲折的线条表达打破规则和紧张。

线还有分割画面的作用,线有连贯性,画面因为它的分割而变得生动有趣,对于阅读顺序有着决定性的作用。


网页的点线面排版设计

△ 线的规则性让整体画面有一致的方向感,,达到一种愉悦舒适的感受。


网页的点线面排版设计

△ 在这个版式中,曲线的运用贯穿整个页面,打破了整齐的文字排版,打破了乏味的基调。


网页的点线面排版设计

△ 上面这幅书籍封面通过田野线条的纵向延伸,同时使用负空间将观看者的注意力引向The Wealth of Nations这一标题,线在画面中具有很强的引导性。

三. 面的运用

面是线的移动至终结而形成的,面有长度和宽度。面的形态也是多种多样的,不同的形态的面,在视觉上表现不同的情感。

直线形的面具有直线所表现的心理特征,有稳定、秩序感。曲线形的面具有柔软、轻松、活泼。不规则的面,例如水和油墨,混合墨洒产生的偶然形等,比较自然生动,有灵性、人情味。


网页的点线面排版设计

△ 例如上图,我们会感觉版式特别稳定,是因为画面中整体是两块大矩形支撑了画面,构好基本版面后再在面里去加入线和点,来增加其细节。


网页的点线面排版设计

△ 再如上图,版式依旧稳定,也是因为画面是有几大矩形构成的。


网页的点线面排版设计

△ 不规则的面切割画面让页面整体比较灵动,中间的文字是规矩的矩形,穿插在整个不规则的画面中,镇住了整体的版式。


网页的点线面排版设计

△ 不过,点线面之间,没有绝对的界线。通过程度的变化可以使它们自由变换。 A和B比较,A是点,B是面。B和C比较,B 是点,C是面。D和A比较,A是点,D是线。D和E比较,D是点,E是线。

四. 点线面全局观

上面各自讲完点线面,现在就可以用点线面全局观来审视和检查我们的设计画面了。

我大致总结了点线面在版式中各自的角色分配:

点:画面的信息排版,画面点缀,平衡。

线:画面的信息方向引导,造型,分割信息。

面:画面的气氛调性,背景打造,主体信息。


网页的点线面排版设计


网页的点线面排版设计
如何建站:
建网站需要准备哪些资料 如何购买域名空间 协助备案 成功案例 真实见证 建站类型有哪些 收费标准 建站流程 制作周期 改版美化 提升有户体验 [建站必看]源码内容交付 联系客服 专业建站

看了这篇文章的人还看了

专业建站 免费排名(有什么疑问的请留言或咨询在线客服)
  • 全部评论(0
    还没有评论,快来抢沙发吧!

上一篇:城市指南网站着陆页如何设计

下一篇:解析页面搜索框设计的重要性

  • 18900 文章总数
  • 2409864访问次数
  • 建站天数
  • 专业建站优化Jimmy Zhu
    男,从事互联网服务行业10年,专业建站优化,快速建站上排名。欢迎中小型企业朋友一起来交流!!
    相关专题
    • 网站建设咨询
    • 同行价格

      统一报价,无隐形消费

    • 金牌服务

      一对一专属顾问,7*24小时金牌服务

    • 售后无忧

      完善售后,客服经理全程跟进

    建站优化二维码
    建站优化二维码

    截屏,微信识别二维码

    微信号:13825575516

    (点击微信号复制,添加好友)

    优化二维码打开微信