UI设计基础理论
您不需要图形设计学位就能创建出令人赞叹的图形。您只需要了解一些基本的图形设计基础。这就是我们将在本文中回顾的内容。
设计有四个基本原则：
色彩理论
意象
版式
作品
想要图形设计方面的速成课程超出设计基础吗?就拿上HubSpot学院数字营销研究所的全平面设计课程。
您需要了解的4个平面设计基础
1.颜色理论
颜色是正确设计的关键要素。它用于吸引注意力，传达含义，当然也用于美学。我们通常甚至不考虑我们要看的颜色;我们会快速判断事物，并经常根据其颜色立即衡量某事物是否令人满意，专业，美观，丑陋甚至怪异。
考虑使用颜色最重要的是它们之间的对比度。对比度是指一种颜色与另一种颜色脱颖而出的程度。例如，您可以在图像中使用对比色以使文本从其背景中脱颖而出。互补色，例如黄色和紫色，或蓝色和橙色，可以提供最大的对比度。
资料来源：99个设计
资料来源：99个设计
对比也可以用来指导人们的行为。让人们知道您想要他们做什么。如果您想增加“点击率”，请确保号召性用语按钮与设计的其余部分之间存在强烈的对比。
颜色还赋予视觉提示含义。例如，绿色按钮通常表示肯定的动作，例如“确定”或“接受”。但是，如果您设计一个大的“接受”按钮并将其变为红色，则可能确实会使用户感到困惑，并且在某些情况下，结果可能是灾难性的。
让我们谈谈品牌使用的最常见的颜色，以及它们可以从受众中激发出什么含义或感觉。
红色可以激发强烈的情绪-积极和消极的情绪，产生紧迫感-这就是为什么它可以有效地促进销售。它还会刺激食欲，因此在快餐行业经常使用。
橙色，另一种温暖的颜色，被认为是轻便而有趣的，因此它不太适合“公司化”的感觉品牌。较深的橙色阴影与秋天相关，这使其更适合“土特产”品牌。
绿色在眼睛上很容易，并且是健康的代名词。因此，您经常会看到它被宣传保健品的品牌(例如药品或食品品牌)使用。它也可以与金融或军事组织等增长或权力联系在一起。
另一方面，蓝色对心灵有镇定作用，是理性的色彩，也是力量，智慧和信任的色彩，这就是为什么它被广泛使用的原因。对于品牌来说，这是一个安全的选择，但是品牌需要考虑它是否会帮助他们在自己的空间中脱颖而出。
像《芭比娃娃》和《大都会杂志》一样，粉红色历来被用来描绘女性气质。但是如今，许多主流品牌都在使用它，而不论其受众是谁，例如Lyft。它描绘了青年，但也激发了安慰并代表了希望。Pink已在许多行业中成功用于“打破常规”。
黑色是奢华与力量的代名词。与少量明亮的颜色结合使用时，它可以为复杂程度增加能量。黑色非常适合某些行业，例如时装，但可能不适用于其他行业，例如健康。
白色和银色代表清洁度，通常用于现代外观。但是，由于缺乏个性，因此需要谨慎使用。许多品牌使用白色来补充另一种更为主导的颜色。如果执行得当，则在设计中添加白色可提供现代，简单且干净的外观。
2.意象
我们已经看到图像非常适合数字媒体，但是需要考虑一些一般性的观点。首先，观众对其中有人物的图像反应良好。由于广告系列针对的是真实的人，因此您需要建立情感联系，而您的图像需要体现这一点。
平面设计简介1：设计基础
图像质量也很重要。当客户考虑在线购买时，他们希望能够仔细检查能够提供产品高细节信息的图像。人们通常会放弃电子商务站点，因为产品图像的质量不够高，无法帮助他们做出决定。这会对他们对产品的印象产生负面影响，您可能会失去销售。
因此，当您选择图像作为设计的一部分时，请确保您的图像是高清或高清的，并且适合您的受众使用的设备。它们不应被拉伸或像素化。
接下来，请记住，大多数网络流量都来自移动设备-因此，在移动设备上测试图形以确保它们在较小尺寸上仍然可以正常显示非常重要。如果没有，请考虑创建单独的图形版本，以专门向正在使用移动设备的用户显示。
以下是针对不同屏幕尺寸的最佳图像尺寸的指南：
横幅图片：宽2000像素，长800像素
滑块：宽1920像素，长890像素
图标：宽300像素，长300像素
发布/活动：宽425像素，长220像素
作品集：宽1920像素，长768像素
3.版式
那么您使用的版式或字体呢?在为视觉选择字体时，不要试图做一些与众不同的事情，这一点很重要。读者希望看到熟悉的字体，例如系统字体，例如Arial，Helvetica，Roboto。单个网页上最多可以使用两到三个字体系列，而广告和图片则可以使用更少的字体系列。请注意下图。您可以算出多少种字体?
您还将遇到“ Serif”和“ Sans-serif”字体。“ serif”是添加到角色的细小装饰线。最常见的衬线字体是Times Roman。没有衬线或“ sans serif”的常见字体是Helvetica。衬线字体用于提高博客，文章或报纸之类的文本的可读性。尽量不要在每行中使用超过10个字。对于标题，请考虑使用较大的重量级无衬线字体。确保根据其优先级对文本应用正确的强调(或大小和“权重”)。
最好不要将文本直接添加到图像中，尤其是在Web设计中，而是与您的Web团队一起在图像上覆盖响应文本。为什么?图像上文本的问题在于，如果图像在移动设备上，则有时文本太小而无法阅读。
另一个考虑因素是本地化。由于文本是固定的，因此无法自动翻译。下图显示了一个通过某度翻译翻译成匈牙利语的网站。您会看到号召性用语不是HTML，而是包含文字的图片，这意味着文字无法翻译。
如果您需要添加文本(例如社交媒体图像或博客图像)，请确保有足够的颜色对比度。例如，这里的网站已经用两种背景颜色进行了分析。第二个具有更好的对比度，这使文本更易读。像本例一样，快速添加“ hack”以增加更好的背景色对比度的方法是使边框变暗。
请记住：这是一张图像加上您的消息，它的措辞以及甚至使用的字体的组合，这可能意味着在吸引受众方面成功与失败之间的区别。
一旦知道了图像的颜色，图像和字体，就需要以最佳方式将它们放在一起-这就是组成的地方。您的目标应该是使设计尽可能简单和优雅。消除混乱和视觉噪声有助于用户一次专注于一项任务。
删除所有不必要的信息后，应确保内容(即所有图像，按钮，颜色，形状和文本)的排列顺序清晰且逻辑合理。
每一图形设计内容都应达到一个目的。在创建设计时，请问自己：“它的目的是什么?” 它应该引导用户做某事吗?通知他们?
轻推他们继续阅读?填一张表格?还是只是在这里给他们提供信息?即使您为内容考虑了多个目标，也请选择一个并确保您的设计可以使最终用户清楚地知道目标是什么。
现在，让我们谈谈设计中简化的力量。正如用户体验专家尼克·巴比奇(Nick Babich)所说，
“极简主义不是剥离元素，而是要添加足够的要素以使它们讲述您的故事。”
有两种使您的设计保持简单的关键方法。首先，请确保您使用空格;其次，删除所有不是绝对必要的东西。空格有助于将注意力集中在您希望用户看到的任何内容上。它帮助用户避免被他或她正在看的东西所淹没。设计中的每个项目都应该有一个目的。不必要的信息会使您的设计复杂而分散注意力。
“空白”的一个很好的例子是博客平台Medium。Medium的网站不会因广告标语或令人沮丧的弹出窗口而分散用户注意力。相反，它优先考虑正确的内容，并显示读者实际想要查看的信息。实际上，它没有显示发布日期，而是显示了阅读所花的时间–非常聪明!