任何一款APP都有个人主页页面，在此页面中将保存一些用户的信息设置，以及一些用户个人行为的操作。一般我们会将用户常用的操作将进行提炼，做成醒目的卡片式，不太常用的操作做成列表式。整个界面力求工整、简洁、美观。

【 任务引入 】

【 项目思维导图 】

学习任务

重点、难点

突破方法

1.个人主页头部的绘制；

2.个人主页卡片区绘制；

3.个人主页列表区绘制。

重点：1. 个人主页头部的绘制；

          2.个人主页卡片区绘制；

          3.个人主页列表区绘制；

难点：1.个人主页头部绘制；

          2.个人主页列表区绘制。

采用翻转课堂、项目导入的教学模式，采用分组讨论、案例教学、演示动画等教学方法，运用在线教学平台。

知识目标

能力目标

素质目标

1.掌握个人主页头部的绘制。

2.掌握个人主页列表区的绘制。

3.了解卡片区的常见布局。

1.能够了解个人主页的一般布局形式；

2.能进行个人主页的设计。

1. 养成积极主动学习意识；

2. 养成勤于动手的习惯；

3. 培养团队合作能力。

课程思政——梦想

效果图

【 视频讲解】

知识储备

    1、个人主页任务分析

任务实现

    1、个人主页头部的绘制

    2、个人主页卡片区绘制

    3、个人主页列表布局

拓展任务实现

    1、商品详情页绘制1

    2、商品详情页绘制2

【 资料下载 】

单元设计

          电商APP个人主页设计

课程教案

          电商APP个人主页设计

演示文稿

        电商APP个人主页设计课件.pdf

任务工单

          电商APP个人主页设计

素材下载

     订单查询.png

         礼品.png

         快递图标.png

         切换.png

         素材.rar

         商品详情页素材.rar

课内同步项目

          商品详情页绘制

练习题

       1、练习1

疑难问题解答

     1、HBuilder需要注册才能使用吗？