动效|网站作为互联网产品如何平衡艺术与商业，网站设计需要掌握哪些思维？( 二 )

这种方法需要我们很好地提取logo中的部分结构，或根据造型转变为动效、icon等，这样在网页中的融入感是十分可观。
2. LOGO的“色”提取logo中的标准色或代表性的颜色与网页元素相呼应，也是一种常见的方式。将Logo颜色通过网站中的文字、页面板式、icon设计表现出来，这是很好的一种呼应方法。
比如：绿色是绿革的标志性颜色。打开绿革官网，可以清晰直观地看到绿革将logo中的两种绿色元素，融入到网站界面UI中，需要突出的文案也会运用这两种绿色去做表达和强调。

文章插图
绿革LOGO

文章插图
绿革官网首页展示
在网站设计中，我们可以将标准色换到标题文字、icon、控件。访客打开网站时会很容易被这些颜色吸引，也不会感到突兀，合理运用logo颜色，可以统一网站的整体视觉，且做到突出重点与更有效地传达信息。
品牌VI在网站设计中的应该如何应用？
品牌VI可以在三个维度应用到网站设计，来提升网站的辨识度：
1. ICON图标设计品牌VI的应用常见的方式就是在icon图标的设计上，icon作为网站的重点图形，能够让访客感知品牌，精致的icon可以让表达更简单高效，要打造一套精致的icon，我们可以从识别性、规范性、整体性和品牌感四个方面着手。

文章插图

识别性：icon的作用即是帮助访客理解网站信息，特别是在没有文字说明的情况下，icon的设计需要具备让访客快速认出的高识别度，不能让访客产生疑惑。

规范性：每个icon要保持视觉大小、色彩等一致性，以及图标饱满度等细节都需遵循同一规律，例如：绘制风格是否一致，使用的圆角或直角是否统一等等。

整体性：除了icon自身的设计之外，整体的设计风格要与网站基调达成一致，不同网站有不同定位，面向的目标访客群体自然有所差别，那么整个网站的icon设计也不一样。

品牌感：提升品牌辨识度离不开品牌感，icon设计要与品牌调性、理念相符合，传达给访客一致的感受。比如：提取品牌色、采取品牌图形作为图标设计视觉元素，从而加深访客对品牌色的感知。

icon设计中的品牌感是将品牌VI应用到网站的关键，比如上方的那套icon，是由增长超人根据英威腾本身的品牌色彩和品牌调性进行设计，应用于官网是这样的：

文章插图
另外，icon是网站中不可或缺的元素，充当路标，让访客能知道点击后下一步是什么，也就有明确的心理预期。如果icon按钮不够明确，访客可能会不知道下一步是要购买产品或者注册用户的步骤，并且可能直接浏览网站后就直接离开。
2. 版式设计版式的如何融入品牌调性是很多设计师会忽略的一点，访客来浏览网站时，首先感受到的第一点是色彩，第二则是版式，也就是整体给访客的感觉。
符合品牌定位且具有辨识度的网页版式设计应该怎么做，它更需要从品牌特性中提取，无法像icon一样从品牌logo和标准色中提取元素就可以做到的，更多是一个风格化的设计。
举个例子，这是一家高端的共享办公室服务企业，从他们的品牌VI中可以感受到高端、轻奢、个性等关键词，在其官网中，我们可以看到其与众不同的板式设计，一眼就能感受出其品牌调性。