Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум

  1. Урок 1. 00:05:28
    Welcome
  2. Урок 2. 00:01:07
    Week 1 Project Introduction
  3. Урок 3. 00:01:46
    Design History Overview
  4. Урок 4. 00:03:12
    The Printing Revolution
  5. Урок 5. 00:09:47
    Typographic Milestones
  6. Урок 6. 00:09:14
    The Industrial Revolution
  7. Урок 7. 00:14:41
    The Modernist Era
  8. Урок 8. 00:08:35
    20th Century Design
  9. Урок 9. 00:13:38
    The Digital Revolution and Beyond
  10. Урок 10. 00:02:58
    Design Elements: Line
  11. Урок 11. 00:03:17
    Design Elements: Shape
  12. Урок 12. 00:00:47
    Design Elements: Form
  13. Урок 13. 00:01:53
    Design Elements: Size
  14. Урок 14. 00:00:56
    Design Elements: Texture
  15. Урок 15. 00:00:55
    Design Elements: Value
  16. Урок 16. 00:02:15
    Design Elements: Color
  17. Урок 17. 00:03:37
    Design Elements: Typography
  18. Урок 18. 00:03:07
    Design Principles: Emphasis
  19. Урок 19. 00:03:30
    Design Principles: Proximity
  20. Урок 20. 00:02:02
    Design Principles: Balance
  21. Урок 21. 00:01:58
    Design Principles: Alignment
  22. Урок 22. 00:01:07
    Design Principles: Unity
  23. Урок 23. 00:01:13
    Design Principles: Space
  24. Урок 24. 00:00:56
    Design Principles: Repetition
  25. Урок 25. 00:01:55
    Design Principles: Framing
  26. Урок 26. 00:45:17
    Week 1 Project
  27. Урок 27. 00:01:25
    Week 2 Overview and Project
  28. Урок 28. 00:02:04
    Introduction to Grids
  29. Урок 29. 00:00:55
    Grid Anatomy
  30. Урок 30. 00:04:59
    Types of Grids
  31. Урок 31. 00:01:32
    Layout Grids
  32. Урок 32. 00:03:34
    Exercise: Designing grids in Figma
  33. Урок 33. 00:05:18
    Common Layouts – Portfolio
  34. Урок 34. 00:06:18
    Common Layouts – Marketing Site 1
  35. Урок 35. 00:05:18
    Common Layouts – Marketing Site 2
  36. Урок 36. 00:04:25
    Common Layouts – Marketing Site 3
  37. Урок 37. 00:07:11
    Common Layouts – News
  38. Урок 38. 00:03:51
    Common Layouts – Store
  39. Урок 39. 00:02:55
    Common Layouts – Blog
  40. Урок 40. 00:03:45
    Introduction to Visual Hierarchy
  41. Урок 41. 00:02:13
    Type Hierarchy – Examples
  42. Урок 42. 00:10:40
    Type Hierarchy – Tips
  43. Урок 43. 00:12:05
    Exercise: Building a type scale
  44. Урок 44. 00:06:32
    Color + Contrast
  45. Урок 45. 00:03:42
    Exercise: Building a grayscale color palette
  46. Урок 46. 00:09:36
    Proximity + Whitespace
  47. Урок 47. 00:02:03
    Fontanello + Chrome DevTools Inspector
  48. Урок 48. 00:10:04
    Exercise: Redesign Mimi's Kitchen website
  49. Урок 49. 00:01:42
    Exercise: Quick overview of final design
  50. Урок 50. 00:13:44
    Exercise: Navigation and hero section
  51. Урок 51. 00:04:20
    Exercise: Welcome section
  52. Урок 52. 00:06:58
    Exercise: About Mimi's section
  53. Урок 53. 00:07:29
    Exercise: Quote section
  54. Урок 54. 00:05:47
    Exercise: Catering section
  55. Урок 55. 00:08:15
    Exercise: Final sections
  56. Урок 56. 00:09:33
    Week 2 Project: Introduction and Navigation
  57. Урок 57. 00:08:27
    Week 2 Project: Hero
  58. Урок 58. 00:12:14
    Week 2 Project: Explore Neighborhoods
  59. Урок 59. 00:08:10
    Week 2 Project: Eat, See and Do
  60. Урок 60. 00:04:37
    Week 2 Project: Blog
  61. Урок 61. 00:08:36
    Week 2 Project: New on The Block
  62. Урок 62. 00:04:47
    Week 2 Project: Newsletter
  63. Урок 63. 00:05:23
    Week 2 Project: Footer
  64. Урок 64. 00:02:11
    Week 2 Project: Neighborhood page
  65. Урок 65. 00:02:12
    Week 3 Overview and Project
  66. Урок 66. 00:14:50
    Designer Spotlight — Elizabeth Goodspeed
  67. Урок 67. 00:02:11
    Introduction to Color
  68. Урок 68. 00:08:21
    Color Relationships
  69. Урок 69. 00:05:06
    CMYK vs. RGB
  70. Урок 70. 00:01:57
    Color Interactions
  71. Урок 71. 00:10:51
    Color, Brands and Emotions — Part 1
  72. Урок 72. 00:07:29
    Color, Brands and Emotions — Part 2
  73. Урок 73. 00:06:14
    Tips for Creating Color Palettes
  74. Урок 74. 00:05:06
    Exercise: Checking your wireframe's contrast
  75. Урок 75. 00:06:18
    Exercise: Eyedropping photography
  76. Урок 76. 00:01:47
    Exercise: Create a complementary palette
  77. Урок 77. 00:03:35
    Exercise: Create an analogous palette
  78. Урок 78. 00:02:08
    Exercise: Create a monochromatic palette
  79. Урок 79. 00:01:45
    Exercise: Try it on two more photos
  80. Урок 80. 00:01:30
    Exercise: Review + share color palettes!
  81. Урок 81. 00:08:38
    Color Inspiration
  82. Урок 82. 00:00:23
    Quick Look: SuperHi Color Guide
  83. Урок 83. 00:15:34
    Industry Talks — Laura Bohill
  84. Урок 84. 00:05:42
    Typography Introduction + Anatomy
  85. Урок 85. 00:02:47
    Serif: Old Style
  86. Урок 86. 00:03:42
    Serif: Transitional
  87. Урок 87. 00:03:12
    Serif: Modern
  88. Урок 88. 00:03:13
    Serif: Slab
  89. Урок 89. 00:02:56
    Sans Serif: Humanist
  90. Урок 90. 00:03:33
    Sans Serif: Geometric
  91. Урок 91. 00:03:34
    Sans Serif: Transitional
  92. Урок 92. 00:01:34
    Script Typefaces
  93. Урок 93. 00:02:41
    Display Typefaces
  94. Урок 94. 00:01:57
    Pixel Typefaces
  95. Урок 95. 00:02:26
    Monospaced Typefaces
  96. Урок 96. 00:05:19
    How To Choose the Right Typeface
  97. Урок 97. 00:07:17
    Typefaces In Use: Case Studies
  98. Урок 98. 00:08:56
    Exercise: Choosing typefaces for families
  99. Урок 99. 00:10:01
    Exercise: Choosing typefaces for digital nomads
  100. Урок 100. 00:09:48
    Exercise: Choosing typography for foodies
  101. Урок 101. 00:05:38
    Exercise: Choosing typography for photographers
  102. Урок 102. 00:00:44
    Quick Look: SuperHi Typography Guide
  103. Урок 103. 00:12:39
    Introduction to Accessibility
  104. Урок 104. 00:05:56
    Exercise: Checking color contrast
  105. Урок 105. 00:00:28
    Quick Look: SuperHi Accessibility Guide
  106. Урок 106. 00:19:33
    Industry Talks — Tatiana Mac
  107. Урок 107. 00:04:45
    Week 3 Project Overview
  108. Урок 108. 00:30:40
    Adding Typography to The Block
  109. Урок 109. 00:19:12
    Adding Color to The Block
  110. Урок 110. 00:16:51
    Adding Photography: Hero
  111. Урок 111. 00:05:26
    Adding Photography: Homepage
  112. Урок 112. 00:05:05
    Adding Photography: Neighborhood
  113. Урок 113. 00:09:46
    Adding Icons to The Block
  114. Урок 114. 00:01:32
    Week 4 Overview + Project
  115. Урок 115. 00:06:27
    What is a Brand?
  116. Урок 116. 00:08:58
    The Branding Process
  117. Урок 117. 00:11:45
    Reviewing Brand Identity: Google
  118. Урок 118. 00:12:13
    What Makes Brands Successful?
  119. Урок 119. 00:03:59
    Project 4 Overview + Brief
  120. Урок 120. 00:04:38
    Understanding the Problem
  121. Урок 121. 00:07:54
    Conducting Market Research
  122. Урок 122. 00:02:53
    Figuring Out Your Target Audience
  123. Урок 123. 00:17:18
    Brand Questionnaire
  124. Урок 124. 00:07:45
    Moodboarding
  125. Урок 125. 00:11:19
    Naming Your Brand + Designing Your Logo
  126. Урок 126. 00:01:51
    Week 5 Overview
  127. Урок 127. 00:37:46
    Industry Talks — Noemie Le Coz
  128. Урок 128. 00:03:44
    Visual Identity: Moodboard
  129. Урок 129. 00:15:57
    Visual Identity: Color Palette Exploration
  130. Урок 130. 00:18:33
    Choosing A Final Color Palette
  131. Урок 131. 00:11:24
    Visual Identity: Type Pairing 1
  132. Урок 132. 00:05:50
    Visual Identity: Type Pairing 2
  133. Урок 133. 00:07:02
    Visual Identity: Final Type Pairings
  134. Урок 134. 00:04:59
    Visual Identity: Type Setting + Writing About Choices
  135. Урок 135. 00:05:47
    Visual Identity: Graphic Elements
  136. Урок 136. 00:06:20
    Visual Identity: Brand Voice
  137. Урок 137. 00:02:11
    What Are Brand Guidelines?
  138. Урок 138. 00:14:55
    Brand Guidelines Examples
  139. Урок 139. 00:07:03
    Brand Guidelines Overview
  140. Урок 140. 00:05:08
    Brand Guidelines: Title + Table of Contents
  141. Урок 141. 00:05:58
    Brand Guidelines: Moodboard + Introduction
  142. Урок 142. 00:05:53
    Brand Guidelines: Logo
  143. Урок 143. 00:03:02
    Brand Guidelines: Color
  144. Урок 144. 00:14:52
    Brand Guidelines: Typography
  145. Урок 145. 00:11:44
    Finishing Brand Guidelines
  146. Урок 146. 00:14:59
    Deron Millay Interview
  147. Урок 147. 00:01:41
    Week 6 Overview
  148. Урок 148. 00:12:39
    Introduction to Responsive Design
  149. Урок 149. 00:10:01
    Design Systems
  150. Урок 150. 00:14:04
    Web Do's + Dont's
  151. Урок 151. 00:07:55
    Week 6 Project Introduction
  152. Урок 152. 00:09:04
    Navigation + Hero
  153. Урок 153. 00:04:13
    Hero Inspiration
  154. Урок 154. 00:05:33
    Hero Layout Variations
  155. Урок 155. 00:02:23
    Creating Animated GIFs for Hero Sections
  156. Урок 156. 00:00:31
    Final Hero Design
  157. Урок 157. 00:10:46
    Blog Section
  158. Урок 158. 00:02:33
    Blog Section Inspiration
  159. Урок 159. 00:03:26
    Optimizing Images for the Web
  160. Урок 160. 00:05:16
    Fun Fact Section
  161. Урок 161. 00:07:44
    Donation Cards
  162. Урок 162. 00:12:01
    Get Involved Section
  163. Урок 163. 00:04:54
    Logo Garden
  164. Урок 164. 00:04:20
    Finishing Homepage Design
  165. Урок 165. 00:08:56
    Donation Popup Part 1
  166. Урок 166. 00:09:26
    Donation Popup Part 2
  167. Урок 167. 00:12:26
    Finishing Donation Popup Flow
  168. Урок 168. 00:13:02
    Prototyping in Figma
  169. Урок 169. 00:23:58
    Industry Talks: Victoria Jung
  170. Урок 170. 00:04:59
    Week 7 Introduction
  171. Урок 171. 00:04:12
    Designing with Code Introduction
  172. Урок 172. 00:08:34
    What is a website, anyway?
  173. Урок 173. 00:03:10
    Content and Style in Figma
  174. Урок 174. 00:09:35
    HTML + CSS
  175. Урок 175. 00:05:45
    Adding Links
  176. Урок 176. 00:04:46
    Grouping Tags
  177. Урок 177. 00:05:19
    Intro to CSS Grid
  178. Урок 178. 00:05:51
    Intro to Flexbox
  179. Урок 179. 00:04:02
    Fixed Positioning
  180. Урок 180. 00:04:35
    Hover States
  181. Урок 181. 00:05:48
    Responsive Design + Media Queries
  182. Урок 182. 00:03:28
    SEO + Accessibility Basics
  183. Урок 183. 00:06:57
    Developer Review: The Beach Collective
  184. Урок 184. 00:06:26
    Mobile Best Practices: Interactions
  185. Урок 185. 00:03:06
    Mobile Best Practices: Adapting Your Content
  186. Урок 186. 00:09:58
    Mobile Best Practices: Images
  187. Урок 187. 00:03:46
    Mobile Best Practices: Typography
  188. Урок 188. 00:08:24
    Mobile Best Practices: Navigation
  189. Урок 189. 00:08:34
    Project: Mobile Grid + Getting Started with Figma Mirror
  190. Урок 190. 00:04:25
    Project: Mobile Navigation
  191. Урок 191. 00:08:12
    Project: Mobile Hero + Sticky Nav
  192. Урок 192. 00:04:51
    Project: Setting up Mobile Type Scale
  193. Урок 193. 00:04:10
    Project: About Section
  194. Урок 194. 00:07:55
    Project: Blog + Designing Lists for Mobile
  195. Урок 195. 00:03:27
    Project: Quote
  196. Урок 196. 00:09:37
    Project: Donate + Designing Mobile Carousels
  197. Урок 197. 00:13:45
    Project: Get Involved + Designing Mobile Grids
  198. Урок 198. 00:01:58
    Project: Mobile Logo Garden
  199. Урок 199. 00:02:54
    Project: Finishing Mobile Homepage
  200. Урок 200. 00:15:21
    Project: Donation Screen + Mobile Form UI
  201. Урок 201. 00:05:10
    Finishing Up with a Mobile Prototype
  202. Урок 202. 00:15:16
    Designer Spotlight — Carolyn Zhang
  203. Урок 203. 00:01:07
    Week 8 Intro
  204. Урок 204. 00:01:18
    Capstone Brief
  205. Урок 205. 00:07:59
    Step 1 — Finding your book
  206. Урок 206. 00:01:47
    Step 2 — Determining your project
  207. Урок 207. 00:06:55
    Project Ideas
  208. Урок 208. 00:01:08
    Step 3 — Designing your project
  209. Урок 209. 00:01:35
    Step 4 — Documenting your process
  210. Урок 210. 00:02:07
    Step 5 — Writing your case study
  211. Урок 211. 00:04:11
    Our Project: Picking our book
  212. Урок 212. 00:10:49
    Our Project: Designing Camp Mate
  213. Урок 213. 00:00:51
    Camp Mate Prototype
  214. Урок 214. 00:09:56
    Our Project: Camp Mate case study
  215. Урок 215. 00:12:46
    Case Study Examples
  216. Урок 216. 00:09:47
    What's Next?