一　作业要求

1.设计制作一套UI的大作业

首先确定UI设计的表现形式。比如APP、交互触摸屏、H5等等。而设计构思的通常会包含以下几个方面，首先是确定小组的主题和方向，从大量收集的资料里面筛选，以对目标的人群进行分析。其次是产品痛点的分析，方便在使用的过程中发现问题，利于故事板进行描述。从而完成方案的确定和低保真原型的设计。最后，根据老师的意见对低保真设计进行修改，完成高保真的设计和视频的制作。

2.设计分组

通常根据项目制作的复杂程度，设计小组由两到五位同学组成，根据同学们不同的特长进行分工。比如有的同学擅长绘画，可以设计插画或者图标LOGO设计；有的同学熟悉程序，可以负责后期的开发或者视频制作；有的同学负责低保真和高保真的原型设计；擅长三维制作的同学则可以进行模型的设计和制作。这样进行分工之后，小组就可以开始UI的设计与制作了。

图13　草稿设计　作者：陈梦洁

图14　h5设计草稿　作者：廖佳乐

图15　h5效果图　作者：廖佳乐

3.竞品分析

在进行UI大作业设计的时候，竞品的分析是非常重要的。首先细分筛选和我们产品定位相似的竞争对手的产品。通常在竞品分析好之后，会做相关的分析报告。

挑选竞品可以在各个应用市场进行搜索，比如：App Store、Google Play、安卓第三方应用市场，里面有很多的竞品。如要设计一款体育运动类的APP，我们就可以搜索KEEP、小步点、咕咚等。根据竞品分析的前提，定义搜索的范围，明确要挖掘的信息，如产品的功能产品的定位、市场竞争交互设计或者是视觉设计等等。由以上的分析得出竞品分析的报告。

4.调研对象——用户画像

用户画像是根据用户的目标、行为和观点的差异，分析、搜集和整理，将他们区分为不同的类型，然后从每种类型中抽取出典型特征，形成了一个人物原型（personal）。用户画像核心作用是给目标用户“打标签”。用户画像所形成的用户角色需要代表产品的主要受众和目标群体，可以从五个方面为用户画像贴标签，从而对用户进行分析和描述。进而设计师能了解相对应的服务人群，分别是生理属性、社会属性、行为属性、场景和需求。

（1）生理属性——姓名、年龄、性别。

（2）社会属性——职业、收入、地区。

（3）行为属性——人物描述、兴趣爱好。

（4）场景——使用APP的场景。

（5）需求——包含时间、地点、人物、动机、事件、结果，而事件则是冲突的事件越多越合理就越好。

图16　KEEP

图17　小步点

图18　咕咚

图19　用户画像　作者：陈梦洁

5.思维导图

思维导图，英文名叫The Mind Map，是一种用来开展、记录发散性思维的图形工具。通过思维导图，我们可以很清晰地了解到产品的功能定位、内容定位、内容走向、核心竞争力等重要的信息。我们可以使用软件XMind设计制作。

图20　XMind 提供各种结构图

图21　XMind 提供各种结构图

6.故事板产品的核心功能(https://www.daowen.com)

用故事板描写产品的核心功能。故事板是通过图文结合的方式，绘制用户在完成一个完整的任务流程时的场景，即用户在什么环境下，为什么使用我们提供的功能的一个故事。它通过时间线描述整个故事流程，可能更像连环画，从而形成具有统一设计风格的故事板。

图22　图片来源　https：//i.pinimg.com/originals/68/f9/e3/68f9e3298b49fa16c365e979157c1a47.jpg

图23　图片来源　电影《狮子王》前期的故事板

图24　故事板　作者：陈梦洁

老师点评：作品绘制较好，但是时间线不清晰，需要写清楚时间线

7.低保真设计（也叫线框图设计）

在前面的章节我们有过简单的介绍，低保真原型（线框图设计）一般指有限的功能和交互原型设计。低保真原型是在纸上画的草图或原型，也可以是在电脑上设计的产品页面。低保真原型的作用是表现产品中最重要的用户流程和功能所涉及的页面关系，一般由项目团队的交互设计师完成，通常先设计出低保真，然后再根据低保真原型设计高保真。设计的时候要注意以下六点。

（1）用深浅不同的灰来表现层次和重点功能。

（2）选择适合的图标，或者用占位符替代，辅以文字注释。

（3）同类的功能、内容放置相同区域。

（4）适当的留白（留空间）。

（5）没有适合的图标可以用占位符表示，但是需文字说明。

（6）图片占位符，若对图片内容或风格有想法，可用文字描述、手绘参考图示等形式在交互文档中表现出来。

8.高保真设计

高保真原型：几乎完全按照实物来制作的原型就是高保真，原型中甚至包含产品的细节、真实的交互、UI等等。