2022 年完整 Web 和移动设计师：UI/UX、Figma

2022年成为设计师！掌握移动和网页设计、用户界面 + 用户体验（UI/UX 设计）、HTML 和 CSS

讲师：Andrei Neagoie

口袋资源独家Udemy付费课程，独家中英文字幕，配套资料齐全！

用不到1/10的价格，即可享受同样的高品质课程，且可以完全拥有，随时随地都可以任意观看和分享。

你将会学到的

• 使用顶级公司在 2022 年使用的现代工具为你的客户构建设计精美的 Web 和移动项目
• 被聘为设计师或成为可以在任何地方为任何人工作的自由职业者。设计师需求量大！
• 包括 100 多种资产和高级设计模板，你可以保留并使用这些模板为你未来的所有项目进行自定义
• 掌握 Figma 以满足你的设计需求，然后学习将你的设计转换为实时 HTML 和 CSS 网站
• 在课程结束时定制并专业完成令人惊叹的设计作品集（我们为你提供！）
• 掌握 Web 和移动设计原则，以及如何从草图到成熟的高保真设计，让客户赞叹不已
• 学习使用 Figma 和世界上一些顶级设计师使用的其他工具为所有类型的设备进行设计
• 学习使用 HTML5 和 CSS3 让你的设计栩栩如生并创建完整的网站
• 学习在设计行业需要数年才能学习的最佳实践
• 学习为所有品牌需求做出专业的标志和设计选择
• 学习使用行业最新趋势的 UI/UX 最佳实践
• 学习同时成为一名设计师和一名网络开发人员（一种罕见的高需求技能组合）！

要求

• 没有要求。我们教你，从头开始向你展示一切！从零到精通
• 准备好爱上设计，让你在余生中接触到的所有东西都变成美丽的项目！

说明

刚刚更新了 2022 年的所有现代设计工具和最佳实践！加入由超过 600,000 名学生组成的实时在线社区，以及由曾在硅谷和多伦多为顶级公司工作过的行业专家教授的课程。 一个伟大的设计师变得越来越难找到，现在找到年薪超过 160,000 美元的设计师并不罕见，因为这是一项非常有价值的技能。我们会教你如何到达那里！

本课程使用网页设计和移动设计以及用户界面和用户体验设计 (UI/UX) 方面的最新最佳实践，专注于有效地让你从零到可以被聘用或赢得自由职业者合同的地步。我们将使用 Figma 等按需工具向你展示从头到尾的完整工作流程。Andrei 课程的毕业生现在在谷歌、特斯拉、亚马逊、苹果、IBM、摩根大通、Facebook 等顶级科技公司工作。

该课程还 包括 100 多种资产和高级设计模板，你可以保留并使用这些模板为你未来的所有项目进行定制。我们向你保证这是最全面的设计技能在线资源！

当我们引导你从头到尾作为设计师工作时，课程将非常实用，一直到学习如何创建最终的专业设计，然后使用 HTML 和 CSS 将它们转换为实际的网站或应用程序。 

课程涵盖的主题是…

• 00 网页和移动设计原则 + 设计与网页开发
• 01 开始——素描、灵感+结构
  • 1. 素描
    • 素描简介
    • 绘制 UX 流程
    • 素描技巧
  • 2. 灵感
    • 如何保持灵感
    • 如何在网上寻找灵感
  • 3. 用户流
    • 什么是用户流？
    • 该做的和不该做的
    • 使用组件加快我们的工作流程
    • 创建我们自己的用户流程（注册）第 1 部分
    • 创建我们自己的用户流（搜索）第 2 部分
    • 创建我们自己的用户流程（结帐）第 3 部分
  • 4. 站点地图
    • 站点地图简介
    • 创建基本站点地图
    • 开始之前你应该做什么
    • 创建站点地图（第 1 部分）
    • 创建站点地图（第 2 部分）
    • 入门提示
• 02 探索和迭代——线框、原型设计和反馈
  • 1. 线框
    • 什么是线框？
    • 如何创建线框？
    • 在 Figma 中加速你的工作流程
    • 创建我们的主页
    • 创建产品页面
    • 创建结帐页面
  • 2. 原型制作
    • Figma 中的原型设计基础（设备 + 触发器）
    • Figma 中的原型制作基础（Actions）
    • Figma 中的原型制作基础知识（溢出）
    • Figma 中的原型设计基础（演示+协作）
    • 在 Figma 中将快速的用户流程链接在一起
    • 与 Figma 进行小型交互
  • 3. 获得反馈
    • 为什么反馈如此重要？
    • 如何获得建设性的反馈
