UI界面设计

高会杰

目录

  • 1 课程介绍
    • 1.1 课程概述
    • 1.2 初识UI
      • 1.2.1 设计师能力及原则
      • 1.2.2 设计流程
      • 1.2.3 设计参数
      • 1.2.4 强化练习
      • 1.2.5 UI思政:殷切希望
  • 2 模块一:基础元素设计
    • 2.1 项目1  设计火宫殿应用图标
      • 2.1.1 认识图标
      • 2.1.2 任务1火宫殿线性图标设计
      • 2.1.3 任务2火宫殿扁平图标
      • 2.1.4 任务3火宫殿拟物图标
      • 2.1.5 设计拓展
      • 2.1.6 强化练习
      • 2.1.7 UI思政:从业道德
    • 2.2 项目2  设计乌山森林公园导航栏
      • 2.2.1 初识导航栏
      • 2.2.2 任务4设计乌山森林公园顶部导航栏
      • 2.2.3 任务5 设计乌山森林公园底部导航栏
      • 2.2.4 设计拓展
      • 2.2.5 强化练习
      • 2.2.6 UI思政:守法品德
    • 2.3 项目3  设计线上超市按钮
      • 2.3.1 初识按钮
      • 2.3.2 任务6设计超市购物提交按钮
      • 2.3.3 任务7设计超市购物车按钮
      • 2.3.4 设计拓展
      • 2.3.5 强化练习
      • 2.3.6 UI思政:从业规范
    • 2.4 项目4  设计奶茶店用户表单
      • 2.4.1 初识表单
      • 2.4.2 任务8设计奶茶店登陆表单
      • 2.4.3 任务9设计奶茶店用户表单
      • 2.4.4 设计拓展
      • 2.4.5 强化练习
      • 2.4.6 UI思政:与人沟通
    • 2.5 项目5  设计游戏加载进度条
      • 2.5.1 初识进度条
      • 2.5.2 任务9 地图下载进度条
      • 2.5.3 任务10 视频加载进度条
      • 2.5.4 设计拓展
      • 2.5.5 强化练习
      • 2.5.6 UI思政:行业变化
  • 3 模块二 类型界面设计
    • 3.1 项目6   设计“众商银行”APP主界面
      • 3.1.1 主界面设计思路
      • 3.1.2 任务13 设计众商银行APP主界面
      • 3.1.3 设计拓展
      • 3.1.4 强化练习
      • 3.1.5 UI思政:文化自信
    • 3.2 项目7   设计“微博公益”启动页界面
      • 3.2.1 启动界面设计思路
      • 3.2.2 任务14 设计微博公益启动页界面
      • 3.2.3 设计拓展
      • 3.2.4 强化练习
      • 3.2.5 UI思政:德艺双馨
    • 3.3 项目8 设计“湘帮扶”APP产品详情界面
      • 3.3.1 详情界面设计思路
      • 3.3.2 任务15  设计“湘帮扶”大米商品详情界面
      • 3.3.3 设计拓展
      • 3.3.4 强化练习
      • 3.3.5 UI思政:为民生而设计
    • 3.4 项目9  设计智能家居APP控制界面
      • 3.4.1 设计思路
      • 3.4.2 任务16  设计智能家居APP控制界面
      • 3.4.3 设计拓展
      • 3.4.4 强化练习
      • 3.4.5 UI思政:职业责任
  • 4 模块三 高阶综合实训
    • 4.1 综合项目1   长沙美食企业APP界面设计
      • 4.1.1 项目需求
      • 4.1.2 设计思路
      • 4.1.3 步骤实训
        • 4.1.3.1 设计推荐界面
        • 4.1.3.2 设计登录界面
        • 4.1.3.3 设计餐品主界面
        • 4.1.3.4 设计订单界面
        • 4.1.3.5 设计个人用户界面
    • 4.2 综合项目2 “M music”音乐播放APP界面设计
      • 4.2.1 项目需求
      • 4.2.2 设计思路
      • 4.2.3 步骤实训
        • 4.2.3.1 设计登录界面
        • 4.2.3.2 设计歌单广场界面
        • 4.2.3.3 设计专辑介绍界面
        • 4.2.3.4 设计视频播放界面
        • 4.2.3.5 设计启动界面
  • 5 优秀学生作品
    • 5.1 设计趋势
    • 5.2 实践成果优秀学生作品
课程概述
  • 1
  • 2 课时分配
  • 3 学习建议
  • 4 考核标准


1.课程性质

《UI界面设计》是数字媒体应用技术专业的专业核心课程。

2.课程定位

《UI界面设计》是对应移动互联网开发岗位群中UI前端设计岗位的岗位核心课程。UI设计课程通过各类APP界面设计案例的学习与实践,培养学生运用各种软件、美学原理、移动UI设计基础等知识解决界面布局规划、创意思路产生、定义组件风格最终完成项目制作。

课程的前置课程为:《构成》、《Photoshop》、《交互设计》。

课程的后续课程:《After Effect动效设计》、《h5互动广告设计》《微信公众号设计与维护》《数字媒体产品设计》。 

3.课程目标

课程符合适用专业人才培养方案中的培养目标和培养规格的要求,在专业课程体系结构中承上启下,对学生职业能力培养和职业素养养成起到明显的促进作用。

(1)知识目标

① 掌握UI设计基本概念及流程;

② 掌握UI界面构成元素分类

③ 掌握多种UI界面设计风格;

④ 掌握UI界面设计尺寸规范。

(2)能力目标

① 能够设计UI界面组成元素;

② 能够设计出符合规范的UI界面;

③ 能够实现多种风格的设计效果;

    ④ 能够系统性的根据需求完成多界面的UI设计。

(3)素质目标

① 具有一定的学习能力、沟通与团队的协作精神;

② 形成良好的思考问题、做事严谨的工作作风;

③ 养成良好的职业素养,遵守国家关于软件与信息技术的相关法律法规,具有良好的职业道德。