当前位置: 首页 >> APP界面设计_APPUI设计_APP设计素材 >> 阅读正文

手机APP设计教程之四条APP产品设计黄金法则

今天25学堂跟大家来学习一下建筑大师如何把建筑设计思维运用到移动APP设计当中来的。

废话少说,我们直奔主题吧!

追波网APP

手机APP设计教程之四条APP产品设计黄金法则

 

第一条设计黄金法则:轴的把控

轴在UI设计中是最基本、最常见的概念,也是用来组织界面结构的重要核心。简单说来,轴是在设计的时候组织一系列元素的假象线,轴以虚线的方式被标注出来。也类似我们在ps里面设计的标尺、参考线一样的。

我们的日常生活中绝大多数的事情都是有序的,我们更倾向于享受有序的的东西,它们令人感觉平稳、舒适、平易近人。

如下图列表的排列:

iOS7_iPhone_Vector_Mockup

运用了对齐、向下滑动、连续性、加强等原则。

也符合APP设计当中,轴的定位和以轴为设计的准则。

 

第二条设计黄金法则:对称与平等分

当元素被均匀地放置在轴线的两侧之时,他们构成了对称的关系。当元素被精准地在轴线两侧一一对应之时,它们就形成了完美对称。

当元素与控件在轴线两侧处于相同位置之时,会给人以协调和谐的设计感。这类布局很适宜阅读,用户会自觉地自上到下,从左向右查看。

app-on-iphone

 

在APP界面设计里面,常用的设计布局就是九宫格或者是六宫格等。

九宫格的源头可是我们中国人发明的一种构图模式,但巧的是它与黄金分割有着惊人的理论联系!大家们把画面的上下左右用黄金分割来做出4条线,我们惊奇的发现这就是我国古人所说的九宫格!

人们发现在九宫格的4条线交汇的4个点是人们的视觉最敏感的地方,在国外的摄影理论里把这4个点称为“趣味中心”。顾名思义,被反复证明的是当被摄主体处于或发布在这4个点附近最容易得到“眼球”

如下图的排列:看起来是不是很舒服呢?

logo之家

 

这就是美学设计当中的黄金比例合理运用和解读。

 

当然还有一种是不对称设计,我们常见代表产品就是瀑布流设计的花瓣网。

不对称的设计会给人明显的失衡感,可能会令人不舒服,但是也能造就残缺美,当然这要看你具体怎么做。值得我们去发挥设计创意的地方。

 

 

第三条设计黄金法则:层级关系

重点体现的时候,这个时候就会出现层级的关系。 谁要突出,谁要弱化些,谁在上面,谁在下面,谁先处理,谁后处理 等等。这些都是应用了手机APP设计当中的层级关系。

1、形状与尺寸

比如如果一个设计元素在尺寸上比其他的控件更大,就会区分出层级。毫无疑问,我们查看某个设计的时候,通常会被最大的元素吸引到。如果一个建筑物有5个出窗户,其中一个是其他四个的两倍大,我们的注意力自然而然会被吸引过去。

每日瑜伽

 

2、位置的摆放

位置的存在同样能彰显层级的不一样。在圆圈之内,中心位置的东西比边缘部分的看起来更重要。位于轴线顶端的控件会显得比其他部分的优先级更高。

 

第四条设计黄金法则:节奏、韵律与风格

古代的诗词都会有押韵一说。我们设计移动APP界面设计的时候,也是如此。

木薯美妆

节奏与韵律的概念来自于音乐,是体现形式美的一种形式,有节奏的变化才有韵律之美。

节奏是艺术表现的重要原则,各种艺术形式都离不开节奏:节奏是按一定的条理、秩序重复连续地排列,形成一种律动的形式。它有等距离的连续,也有渐大、渐小、渐长、渐短、渐高、渐低、渐明、渐暗等排列构成,就如同春、夏、秋、冬的四季循环。节奏的重复使单纯的更为单纯,统一的更为统一。
韵律不是简单的重复,而是比节奏更高一级的律动,是在节奏基础上更超于线形的起伏、流畅与和谐。韵律是宇宙之间善遍存在的一种美感形式,它就像音乐中的旋律,不但有节奏,更有情调;它能增强版面的感染力,开拓艺术表现力,牵动人.fl的思想感情,引起观者的共鸣。
节奏与韵律的运用,能创造出形象鲜明、形式独特的视觉效果.表现轻松、优雅的情感,通过跃动提高诉求力度。从而形成一派风格。

所以,手机UI界面设计也要学会营造出独特的节奏韵律之美,才是上上之作。

具体设计体现在    模式一样,布局一样。合理的间断处理等。

APP列表中每一间房子都占据一个模块,模块中有着大小相同的图片,价格、位置和房东信息和图片的相对位置一定,且排版匀称舒服,两个模块之间的间距也相同,当你浏览的时候,熟悉的节奏会让你清楚地知道上哪看关键信息。

feely  chat APP2

APP设计欣赏

以上就是今天25学堂跟各位分享的手机APP设计教程之四条APP产品设计黄金法则。

希望帮助各位在APP界面设计当中,明确很多设计的方向,而不是随意的摆放和设计。



无觅相关文章插件,快速提升流量

本文标题:手机APP设计教程之四条APP产品设计黄金法则

本文地址:http://www.25xt.com/appdesign/8895.html

本文关键词: , ,

除非注明,本站文章均为原创或编译,转载请注明出处和原文链接,转载同时请务必保留原网站网址。