• 03 视觉设计 – 设计理论 + 可访问性
  • 1.网格+间距
    • 间距和网格基础
    • Figma 中的响应式网格
    • 在 Figma 中创建我们自己的网格
    • 网格规则
  • 2. 排版
    • 排版基础第 1 部分
    • 将字体与时代相匹配
    • 排版基础第 2 部分
    • 选择正确的字体
    • 排版基础第 3 部分
    • 选择字体
    • 你的字体适合你的场景吗？
    • 扩展现有类型系统
    • 在 Google 字体中选择字体
    • 缩小你的排版选择范围
    • 在 Figma 中创建类型系统
  • 3. 颜色
    • 颜色方案
    • 挑选颜色前要问的重要问题
    • 创建调色板的有用提示
    • 创建单色调色板
    • 应用我们简单的调色板
    • 扩展严格的调色板
    • 创建我们自己的调色板
  • 4. 表单 + UI 元素
    • 什么是 UI 元素
    • 最佳实践第 1 部分：表单
    • 最佳实践第 2 部分：输入第 1 部分
    • 最佳实践第 2 部分：输入第 2 部分
    • 最佳实践第 2 部分：输入第 3 部分
    • 最佳实践第 2 部分：输入第 4 部分
    • 最佳实践第 3 部分：按钮
    • 如何在 Figma 中创建组件
    • 在 Figma 中使用原子元素
    • 在 Figma 中使用实例
    • 编辑实例以创建新组件
    • 使用约束创建响应式组件
    • 在 Figma 中创建注册表单
  • 5.图像+图像
    • 创造出色视觉资产的资源和技术
    • 在 Figma 第 1 部分中处理照片
    • 在 Figma 第 2 部分中处理照片
    • 在 Figma 中使用插图
    • 使用 Figma 插件快速查找图标
    • 创建我们自己的自定义图标
  • 6. 可访问性
    • 什么是可访问性？
    • 辅助技术
    • 可访问性的视觉模式（第 1 部分）
    • 使你的设计易于访问的工具
    • 可访问性的视觉模式（第 2 部分）
• 04 设计探索——应用设计+设计系统
  • 1. 设计模式
    • 什么是设计模式？
    • 为什么设计模式有价值？
    • 如何应用设计模式
    • 一起分析设计模式
    • 一起剖析和选择设计模式
  • 2.移动设计
    • 移动设计最佳实践（第 1 部分）
    • 移动设计最佳实践（第 2 部分）
  • 3. 应用视觉设计
    • 设计保真度
    • 风格探索（导航）
    • 风格探索（卡牌）
    • 风格探索（兴趣）
    • 风格探索（新元素）
  • 4. 运动
    • 运动的重要性
    • 运动的目的
    • 智能动画简介
    • 展示 Smart Animate 的强大功能
  • 5. 微交互
    • 什么是微交互？
    • 为什么它们如此重要？
    • 创建我们自己的微交互（第 1 部分）
    • 创建我们自己的微交互（第 2 部分）
    • 使用 Figmotion（第 1 部分）
    • 使用 Figmotion（第 2 部分）
• 05 将它们放在一起——使用我们的设计系统和 Figma 的 Hi-Fi 原型
  • 1. 设计系统
    • 什么是设计系统？
    • 粉底（颜色）
    • 基础（网格和间距）
    • 基础（排版）
    • 基金会（肖像）
    • 组件（按钮）
    • 组件（输入）
    • 组件（卡）
    • 食谱（卡片布局）
    • 食谱（搜索）
    • 食谱（订单）
  • 2. 最终作品
    • 使用我们的设计系统（搜索）
    • 使用我们的设计系统（产品描述）
    • 使用我们的设计系统（购物车）
• 06 从 Figma 到网站（采用 Figma 设计并使用 HTML 和 CSS 将其转换为实时网站）
  
• 07 HTML + HTML5

