移动UI设计的流程包括分析调研、交互设计、交互自查、界面设计、界面测试、设计验证等环节,如图1-21所示。
图1-21
下面以App界面设计为例,介绍移动UI设计的常见流程。
App设计需要根据品牌的调性、产品的定位来进行。定位不同的App,设计风格也会有区别。图1-22所示为3款旅游类App界面。这3款App虽然同是旅游类产品,但设计风格也有差异。因此在设计App界面前,要先分析客户需求,了解用户特征,并进行相关竞品的调研,明确设计方向。
图1-22
交互设计是对App设计进行初步构思和确认的环节,一般需要进行纸面原型设计、架构设计、流程图设计、线框图设计等具体工作,如图1-23所示。
图1-23
交互自查是App设计流程中非常重要的一个环节,可以在执行界面设计之前检查出是否有遗漏的细节问题,如图1-24所示。
图1-24
原型图审查通过后,即可进入界面的视觉设计阶段,该阶段的设计图即产品最终呈现给用户的界面。界面设计要求尺寸规范,内容真实,并运用墨刀、Principle等软件制作成可交互的高保真原型以进行后续的界面测试,如图1-25所示。
图1-25
界面测试是指让具有代表性的用户进行典型操作,设计人员和开发人员共同观察、记录,如图1-26所示。在界面测试中可以对设计的细节进行调整。
图1-26
设计验证是指产品正式上线后,通过用户反馈的数据验证前期的设计,并加以优化,如图1-27所示。设计验证是移动UI设计的最后一个环节,也是对App进行优化的重要支撑环节。
图1-27