实训目的

通过制作App产品原型，将策划书的内容可视化，将每一个页面中的功能可视化，使设计出的UI符合App功能需求

实训内容

确定App产品应用的系统，确定UI页面的基本结构和布局，根据策划书和思维导图完成App功能页面的绘制，为相关页面建立超链接。掌握原型制作软件的使用。

实训要求

教师指导2学时，学生课后8学时或以上。

需完成二级页面原型，如下图。

实 训 过 程 记 录

步骤简述：

实训目的

（1）通过图标组的绘制，确定App项目UI的风格。（2）在熟练使用软件工具的同时，熟悉不同系统对图标制作的要求。

实训内容

（1）完成底部标签栏图标的设计制作。（2）完成App功能图标的设计制作。（3）完成App导航栏上功能图标的设计制作。

实训要求

教师指导2 学时，学生课后用8 学时或以上。

需给出图标组效果和图标组交互效果，如下图。

实 训 过 程 记 录

步骤简述：

实训目的

通过实际操作，完成App项目所有页面UI的制作。

实训内容

合理并美观的呈现页面中的不同功能，按照规则在页面中输入文字，按照规则在页面中使用图片，控制好页面中元素的边距与间距。区分不同系统中需要注意的要点。

实训要求

教师指导6 学时，学生课后用20 学时或以上。

需按照策划内容完成所有二级页面内容，如下图。

实 训 过 程 记 录

步骤简述：

实训目的

通过交互效果的添加，展示App项目的结构关系，使用户在使用App时获得良好的用户体验。制作元素展示动画和页面展示动画，便于开发人员准确理解UI设计意图。

实训内容

制作元素交互效果，制作页面的交互效果。

实训要求

教师指导 2 学时，学生课后用 16 学时或以上。

需完成所有二级页面间的交互设置，如下图。

实 训 过 程 记 录

步骤简述：

实训目的

通过输出不同倍率的素材，适配采用不同分辨率屏幕的设备，以获得最好的浏览效果。

实训内容

分别针对iOS系统和Android系统的特点，完成向上或向下适配设备的操作。

实训要求

教师指导 2 学时，学生课后练习 4 学时以上

需完成iOS系统App3种适配元素输出；Android系统App5种适配元素输出，如下图。

实 训 过 程 记 录

步骤简述：