10款帮你搞定整页专题设计的方法分享(2)

UI / UI设计教程 / UI教程 /      

uimaker
UI设计师 / 江苏 南京

来源:优设   作者:马良重生

关键词

02、承上启下很重要,页面有头也有尾

所谓的承上启下,就是说页面中要有一个贯穿整体的主要元素,去构成整张页面的视觉焦点。

让元素头尾呼应,上下连贯。

举个例子:

01.图中红圈所示

专题中出现的主要元素如:头和尾部的元素要在视觉上做到呼应和一致性;

02.图中黑圈所示

专题中贯穿整体的这个元素,一定要在整体页面中一笔直下,一气呵成,否则就会出现断点的感觉。如果在实际需求应用中无法做到整体设计的表现,那么也应该尽量在局部或者某些元素的运用上做到这点。

10款帮你搞定整页专题设计的方法分享

03、背景颜色要整体,慎用色块“切豆腐”

尽量不要用色块进行页面内容的分区,整体的单页设计大多用的是单一颜色的背景。

对于一些平台型的活动单页来讲,我们常看到一些用不同色块分区的设计。当然,这样的处理方式是为了更好的分出不同的活动内容,也是做为设计的表现形式。

对于品类专题、店铺首页来说多色块的分隔显然整体性会差一些。

如下图。

01.左图是整块的暗蓝色的背景,没有任何分区,整体页面看着比较统一;

02.右图是分块的浅色系的背景,利用颜色进行分区,使得整体页面比较活泼和俏皮。

(注:并不是说不能用多色块对页面内容进行分区,而是要看具体的需求和主题,选择用不同的形式去表现)

10款帮你搞定整页专题设计的方法分享

04,,由点到面整体感,切记东拼和西凑

上面讲到元素的重复出现是为了更好的连接由点到面的整体感;

但是出现在整体中的元素或东拼西凑、或风格千奇百变的话,那么单页的整体性还是会大大折扣。

无论从排版上、字体选择上、按钮样式、色彩等方面都要做到一致性,这样的单页才是整体的。

如图所示:

10款帮你搞定整页专题设计的方法分享

05,一眼看完3屏多,不做留白就得晕

单页因其把所有信息和元素都集中表现在一整张页面中,所以单页设计也注定是能超过3屏以上的页面设计。

既然是长版的整体页面,信息量又都很大,那就应该对每屏间的高度适当控制,既要保持屏与屏之间的可呼吸性和留白,给人们放松和喘息的空间。

举个例子:

10款帮你搞定整页专题设计的方法分享

留白并不是特指白色哦〜!〜

在使用留白时,要注意不要因为页面有留白和大空隙的出现,使得整体视觉的连接上,出现视觉断点的情况。要尽量做到屏内可紧、屏外可松,让整体页面充满节奏感。

06、整体想了,整体做,整体看

整张页面设计强调的是整体从点、到线、再到面的构思和表现,它不光只是产出一个首屏视觉(头图)和一个内容区各自独立的体现。

而更多的要求我们在设计中用放大局部来看细节,缩小页面来看整体页面的方法去完成一张超高的,具有创意和实用平衡的页面设计。

举个例子,如图所示的几个放大效果,在细节的处理和技巧上都是很棒的哦。

10款帮你搞定整页专题设计的方法分享

 收藏