For investors
股价:
5.36 美元 %For investors
股价:
5.36 美元 %认真做教育 专心促就业
我们在进行网页设计和网页内容填充的过程中,由于采用的设计方法不同以及填充的内容元素的差异性,我们通常会增加不同的设计思维在我们的产品之中。
今天,我们就一起来了解和学习一下,当我们在进行网页开发的时候,都有哪些设计思维是可以使用的,下面我们就开始今天的主要内容吧。
重复几遍,就形成了一种流行节奏,现在的世界是一个多元的包容的世界。每个人都有不同的style,就像你说“睡什么睡出来high”,他却喜欢静静地宅着玩一把王者……跟节奏一致的人相处会很愉悦,而节奏相悖的人需要磨合。同一个事物见仁见智,但我们都习惯用自己的经历和经验去看待事物,学院派也好,野路子也好,雅俗共赏,我想寻找的是一种相对理性的设计理论,属于我们共有的经历和经验,那些潜移默化对我们的影响,暂时定义为节奏。
从进化论的角度而言,人们对节奏的认知,最初来源于大自然的规律,以及新陈代谢的生物作息。随着人类模仿大自然、劳作协调动作的声音、发展了音乐、诗歌、卦象、绘画…所以广义上而言,节奏包含世间万事万物,但狭义上大家理解的节奏可能是一个节拍、一首歌的曲调。
就像耳熟能详的节奏有“嘣恰恰、嘣恰恰”和“咚次哒次”,我将节奏用图形化的语言来说明一下,图中从黑到灰色代表声音渐弱,竖线分割每个小节,重复小节形成一段简单的节奏,形成“强弱弱”“强弱次弱”的有规律变化,而简单的重复让人可预知、可掌控,自然而然的产生舒适感。
结构的节奏
设计上也通常会改变构图中物体的大小、间隔、方向渐变等的节奏来实现,从以上对比图中,可以明显看出来左图的方块、球体大小变化更有节奏,营造出一种近大远小的空间感。
应用到网页上,最明显的就是页面结构布局设计,适当穿插的左右排列,打造起伏流畅的曲线观赏路径,仿佛细细流淌的小溪,吸引用户追本溯源不断向下滑动,同时也避免了所有信息累积在一起的压迫感。
首尾错位叠加的布局,给人一种故事开头结尾和丰富过程的完整阅读体验。可见,构图节奏能增加舒适感、缓解视觉疲劳,让画面更有起伏感。
但需要注意的是,错位构图带来的节奏是较慢的浏览式体验,并不适合快速获取信息的信息流。
信息流中过于跳跃的界面设计,让用户上下浏览的时候,很难快速定位店名、位置等信息。所以像新闻、快报等资讯类app设计都是一致的图文方向,这样更符合用户快速阅读的惯性。继续深思下去,如果要一致的图文为什么又要增加与图文不一致的三小图和大图信息呢?这不就打断了节奏吗?没错,就是故意打断阅读节奏的,为了让用户不至于长期阅读相同结构而产生视觉疲劳,但怎样的频次和节奏才是最好的呢?
构图中文字的排版也可以运用设计节奏,例如通过字体、字号、颜色、深浅、字间距、段落等的节奏变化来体现。如图将普通的文字段落,先按主次区别,改变一成不变的阅读体验,将标题与内容相呼应,将文字与背景构图融合,倾斜对齐体现文字的力度。
可见,文字的节奏能突出主次、避免大段文字的阅读压力、横纵向的阅读呼应也能有不一样的阅读体验。
形状的节奏
如果说结构的节奏是整体布局的把控,那形状的节奏就是通过形状的变化对画面所传达信息的扩展,其中最为突出的是表现在“渐变”和“聚散”两种形式。
渐变是指以类似的基本形或骨格,渐次地、循序渐进地逐步变化,呈现一种有阶段性的、调和的秩序。包括:同一个形状的颜色、大小、间隔、方向、位置的变化,也有多个形状的关联性变化。
聚散是一种特殊的重复,是基本形或骨骼单位环绕一个或多个中心点向外散开或向内集中,即爆发式(外扩形)和聚焦式(内收型)。特点:具有很强的聚焦点,这个焦点通常位于画面的中央;具有一种深邃的空间感,使所有的图形向中心集中或者由中心向四周扩散。
颜色的节奏
颜色的节奏指的是画面中颜色明度、纯度和色相的有规律变化。提取图中背景色,通过左图纯度轴来显示色块位置,会发现它们按照一条连贯起伏的曲线渐变,这样可以让颜色的变化更自然舒适,高高低低的纯度变化营造出微妙的色彩空间感,利用红色吸引用户注意力的同时,避免高纯度的红色,增加低纯度的用色比例,控制颜色的比重让红色更显沉稳。第二张则明度上做了跳跃式选色处理,“高低低-高低”的节奏感仿佛一首欢快的歌,营造出一种青春活力氛围。
提取图中颜色会发现,颜色奇妙的成为了五星型,通过互补色+对比色叠加取色的方式结合归纳的一种取色方法,它可以让画面丰富多彩,也可以让不知道用什么颜色的小伙伴,很快选择颜色。但需要注意的是一定要基调色稳住场面,上图就是深紫色“压住”全场,让其他亮色尽显活力。放射型则通过颜色的深浅变化,过渡到不同色相,让原本“突兀”的颜色也能和谐相处。
可见,颜色的节奏能够增强画面乐趣,通过颜色五星型、放射型等规律渐变,丰富视觉感官,营造画面活力。
动静的节奏
动静的节奏大家第一感觉会想到动画或者gif,除了上图中微动态照片,仅仅通过一张静态的画面能表现动态吗?
当然,只要运用“常识”和“认知”就可以让观看者联想到动态,例如:速度很快,看不清物体,只留下残影,会让人们觉得物体动起来了,并且速度很快。
运用这样的常识,我们用PS中的速度模糊就可以在静态的图片上表现动态效果。同样的模糊效果可以加快速度,是否也可以减缓速度呢?细细观察生活,发现浴室里的磨砂玻璃可以隔离浴室空间,浴室内水声沥沥,室外安静祥和;同样酒吧也会用磨砂玻璃隔离空间,在模糊的背景后,你可以安静下来,哪怕外面high翻天,你也可以静静着。
留白的节奏
留白的节奏也可称之为节奏的间歇停顿。
我们先做一个小测试,以上4张海报,那张是阿甘正传的官方海报?
只有一张是原版,其他三张都是我PS处理,去掉或者移动局部得到的图。
留白除了使画面平衡之外,还可使画面透气,产生强烈对比,就像全都是重点就没有重点,全都画的很细致也无法抓住重点。虚实结合才能塑造出一个比较平衡的画面,有节奏的画面。
【免责声明】:本内容转载于网络,转载目的在于传递最新信息。文章内容为作者个人意见,本平台对文中陈述、观点保持中立,不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。