4网页设计师的视觉设计原则

你准备好创建有吸引力和新鲜的设计,代表你的品牌?运用我们的基本视觉设计原则和留下编码。

没有发现。

每一个设计寻求创建一种团结不同的元素,或创造性地打破这种团结鼓励一个特定的行动。这里所讨论的原则将帮助你。

当你打开一个编辑套件或落笔的时候,每一个视觉设计使用创建不同元素或创造性的颠覆之间的团结,团结鼓励一个动作。

视觉设计是一种艺术形式,它也是由数学定律。你不从隐喻的空白画布开始作为一个设计师:有一些简单但强大的指导方针,创造和破坏统一设计。网页设计师应该给应得的学分:你有完形心理学家感谢你每天使用的管理视觉设计原则。

设计的原则是什么?

你可能学过设计在小学美术课的原则。

当浏览一个绘画、雕塑、小册子或电子邮件,你可能会立即,情绪反应。你知道的,本能的,不管你喜欢还是不喜欢。然而,那些没有受过训练的设计可能无法用言语表达的原因。视觉设计原则帮助我们理解的视觉作品。设计的基本原则包括:

  • 空间:在网页设计中,这通常被称为“空白”,或元素之间的区域。
  • 层次结构:一些元素的重要性尊重他人。
  • 对比:不同的元素如何创建一个更有凝聚力的作文。
  • 规模/比例:元素的大小之间的关系。

虽然这些原则是与视觉艺术,网页设计师应用设计原则构建从这些核心理念。

完形是什么意思?

剑桥词典定义完形为:

结构、配置或模式的物理、生物、或心理现象综合,构成一个功能部件的属性不是可诱导的各部分的总和

如果你想:“嘿,精心设计的网站将“完形”,“你是对的。

格式塔心理学家不都姓“完形。“德国心理学家马克斯•沃什米科特Koffka和沃尔夫冈·科勒研究人类大脑如何处理复杂的图像和模式在一个混乱的世界。他们想知道,“人们如何到达有意义的认知的混乱他们的大脑感知?通过努力,这些科学家们发现四个核心概念描述人类如何解释视觉数据。

了解用户在移动设备和桌面解释每个像素在你的网站上让你更清晰,更直观的设计师。一般来说,完形原则取决于整个大脑处理信息的想法之前更小的部分。

设计的四个基本原则扩展到13个具体的经验法则视觉经验在设计时要考虑你的下一个前沿网站。之前深入世界的每一个格式塔原理,掌握这些视觉设计原则。

出现的原则

建筑的核心思想认为完形圆,出现的原则州观众试图理解整个图像各部分之前确定。

所以,当你的大脑是消化一个图像,并试图理解它,首先,它将股票的轮廓。然后,它比其他形式的轮廓你的记忆,并试图找到一个匹配。一旦找到匹配,你的大脑运动每个组件。当你的大脑不能找到一个匹配,它试图检查组件的整体形象。

如果你看到一个模糊的轮廓,晚上一个人走远,你的大脑马上知道这是一个人从身体的形状和个人四肢。你不需要看到手或眼睛或脚,知道它是一个人,但这些视觉细节帮助您确定这个人是谁。

设计的出现是什么意思?

你可能听说过cringey但真实表达“保持简单,愚蠢!“在许多地方;可惜的是,这是你的网站。当设计,出现建议你应该坚持的原则熟悉,容易识别的模式。

我们知道你想离开你的签名印章在你的下一个表单设计,与真正的开箱即用的演讲打动你的经理。但是,对于你的用户,最好坚持他们见过的样式。

明确提出与“发送”按钮和标签框将被认为是一种更快速更“创造性”,使网站访问者做心理体操明白他们在看什么。

等等!不要点击。的出现并不意味着你应该停止创造性地设计。出现表明层次的视觉解释:观众开始整个然后重点部分。

用你的视觉风格和令人印象深刻的知识当前设计趋势要有创意单独的表单元素,只要整个图像识别的形式。极简主义的出现提供了一个令人信服的论点:简单比复杂的形式更容易识别。所以,当一些烦人的老师曾经说过,“保持简单!“我们不会叫你傻子。”

原则的具体化

具体化原则指出,你的大脑充满缺口视觉信息来识别对象。你不需要看到整个的理解它是什么——如果一个设计只包括一个鼻子,一只眼睛,和下巴的轮廓,可以推断出你看脸。

因为原理的具体化和它在你的头脑,你没有麻烦认识停车标志甚至切成一半的时候:

停车标志
即使有一半的形象消失了,你得到它,对吧?