• 08 CSS + CSS3 – CSS 基础、CSS 网格、Flexbox、CSS 动画
• 09 将你的网站上线
  

这门全新的课程将带你从我们谈论平面设计的原则和基础的最基础开始，一直到创造漂亮的产品，学习 UX/UI 和交互，并创建一个完整的设计过程供你使用你未来的项目和客户。我们几乎涵盖了所有内容，以便下次你负责设计产品时，你将获得作为专业设计师工作的分步大纲和指南。

我们将教你一些技能，让你可以为你的时间收取大量费用。不要在一些随机的自由职业者网站上为每小时几美元而竞争。目标是为你提供顶级设计师的技能，并且在此过程中，我们将为你将能够添加到你的投资组合中的公司设计一个实际产品。

本课程不是要让你在不了解原理的情况下只是观看，这样当你完成课程后，除了观看另一个教程之外，你不知道该做什么。不！本课程将推动你并挑战你从绝对的初学者转变为可以被聘用的顶级设计师！设计是一项宝贵的技能，不会像大多数技术技能那样轻易过时。趋势会发生变化，但你在本课程中学到的技能和基础知识将带你进入未来很多年。

本课程适合你，如果：
– 你是一个想要成为设计师和自由职业者的完整初学者

– 你是一位希望为你的作品收取更多费用的设计师

– 你是一名希望提高设计技能的开发人员

授课人：

Andrei 是Udemy 上评价最高的开发课程的讲师，也是发展最快的课程之一。他的毕业生转而为苹果、谷歌、特斯拉、亚马逊、摩根大通、IBM、优衣库等世界上一些最大的科技公司工作……他一直在硅谷和多伦多担任高级软件开发人员多年来，现在他正在利用他所学到的一切来教授编程技能并帮助你发现作为开发人员在生活中所带来的惊人职业机会。

作为一名自学成才的程序员，他明白有大量的在线课程、教程和书籍过于冗长且不足以教授适当的技能。大多数人在学习复杂的主题时会感到麻痹，不知道从哪里开始，或者更糟糕的是，大多数人没有 20,000 美元可用于编码训练营。编程技能应该是负担得起的并对所有人开放。教育材料应该教授当前的现实生活技能，并且不应该浪费学生的宝贵时间。从为财富 500 强公司、科技初创公司工作，甚至创办自己的企业，他学到了重要的经验教训，现在他将 100% 的时间用于教授他人宝贵的软件开发技能，以便在令人兴奋的环境中掌控他们的生活和工作。无限可能的行业。

Andrei 向你保证，没有其他课程可以如此全面和解释清楚。他认为，要学习任何有价值的东西，就需要从基础开始，发展树根。只有从那里，你才能学习与基础相关的概念和特定技能（叶子）。当以这种方式组织时，学习变得指数级。

凭借他在教育心理学和编码方面的经验，Andrei 的课程将带你了解你从未想过可能实现的复杂主题。

——–

Daniel 是技术领域的设计领导者，在帮助初创公司构建和迭代产品方面拥有丰富的经验。Daniel 热衷于教授和赋予设计师权力，并与其他学科合作以构建满足用户和业务目标的有目的的产品。

他的设计方法总是深思熟虑和迭代。Daniel 经常发现自己与他的团队合作，无论是草拟概念和流程，还是与团队领导和外部利益相关者一起领导设计策略。

Daniel 是一位多面手的设计师，他的专长跨越多个设计学科。这包括用户体验和视觉设计、用户研究、产品策略、精益和敏捷设计方法等等。他的工作帮助为住房、区块链和健康等各种行业制定了不同的解决方案。

当他不构建产品时，Daniel 在不同的聚会和活动中发言和指导。他的目标是回馈他所学习并继续从中学到很多东西的设计社区。Daniel 的目标是在他们的职业生涯中始终帮助、教授和支持其他设计师。

课程内见！

此课程面向哪些人：

• 任何想以自由职业者的身份开始 Web 或移动设计业务或在公司担任设计师的人
• Web 开发人员和移动开发人员希望在他们的工具带中添加另一项有价值的技能
• 任何想被聘为网页设计师、移动设计师、UI/UX 设计师的人
• 任何想了解最新的 CSS3 功能（如 Flexbox、CSS 网格和 CSS 变量以及 HTML5）的人