UI设计中可借鉴平面设计技巧(版式设计1)

UI设计是随着智能设备的飞速发展、互联网行业的发展以及农林牧渔传统行业的急于转向而兴起。主要是企业对移动设备交互界面的重视。在企业越来越重视界面设计的今天。传统的平面设计能为现在我们的UI设计提供哪些参考呢,我们能从中借鉴的技巧有哪些?今天就从版式设计说起。


UI设计是随着智能设备的飞速发展、互联网行业的发展以及农林牧渔传统行业的急于转向而兴起。主要是企业对移动设备交互界面的重视。在企业越来越重视界面设计的今天。传统的平面设计能为现在我们的UI设计提供哪些参考呢,我们能从中借鉴的技巧有哪些?今天就从版式设计说起。

UI设计中可借鉴平面设计技巧(版式设计1)

版式设计

在UI设计中版式设计不言而喻是非常重要的。版式设计就如同盖房子先要搭好框架一样。一款APP视觉呈现是不是符合商业性并兼具审美。其中的版式设计是其核心。而在平面设计中版式设计也是一个作品的核心。平面设计长时间的发展积淀了相当多实用的技巧和方法。

一、形势方法

版式设计中形势方法指的是、画面的表现方法和原理。说白了就是画面要出什么效果就用什么表现手法而已。平面设计中形势方法可以分为。虚空留白、比例适度、对比调和、变化统一、变异秩序、节奏韵律、重复交错、对称均衡等。今天我们举例分析一下前四个。

1、虚空留白(适合现在极简设计风格)

这种版式设计主要是突出主题,给人以轻松愉悦的感觉。适合文艺范的和有逼格的app界面使用,能够营造出高品质的界面风格。但是如果一旦运用不得当容易出现界面空或单调的感觉。

UI设计中可借鉴平面设计技巧(版式设计1)

2、比例适度(协调UI中各部分内容)

平面设计中所说的比例适度主要是整体和部分的协调,采用合理的比例方法,如:黄金比例、等差等比。去协调各部分的关系使各部分要素产生联系。在UI版面布局中正是需要调节和有机的组合各要素在有限的界面里的合理性。

UI设计中可借鉴平面设计技巧(版式设计1)

3、对比调和(UI中信息层级的表现)

对比调和在平面设计中是经常用到的,整体版面要调和,局部版面要对比。对比是强调主次关系。对比调和用到UI设计中可以做到设计内容在主次关系的层级化。在统一调和的界面里又充满了对比的小情调。这正是平面不平之所在,也是一个优秀的界面所必备的。

UI设计中可借鉴平面设计技巧(版式设计1)

4、变化与统一(是UI突破同质化的一种方法)

变化与统一是形式美法则的总则。是其他方法方式的一个总结。变化所说的就是在设计中要有所创新不能总墨守成规,统一是设计要做到视觉上的愉悦而不是虽然有局部吸引人的眼球但是整体一看却是辣眼睛。变化和统一也许是突破现在APP同质化的一种方法。在现在APP同质化严重的情况下我们能做到APP的风格统一又不墨守成规寻求变化才是营造自己风格的一种方法。

UI设计中可借鉴平面设计技巧(版式设计1)

这些平面设计里的形式美法则在UI设计中同样受用。这些表面形式在做banner图构图和创意上也特别有用。

二、版式设计基本类型

版式设计的基本类型有特别多。我们这里着重分析其中对UI设计最有帮助的骨骼型、左右分割、曲线型、满版型这几个基本类型。

1、骨骼型(类似网格构图)

这里说的骨骼型就是在版式构图中,进行横竖向的分栏。能容严格按照分栏排列。版面效果沉稳厚重,井然有序,如果横竖分栏交叉排列还可制造灵动活泼的版面气氛。非常类似网格构图的方法。在UI设计中也很受用,可以很好的规范个元素的位置。(如果你对目前的界面设计一筹莫展,不妨可以试试这种方法)

UI设计中可借鉴平面设计技巧(版式设计1)

2、左右分割型(瀑布流)

左右分割不外乎就是把版面左右分开在配之以图文。在UI中的应用是随着扁平化卡片化的兴起,在移动端界面尺寸的限制下,开始进行了信息的分割处理。横向的卡片式布局使得一屏内所看到的信息受到了极大的限制(不利于用户体验,卡片式并非万能)。所以就应用的左右分割的布局。左右分割有利于信息的呈现,可以与瀑布流结合。

UI设计中可借鉴平面设计技巧(版式设计1)

3、曲线型(UI方向1)

曲线型主要表现的是韵律和节奏,可能符合一部分小众APP设计界面设计,充满了特色和戏剧性。我觉得有特色的界面设计是这些小众APP的设计核心。可以利用另类的小众的设计做吸引。

UI设计中可借鉴平面设计技巧(版式设计1)

4、满版型(UI方向2)

满版设计在平面设计中主要表达大方、舒展的设计风格。在UI移动端界面设计中寸土寸金。现在的扁平化,极简设计风格都在留白提升逼格。但是未来极简设计终将过去,我们面对的还是海量信息。

UI设计中可借鉴平面设计技巧(版式设计1)

结束语

版式设计是平面设计的一部分,也应该是UI设计的一部分。这里仅仅是说出了版式设计的一点点内容,部分的形式美法则和版式设计的基本类型。还有很多很多对UI设计有利的点没有发掘。站在巨人的肩上可以看的更远,平面设计就是我们前进的加速剂。

 

本文由 @彪形大汉 原创发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/23190/

(0)
CatherineCatherine
上一篇 2017-05-04 10:05
下一篇 2017-05-04 12:06

