设计经验:说说UI设计中的构图

_轻轻的看着

_轻轻的看着

2016-01-29 10:01

设计经验:说说UI设计中的构图,想成为一个合格的UI设计师,光会画图标可不行,今天360的@Micu设计小哥从头帮你补上版式这一课,分享他的界面构图三板斧,此外,你还能学会如何用设计语言解构画面,这可是设计师的必备职业能力呦!

很多人说:“人家设计得真好!”可是好在什么地方呢,却说不出来。这是阻挡你成为优秀设计师的一大障碍。设计是我们的本行,不会用设计语言来解构画面,是说不过去的。

移动互联网设计发展到今天,有很多传统的设计规律可以遵循,也提出了新的挑战。因为手持设备屏幕较小,如何在有限的页面内呈现或引导有效信息,又不显得杂乱臃肿,考验着设计师的能力。

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/shejililun/)

为什么有的主题或App界面就那么舒服,那么清新,那么有情怀?里面蕴含着哪些最基础的版式设计理念,让我们一块梳理梳理,给初入UI设计的同学做个参考。

今天和大家讲讲构图。

构图版式三板斧

问题一:为什么要讲版式设计?有必要么?

就以我刚入行UI设计失败经历为鉴吧,那时候,一拿到需求就马上开始设计,根本就不管什么版式,结果设计出来方案总是很别扭,显得特别乱,往往被扣上“风格不统一”“用户体验差”的帽子。最开始我也是说服不了自己,觉得别人不理解自己的作品。现在想想确实当时存在问题。UI设计必然离不开设计师的天马行空,但是它毕竟是要面向大众市场,做成全世界只有自己能理解的孤品有什么意义呢,UI里的“用户体验”又体现在什么地方呢?而这样的设计又反过来阻碍了你的设计生涯,长期的失败设计很容易带来挫败感和麻木感。

尤其是作为初入行的UI设计师,更有必要学习一些版式设计思路。所谓创新,也仍然需要在了解已有的好设计基础之上进行,这里说这些不是让你生搬硬套,是让你站在前人的肩膀上看得更远。

问题二:为什么一开始就要构图呢?

设计和绘画一样,对需求和内容进行分析,采用适当的构图可以化繁为简,提高设计效率。在尝试比较多种构图后,设计师的思路会更加明确。期间耗费的时间成本最低,可以反复进行调整,直到找到最为合适的构图方式再往下进行细化,添加元素,丰富画面。

一个项目给设计师的时间是有限的,我们核心重点在于弄清楚产品的功能核心和卖点,把它们凸显出来,最终让用户获得更为舒服的体验。而杂乱无章的堆积会显得非常的糟糕,甚至有时候,用户会因为找不到自己想要的东西而马上流失,留下非常不好的印象。通过前期构图,可以节省时间,让设计更有条理。

问题三:构图,会限制设计的创造力吗?

不会的。

设计的痛苦莫过于“没有思路”和“漫无边际”,这两者都源于需求分析不够,同时也与事先没有做好构图工作有关。构图为设计提供了明确的尝试方向,甚至通过不同的构图可以产生的交互效应,达到意想不到的效果。限制创造力的问题不要担心,因为构图只是一个框架,同类型的构图完全可以做出不一样的风格。虽然设计构图结构相同,但设计的表现方式和元素不同,仍然能够塑造出不同的设计赶脚。灵活运用构图和布局更能让你把设计集中在元素和产品特色上。

废话不多说,下面我将和大家介绍以下几种在界面中常用的构图方法:

九宫格构图圆心点放射形构图三角形构图SF字形构图一、九宫格网格构图

这种版式主要运用在分类为主的一级页面,起到功能分类的作用。

通常在界面设计中,我们会利用网格在界面进行布局,根据水平方向和垂直方向划分所构成的辅助线,设计会进行得非常顺利。在界面设计中,九宫格这种类型的构图更为规范和常用,用户在使用过程中非常的方便,应用功能会显得格外的明确和突出。

九宫格给用户一目了然的感觉,操作便捷是这种构图方式最重要的优势。

九宫格看似简单随意,用好了同样能呈现出奇妙的效果。

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/shejililun/)

灵活运用九宫格辅助线区分出来的方块。在有规律的设计方法中找突破,做设计一定要注重这一点!

在九个方块分配的时候,不一定要一个格子对应一个内容,完全可以一对二,一对多,打破平均分割的框框,增加留白,调整页面节奏,或突出功能点或广告。各个方块的不同组成方式,页面的效果也会产生无数的变化。

我们可以看出这样的版式,同样可以使界面变得非常的灵活,内容简单,信息明了。

展开更多 50%)
分享

猜你喜欢

设计经验:说说UI设计中的构图

设计理论 网页设计素材 签名设计 教学设计 版式设计
设计经验:说说UI设计中的构图

浅谈UI设计中动态设计应该是隐形的

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
浅谈UI设计中动态设计应该是隐形的

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

设计中的构图比例:网页设计与摄影全解析

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
设计中的构图比例:网页设计与摄影全解析

腾讯QQ欢乐斗地主游戏UI设计经验分享

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计 单机斗地主
腾讯QQ欢乐斗地主游戏UI设计经验分享

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

图标UI设计

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
图标UI设计

UI设计欣赏:优秀图标设计

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
UI设计欣赏:优秀图标设计

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

设计一个优秀的LOGO应该遵循怎样的思路?

设计一个优秀的LOGO应该遵循怎样的思路?

新年福利!2016年给大家的第一波设计圈干货大合集

新年福利!2016年给大家的第一波设计圈干货大合集
下拉加载更多内容 ↓