移动应用界面视觉设计的9个步骤

从交互设计到视觉设计是一个从抽象化到具象化的过程。正如杰西·詹姆斯·加瑞特（Jesse James Garrett）的用户体验要素模型所表述的那样，视觉设计属于表现层，而交互设计则属于结构层。交互设计与视觉设计是一个相互影响和合作的过程。移动应用界面视觉设计流程可以按照品牌视觉定位、关键词、集合、提炼和萃取、情境板、设计探索、视觉风格标准、视觉元素组件和修正9个步骤进行（见图6-12）。

1）品牌视觉定位：熟悉该品牌的品牌文化，系列产品的区分点以及明确目标用户，并结合市场分析深刻理解该品牌的独特属性及战略定位。

2）关键词：通过与相关竞品比较分析，在品牌定位与用户需求的基础上，归纳出能够全面体现品牌及产品专有属性的关键词，为后续设计的开展起到指导作用。

3）集合：在设定好的关键词指导下，收集一些能够让用户在情感和认知上得到共鸣的图形图像材料；其中颜色的控制主要在设计流程的集合和提炼萃取这两个步骤完成。在集合过程中所收集的图片是基于目标用户和关键词的，因此当收集的图片数量达到一定程度后，其颜色或质感等属性图片会按一定规律向某一类相似属性进行集中。

图6-12 移动应用界面视觉设计的具体流程

4）提炼和萃取：从收集的图形图像材料中提取具有代表性的颜色或质感等属性。提炼和萃取的关键是明确设计目标，尤其是确定能够让用户得到共鸣的情感方向，这就需要设计师本人全身心地融入到目标期望（关键词）的环境之中，以便从中发掘具有代表性的颜色或质感等属性。(www.xing528.com)

5）情境板：设计一些简单的基本框架来匹配从集合材料中提炼和萃取的风格和样式。在情境板设计阶段中，重点在于能让设计师自由地进行一些概念性的设计，使个人情感能够轻易地融入设计的主题之中，并对类似的和不同的概念思考有明显的识别，从而更充分地继承前一阶段的工作。

6）设计探索：从不同的视角反复完善界面的设计雏形，提出更多的基于情境板中感受到的风格和样式。在展示设计阶段，需要在前一阶段设计的基础上，通过不同的视角、环境尝试不同的方法，创造出更多更具创新的设计版本。

7）视觉风格标准：从展示设计中根据产品的设计策略和功能属性精选出最适当的设计来决定产品的最终视觉风格作为后续的设计标准。

8）视觉元素组件：根据最终定稿的风格和布局来设计其他的界面组件。

9）修正：提炼和萃取、情境板和设计探索是界面视觉设计流程的核心阶段，为了让视觉设计得到更多用户在情感和认知上的共鸣，需要在复杂的情境中进行验证并获取不同的反馈，在分析反馈的基础上作出合适的设计修正。