相关推荐

  • “用户体验”3.9万油电混合植保机演示视频

    植保季就快来到,很多植保团队以及飞手非常关注行业植保机的动向,不仅因为飞机本身的性价比高而且续航时间和作业效率同样是大家非常关心的事情。因为对于植保作业来说,作业效率关系着成本和收益,同样的植保机在单位时间内所节省的时间相当于是多出来的利润,这也就是为什么油电混合植保机能被大众所看中的缘由。近期在无人机网(www.youuav.com)发布的这款3.9万油电混合植保机一经亮相之后在植保行业中引起了足够的重视,很多朋友对其抱有足够的兴趣,...

    2018-04-24
  • 无论屏幕多大,拇指驱动的重要性不会递减

    本文着重介绍了为什么大拇指非常重要,通过我们如何抓住不同大小的屏幕来说明“拇指规则”。

    2017-05-28
  • 用户体验与seo并重的域名选择

    谈及网站域名的选择,在搜索引擎优化中,域名权重一直是困扰SOE优化的难题,因为域名权重和其他外部、内部优化不同,并不能在短时间内取得很好的效果,但是各大搜索引擎在各自的排名算法中,对域名权重“估分”却是较为重要的。在域名权重被提及初期,很多优化们使用各种各样的方法,对域名权重是否真的存在进行了繁杂的测试—毕竟各大搜索引擎的排名算法是绝对的核心商业机密,是不可能公开所有细节的。据了解经过各种测试,最后的结果均表明,域名权重在搜索引擎排名中...

    2018-04-20
  • UI交互设计只需掌握这3点

    说到交互设计,就不能不提需求,因为所有的交互设计的工作都是基于需求,这也是交互设计的第一个着力点。因此,只有深刻理解需求以后,才有可能做出好的交互设计。举一个饱含血泪的例子:在做一个项目的过程中,有一个需求是要将一个应用的数据展示做一下调整,使之能够查看在三个月之内的该数据。当时,自以为已经很了解需求,只是将时间限制放开到三个月,同时,数据的展示限制在一个月内。也就是说,可以查看三个月内任意小于三十天的时间段。优点是:1)满足了需求;2...

    2018-02-27
  • 玩转交互设计,给景观来点生命力!

    景观设计从一开始关注项日的审美性,再到功能性,全社会对于它的要求已经在逐步升高。现代景观设计中,公园、绿地,甚至校园景观、风景名胜区等需要从单纯的生态意义中提升到一个更高的层次。在诸多国内的项日中,虽然将“以自然为题,以人为本”定为设计目标,但是往往停留在服务于人们行为上的舒适性、安全性,而忽略了人性中的更多需求。与此同时,人们每天被层出不穷的新鲜事物所包围,绿色环境对人的吸引力逐渐降低。在现代化工业大发展的背景下,人与人、与其他生物间...

    2018-02-07
  • SKD独家 | 英国交互设计排名

    同学们自从上次🇺🇸美国交互设计的排名一出打算去英国🇬🇧的小伙伴纷纷表示出英国版的排名👌先以交互的分类来划分一下英国的院校:以HCI为主,偏技术研发的院校有:伦敦大学学院(UCL)Human Computer Interaction(Msc)巴斯大学(Bath)Human Computer Interaction(Msc)以UX为主,偏交互装置、技术应用院校有:伦敦传媒学院(LCC)Interaction Design Communica...

    2018-04-17
  • 机器学习相关——协同过滤,探索推荐引擎内部的秘密,第 3 部分: 深入推荐引擎相关算法 - 聚类

    机器学习相关——协同过滤,探索推荐引擎内部的秘密,第 3 部分: 深入推荐引擎相关算法 - 聚类 智能推荐大都基于海量数据的计算和处理,然而我们发现在海量数据上高效的运行协同过滤算法以及其他推荐策略这样高复杂的…

    2015-12-22
  • 华润创业、建信融通、便利蜂等4家名企春招

    求职奶爸华南最活跃的大学生求职平台旗下公号求职奶爸、校园宣讲会V、名企校招实习,50W+粉丝企业合作请加 QQ 3527488757 或微信 naibabd01(添加请备注公司名称)学生求职请加创始人微信 qiuzhinaiba101全国 | 华润创业全国 | 建信融通全国 | 便利蜂广州 | 卡宾服饰华润创业/ 公司介绍 /华润(集团)有限公司是一家在香港注册和运营的多元化控股企业集团,其前身是 1938 年于香港成立的联和行,194...

    2018-04-08
  • 3月19日部分上海实习信息汇总

    2018“猎萝卜”校园宣讲会 松江大学城专场人立方智能科技有限公司时间:3月22日 18:00-20:00地点:上海对外经贸大学 B303上海人立方智能科技有限公司,专注于人工智能与人才招聘,中国人力资源行业领军企业50强。猎萝卜(www.lieluobo.com)是公司创立于2017年的智能猎头招聘平台,服务于互联网、金融这两大领域国际知名客户及500强企业。平台上汇聚上千家优质的猎头公司,通过人工智能算法的引导,精准匹配中高端人才需...

    2018-03-19
  • 全面掌握算法交互设计,你的设计你做主

    在OF COURSE学习最纯粹的创意编程Processing生成艺术进阶课程全面掌握算法交互设计12周成为顶尖设计师👇△课程介绍《Processing&OF算法交互线上课程》你将要学习的第一部分:培养算法创造能力,学习运用高级算法模拟真实环境中的自然变化。第二部分:理解并掌握算法交互的原理。第三部分:培养软硬件结合能力,学习使用手部识别设备Leap motion、体感识别摄像头Kinect和算法的交互。第四部分:运用openCV计算机图...

    2018-04-08