设计具体化是什么意思?

具体化意味着你不必包含所有对象的观众认识到。你可以使用这一原则来节省空间布局,显示下一张幻灯片的内容在一个旋转木马,或者让你的“很快”页面更清晰和更诱人。

具体化是最小的logo设计美观。人类总是试图把意义和毫无意义的混乱,和我们的眼睛,通过具体化:缺失数据的填写的我们看到的东西。

让我们来看一个具体的方式把物化在一个网站。左边的图像是“前”的形象——看看正确的调整,利用的原则具体化做出更令人难忘(和更少的混乱)布局。

设计具体化

多稳定性原则

阅读有关的原则多稳定性可能会让你觉得你被困在一个宿舍新生哲学专业,所以我们做这个简单:多稳定性解释了为什么你可以看到只是脸,或只是著名的光学错觉的花瓶,但从来没有在同一时间。

视错觉的面孔或花瓶
脸还是花瓶?多稳定性意味着你真的可以只看到一次。

思想不是船上的未知。从进化的角度来看,大脑需要一个答案,现在。这种需求来自寻求安全,但它有迷人的对视觉设计的影响。大脑专注于看到的东西的一种方式和排除可能的替代品。迷人的,对吧?您可以看到兽性作为一个建筑创新或天灾,原本质朴的城市蒙上了一层阴影。让我们继续前进。

设计多稳定性是什么意思?

如果你的蜘蛛侠感觉刺痛,很好——多稳定性必然导致混乱,所以很难实现网站设计中成功。我们寻求团结和凝聚力,而不是混乱!

但是,正如许多难忘的标志已被证明在过去的几年里,你可以使用多稳定性显著而又愉快地惊人的设计,如联邦快递的标志。一旦你看到这个箭头(E和X),另一个具体化的箭头表明,真很难重新。

联邦快递的标志
多稳定性意味着你会看到箭……一旦你注意到它。

不变性原理

不变性原理指出,你的大脑是擅长精确定位相似点和不同点。这就是为什么它很容易做一些类似对象的在人群中脱颖而出。

记得穿红裙子的女士在矩阵吗?这个小女孩在红色的夹克在辛德勒的名单吗?这两个突出很多,依然如此难忘的——因为他们明亮的颜色几乎尖叫的同质黑白背景我们看到他们移动。它标志着他们是有意义的,值得你的注意。

设计不变性是什么意思?

在设计领域,不变性原则是一个强大的工具。介绍不同的元素在一个同质组元素吸引眼球的内容,请点击。

欧宝体育在线首页产品的定价页是很棒的位置为具体化。网页设计师可以让一列脱颖而出的定价表通过颜色或大小。“取消订阅”页面,“取消”按钮可以小和灰色融入背景,“订阅”按钮时充满活力,丰富多彩。

定价表Envato现代引导4的网站

这个定价表从Envato的现代引导4网站主题明确执行不变性,使“企业”定价选项坚决反对其他的选择。

Envato订阅设置

通过观察MileIQ计费页面,你可以告诉他们想要用户采取什么行动。“编辑支付信息”按钮色彩鲜艳的激励是一个点击,“取消订阅”按钮时几乎不明显。

这四个视觉设计原则如何不同于UI设计技巧吗

视觉设计的原则,以及完形的经验法则,适用于整个画面和整个设计的大脑是有意义的。我们的前UI设计技巧,另一方面,提供可行的建议,为设计师在每个单独的元素。阅读我们的UI设计分解学习技巧,覆盖规模,平衡,层次结构,和对比等概念。

你准备好创建吸引人,新鲜的、有凝聚力的设计,代表你的品牌完美?应用我们的基本视觉设计原则和留下编码——看看我们Webflow教程发现如何开始构建网上先设计经验。

免费的电子书:101年网页设计

掌握网页设计的基本概念,包括排版、色彩理论、视觉设计、更多。

订阅是一个Webflow内幕
谢谢你!你现在订阅!
哦!发生了一些错误,同时订阅。
读到现在

发表

2021年3月24日

类别

网页设计

加入谈话

Webflow是什么?

免费试一试
更多的设计师

设计师

CSS, HTML和JavaScript在视觉画布。

的相互作用

构建网站的交互和动画视觉。

更多的互动

CMS

定义您自己的内容结构和设计与实际数据。

CMS的更多信息

电子商务

再见模板和代码——视觉设计你的商店。

更多关于电子商务

编辑器

编辑和更新网站内容的页面。

更多关于编辑器

举办

建立了闪电般的管理托管在几个点击。

更多关于举办
Baidu
map