视觉UI的重要性
先看看发型的重要性：
视觉设计的作用
确定页面元素的重要性，区分视觉层次，引导用户沿着正确的路径（视觉传达流程）到达目的地。
在传统购物环境，我们走进一家商店，听到的问候就是“有什么可以帮助您的或您需要什么？”，然而，在网上购物是没有导购的，那么视觉设计师有能力改变这种情况，为用户设计视觉路径，创造一个无缝的和令人愉快的浏览体验，可以在门口代替微笑迎宾。 视觉路径引导用户从一处到另一处，并允许设计者控制信息的感知和顺序。因为读者一次只能吸收一定量的信息，就必须采用分阶段的方式呈现内容。引导用户分步刀刀目的。
设计的视觉路径
开始设计视觉路径，设计师必须标签每个页面元素（图片、内容、链接、按钮等）并为客户明确元素的重要层级。基于这样的视觉层次框架，有助于在设计整体视觉路径时，作出正确的抉择。
设计方法
1、颜色：使用一到两个颜色，作为一个视觉路径。
选择一个主色（或称为关键色），它仅适用于对整体页面等级高的关键领域或元素。主色作为一个核心的信息承载元素，引导用户。
例如： Watchery选定自己品牌的颜色，紫色，作为他们的主色。其组成包括导航，紫色的横幅广告、按钮、标签、图标、甚至在产品详细信息、选项卡、列表。用户无法区分不同元素的不同意义和层级也就步伐理解元素应该有的意义。
重新设计
建议重新设计，仍然采用紫色作为主色但限制紫色在整个设计中的使用数量。突出主色的权重，展示其在页面中的主导地位。
增加辅助色，黄色（紫色的补色），用来突出用户在本页面可能执行的关键动作。例如“添加到购物车按钮”，在整个页面中黄色表现为暖色调，能够帮助用户快速地找到他们。
2、字体：使用一致的字体，颜色，和行为来让用户快速浏览网页。
我们已经不止一次的验证一个事实：用户不喜欢阅读。混乱的字体、颜色只会让用户尽快离开页面。剔除不需要的信息，并减少字体样式和颜色的使用。通类型元素分配一致的行为。
watchery.com至少有九种字体的设计，并且混杂着不同大小，颜色，和行为。
重新设计
建议的设计最大限度地减少型数量的差异，允许用户快速学习的行为模式和集中精力的重要内容。
我在以前的文章中读到更多关于设计和一致性，盒子外思考，但别忘了盒子的存在
3.基于网格（栅格）设计：使用网格（栅格）系统平衡和组织设计。
当所有的元素似乎在于他们的位置，组成平衡，需要从用户的角度来看，没有思想，使他们能够专注于内容。模块化网格允许灵活的布局来生活，保持组织的完整。
watchery.com内容出现非结构化信息是不一致的背景颜色分开，形状（内容和横幅边框、图标），并对齐元素，造成用户的困惑和不确定。
重新设计
基于网格，增加控件留白，并使元素相对独立，使用更少的背景色和元素明确信息层次。
一旦所有的元素都到位，就会形成视觉路径：
- 导航
- 主要产品的图片和标题
- 价格
- 用户关键行为
- 销售和促销活动
结论
重新设计一个网页或网站之前，必须考虑整体业务目标和用户角色来确定元素层次。一旦层级设置，采用平面设计的基本元素有助于给用户一个清晰的视觉路径。
@http://uxmag.com/articles/visual-design-and-usability-yellow-brick-road
