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 实践成果优秀学生作品
项目4  设计奶茶店用户表单

一、项目需求

  茶颜悦色的线上商城需要设计表单，“登陆表单”和“用户表单”

二、项目背景

       茶颜悦色以茶饮和甜品为主打，根据港粤台的饮品创意奶茶店，运用复合创新思维顺势推出的最新一代立体复合型餐饮业态。品牌风格定位是新中式鲜奶茶店，大量使用水墨、书法、白描等极具中国传统绘画风格的设计元素。

三、项目分析

根据进度条设计方法和规范，结合风格定位特色，进行进度条效果设计

四、项目尺寸及要求

   1、登陆表单

   包含功能：账号、密码、注册、找回密码

   风格：新中式

   画布尺寸：1125*2436

   分辨率：72

   色彩值数：RGB

   2、用户表单

   包含功能：账号信息、会员功能

   风格：新中式

   画布尺寸：1125*2436

   分辨率：72

   色彩值数：RGB


五、项目方案