Этот материал находится в платной подписке. Оформи премиум подписку и смотри или слушай Complete Web & Mobile Designer: UI/UX, Figma, +more, а также все другие курсы, прямо сейчас!
Премиум
  1. Урок 1. 00:03:17
    Complete Web & Mobile Design: Zero to Mastery
  2. Урок 2. 00:07:01
    Course Outline
  3. Урок 3. 00:04:14
    Meeting The Client
  4. Урок 4. 00:01:56
    The 2 Paths
  5. Урок 5. 00:01:29
    Exercise: Building Your Logo
  6. Урок 6. 00:06:54
    Designer vs Developer
  7. Урок 7. 00:07:07
    Skills To Be A Top Designer
  8. Урок 8. 00:03:28
    Introduction To Sketching
  9. Урок 9. 00:07:06
    The Sketching Process
  10. Урок 10. 00:08:06
    Sketching User Flows
  11. Урок 11. 00:05:50
    Sketching User Flows 2
  12. Урок 12. 00:09:50
    Sketching User Flows 3
  13. Урок 13. 00:10:03
    Sketching User Flows 4
  14. Урок 14. 00:08:02
    Sketching Tips
  15. Урок 15. 00:08:00
    How To Stay Inspired
  16. Урок 16. 00:13:48
    How To Find Inspiration
  17. Урок 17. 00:01:35
    Intro to Figma: Education Plans and Signup
  18. Урок 18. 00:00:57
    Intro to Figma: Introduction
  19. Урок 19. 00:00:33
    Intro to Figma: Where to use Figma
  20. Урок 20. 00:02:21
    Figma UI: File Browser
  21. Урок 21. 00:01:32
    Figma UI: Files
  22. Урок 22. 00:05:32
    Figma UI: Toolbar
  23. Урок 23. 00:04:07
    Figma UI: Left Sidebar
  24. Урок 24. 00:04:25
    Figma UI: Right Sidebar
  25. Урок 25. 00:04:39
    Shapes and Tools: Working with Containers
  26. Урок 26. 00:05:42
    Shapes and Tools: Basic Shapes and Boolean Operations
  27. Урок 27. 00:02:50
    Designing in Figma: Images
  28. Урок 28. 00:04:05
    Designing in Figma: Getting Started with Text
  29. Урок 29. 00:02:51
    Designing in Figma: Constraints
  30. Урок 30. 00:06:00
    Designing in Figma: Using Auto Layout
  31. Урок 31. 00:01:41
    Resources and Collaboration: Community Files
  32. Урок 32. 00:02:43
    Resources and Collaboration: Community Plugins
  33. Урок 33. 00:03:25
    Resources and Collaboration: Sharing and Comments
  34. Урок 34. 00:02:36
    What We Are Going to Learn
  35. Урок 35. 00:02:16
    Exercise: Create a Quick Logo Using Shapes
  36. Урок 36. 00:05:38
    Exercise: Autolayout Buttons
  37. Урок 37. 00:03:08
    Exercise: Responsive Navigation
  38. Урок 38. 00:04:16
    Exercise: Responsive Text
  39. Урок 39. 00:03:13
    Exercise: Imagery and Gradients
  40. Урок 40. 00:03:16
    Exercise: Layout and Responsiveness
  41. Урок 41. 00:01:03
    Assignment: Create Complex Interactive Components
  42. Урок 42. 00:05:12
    User Flows Explained
  43. Урок 43. 00:02:28
    The DOs and DON'Ts
  44. Урок 44. 00:02:07
    What We Are Going To Build
  45. Урок 45. 00:06:55
    Reusable User Flow Assets
  46. Урок 46. 00:10:59
    User Flows in Figma (Onboarding)
  47. Урок 47. 00:08:55
    User Flows in Figma (Search)
  48. Урок 48. 00:01:45
    Introduction To Sitemaps
  49. Урок 49. 00:04:17
    Creating A Basic Sitemap
  50. Урок 50. 00:01:19
    What We Are Going To Learn
  51. Урок 51. 00:09:33
    Reusable Sitemap Assets
  52. Урок 52. 00:08:52
    Sitemaps in Figma (The Top Layer)
  53. Урок 53. 00:05:54
    Sitemaps in Figma (Digging Deeper)
  54. Урок 54. 00:04:40
    Sitemaps in Figma (Digging Deeper Cont.)
  55. Урок 55. 00:07:44
    Tips for Creating Great Sitemaps
  56. Урок 56. 00:03:07
    What Is A Wireframe?
  57. Урок 57. 00:06:52
    How To Create A Wireframe
  58. Урок 58. 00:06:44
    What We Are Going To Learn
  59. Урок 59. 00:03:57
    Figma Check In (Basic Button Component)
  60. Урок 60. 00:05:35
    Figma Check In (Variants)
  61. Урок 61. 00:05:33
    How To Use Our Wireframe Components
  62. Урок 62. 00:13:03
    Wireframes (Home)
  63. Урок 63. 00:07:05
    Wireframes (Cart)
  64. Урок 64. 00:05:48
    Wireframes (Profile)
  65. Урок 65. 00:01:20
    What We Are Going to Learn
  66. Урок 66. 00:01:57
    Figma Check In (Prototyping in Figma - Intro)
  67. Урок 67. 00:05:06
    Prototyping in Figma (Flows and Starting Points)
  68. Урок 68. 00:02:52
    Prototyping in Figma (Connections)
  69. Урок 69. 00:02:58
    Prototyping in Figma (Interactions)
  70. Урок 70. 00:03:31
    Prototyping in Figma (Animations)
  71. Урок 71. 00:03:13
    Prototyping in Figma (Prototype Settings)
  72. Урок 72. 00:05:30
    Prototyping in Figma (Prototype Presentation)
  73. Урок 73. 00:03:41
    Project (Navigation)
  74. Урок 74. 00:06:17
    Project (Removing an Item from Your Wishlist)
  75. Урок 75. 00:06:14
    Project (Finding a Product)
  76. Урок 76. 00:02:57
    Exercise: Imposter Syndrome
  77. Урок 77. 00:04:03
    Constructive Feedback
  78. Урок 78. 00:02:59
    Feedback Drives Better Design
  79. Урок 79. 00:01:34
    Recap: What Did We Learn?
  80. Урок 80. 00:04:04
    What Is A Grid?
  81. Урок 81. 00:05:57
    Grid Basics
  82. Урок 82. 00:00:52
    What We Are Going to Learn
  83. Урок 83. 00:04:33
    Figma Check In (Fixed and Fluid Grids)
  84. Урок 84. 00:05:23
    Figma Check In (Breakpoints)
  85. Урок 85. 00:04:29
    Figma Check In (Grid Style)
  86. Урок 86. 00:06:57
    Project (Mobile Layout Grid)
  87. Урок 87. 00:04:52
    Project (Desktop Layout Grids)
  88. Урок 88. 00:06:33
    Simple Rules to Follow
  89. Урок 89. 00:03:22
    Serifs
  90. Урок 90. 00:03:42
    Sans Serifs
  91. Урок 91. 00:04:39
    Display & Mono
  92. Урок 92. 00:01:40
    Picking Typefaces
  93. Урок 93. 00:00:49
    What We Are Going to Learn
  94. Урок 94. 00:07:36
    Figma Check In (Text Properties)
  95. Урок 95. 00:09:56
    Exercise (Elevating a Brand)
  96. Урок 96. 00:07:14
    Exercise (Typeface Scenarios)
  97. Урок 97. 00:04:38
    Exercise (Google Fonts)
  98. Урок 98. 00:05:47
    Project (Typeface Exploration)
  99. Урок 99. 00:06:36
    Project (Pairing Font Families)
  100. Урок 100. 00:06:36
    Project (Headings, Body and Labels)
  101. Урок 101. 00:04:30
    Project (Typeface System)
  102. Урок 102. 00:07:13
    Figma Check In (Text Styles)
  103. Урок 103. 00:03:54
    Color Schemes
  104. Урок 104. 00:02:45
    Important Questions To Ask
  105. Урок 105. 00:02:56
    Creating Color Palettes
  106. Урок 106. 00:00:59
    What We Are Going to Learn
  107. Урок 107. 00:05:00
    Figma Check In (Paints)
  108. Урок 108. 00:10:37
    Exercise (Expanding Upon a Strict Color Palette)
  109. Урок 109. 00:04:00
    Exercise (Creating a Color Palette)
  110. Урок 110. 00:06:05
    Figma Check In (Color Styles)
  111. Урок 111. 00:08:21
    Exercise (Using Color Styles)
  112. Урок 112. 00:06:37
    Project (Primary and Neutrals)
  113. Урок 113. 00:06:32
    Project (Accents)
  114. Урок 114. 00:03:38
    Visual Assets Introduction
  115. Урок 115. 00:01:00
    What We Are Going to Learn
  116. Урок 116. 00:03:16
    Figma Check In (Image Plugins)
  117. Урок 117. 00:04:21
    Figma Check In (Image Styles)
  118. Урок 118. 00:02:40
    Figma Check In (Masks)
  119. Урок 119. 00:09:08
    Exercise (Image Exploration)
  120. Урок 120. 00:08:34
    Exercise (Text and Imagery Working Together)
  121. Урок 121. 00:03:50
    Figma Check In (Illustration Plugins)
  122. Урок 122. 00:08:06
    New Exercise (Adding Illustrations to Your Designs)
  123. Урок 123. 00:02:21
    Figma Check In (Icon Plugins)
  124. Урок 124. 00:05:06
    Figma Check In (Pen Tool)
  125. Урок 125. 00:11:06
    Exercise (Custom Icons with the Pen Tool)
  126. Урок 126. 00:04:20
    What Are Forms + UI Elements?
  127. Урок 127. 00:01:54
    What We Are Going to Learn
  128. Урок 128. 00:07:09
    Best Practices (Forms)
  129. Урок 129. 00:05:25
    Best Practices (Basic and Advanced Inputs)
  130. Урок 130. 00:11:31
    Best Practices (Inputs)
  131. Урок 131. 00:03:53
    Best Practices (Buttons)
  132. Урок 132. 00:04:11
    Figma Check In (Component Properties)
  133. Урок 133. 00:02:14
    Properties vs. Variants
  134. Урок 134. 00:05:19
    Figma Check In (Button Component Properties)
  135. Урок 135. 00:05:21
    Figma Check In (Button Variants)
  136. Урок 136. 00:06:26
    Figma Check In (Combining Components)
  137. Урок 137. 00:06:52
    Figma Check In (Form Component Possibilities)
  138. Урок 138. 00:10:39
    Project (Registration Flow Part 1)
  139. Урок 139. 00:08:25
    Project (Registration Flow Part 2)
  140. Урок 140. 00:06:43
    Project (Registration Flow Part 3)
  141. Урок 141. 00:02:31
    What Is Accessibility?
  142. Урок 142. 00:02:52
    Assistive Technologies
  143. Урок 143. 00:04:31
    Visual Patterns For Accessibility
  144. Урок 144. 00:06:25
    Tools To Make Your Design Accessible
  145. Урок 145. 00:06:43
    Visual Patterns For Accessibility Part 2
  146. Урок 146. 00:06:01
    What Are Design Patterns
  147. Урок 147. 00:02:25
    Why Are Design Patterns Valuable
  148. Урок 148. 00:04:30
    How To Apply Design Patterns
  149. Урок 149. 00:05:40
    Analyzing Design Patterns
  150. Урок 150. 00:06:14
    Dissecting And Choosing Design Patterns
  151. Урок 151. 00:06:59
    Mobile Design Best Practices Part 1
  152. Урок 152. 00:11:11
    Mobile Design Best Practices Part 2
  153. Урок 153. 00:01:48
    What We Are Going to Learn
  154. Урок 154. 00:04:58
    Design Fidelity
  155. Урок 155. 00:13:21
    Visual Exploration (Navigation)
  156. Урок 156. 00:08:57
    Visual Exploration (Buttons)
  157. Урок 157. 00:02:43
    Figma Check In (Effect Styles)
  158. Урок 158. 00:11:11
    Visual Exploration (Product Cards)
  159. Урок 159. 00:08:52
    Visual Exploration (Text Cards)
  160. Урок 160. 00:13:05
    Screen Design (Home)
  161. Урок 161. 00:07:36
    Screen Design (Product Page)
  162. Урок 162. 00:03:37
    Misconceptions of Motion Design
  163. Урок 163. 00:03:21
    Motion Supports Usability
  164. Урок 164. 00:05:16
    Narrative and Mental Models
  165. Урок 165. 00:01:34
    What is a Microinteraction?
  166. Урок 166. 00:01:58
    The Structure of a Microinteraction
  167. Урок 167. 00:02:04
    Not Every Element is a Microinteraction!
  168. Урок 168. 00:04:33
    How Microinteractions Impact User Experiences
  169. Урок 169. 00:01:42
    What We Are Going To Learn
  170. Урок 170. 00:02:08
    Figma Check In (Intro to Smart Animate)
  171. Урок 171. 00:03:51
    Figma Check In (Smart Animate Properties)
  172. Урок 172. 00:05:22
    Exercise (Parallax)
  173. Урок 173. 00:05:14
    Exercise (New Message)
  174. Урок 174. 00:05:18
    Exercise (Overlays)
  175. Урок 175. 00:04:44
    Figma Check In (Interactive Components)
  176. Урок 176. 00:07:55
    Exercise (Interactive Buttons)
  177. Урок 177. 00:05:20
    Project (Parallax Welcome Screen)
  178. Урок 178. 00:07:20
    Project (Drag Onboarding)
  179. Урок 179. 00:06:53
    Project (Cart Overlay)
  180. Урок 180. 00:12:57
    Project (Button Microinteraction)
  181. Урок 181. 00:01:08
    What We Are Going to Learn
  182. Урок 182. 00:03:45
    Foundational Styles and Components vs. Product Specific Components
  183. Урок 183. 00:03:29
    Building Fidelity and Organizing Potential Components and Styles
  184. Урок 184. 00:06:24
    Foundational Styles and Components
  185. Урок 185. 00:07:19
    Components (Buttons)
  186. Урок 186. 00:08:42
    Components (Cards)
  187. Урок 187. 00:06:33
    Components (Headers)
  188. Урок 188. 00:06:09
    Components (Inputs)
  189. Урок 189. 00:04:43
    Components (List Items)
  190. Урок 190. 00:08:28
    Components (Navigation)
  191. Урок 191. 00:05:42
    Components (Misc. Elements)
  192. Урок 192. 00:01:44
    What We Are Going to Learn
  193. Урок 193. 00:06:19
    Working Towards Our Final Designs
  194. Урок 194. 00:06:01
    Execution (Introduction Screen)
  195. Урок 195. 00:10:09
    Execution (Onboarding Screens)
  196. Урок 196. 00:16:03
    Execution (Registration Screens)
  197. Урок 197. 00:10:03
    Execution (Home Screen)
  198. Урок 198. 00:08:15
    Execution (Wishlist Screens)
  199. Урок 199. 00:10:03
    Execution (Profile Screen)
  200. Урок 200. 00:14:51
    Execution (Cart and Checkout)
  201. Урок 201. 00:09:48
    Prototypes (Registration)
  202. Урок 202. 00:06:07
    Prototypes (Adding to Cart)
  203. Урок 203. 00:05:11
    Prototypes (Checkout)
  204. Урок 204. 00:04:19
    Prototypes (Lottie Files Plugin)
  205. Урок 205. 00:07:53
    Prototypes (Search and Filters)
  206. Урок 206. 00:05:03
    The Product Alignment Canvas
  207. Урок 207. 00:08:31
    Project Goals
  208. Урок 208. 00:08:40
    Target Users
  209. Урок 209. 00:10:23
    User Journey Map
  210. Урок 210. 00:04:33
    Risky Assumptions
  211. Урок 211. 00:05:57
    What is a User Story Map?
  212. Урок 212. 00:07:41
    Creating a User Story Map
  213. Урок 213. 00:01:12
    Is Bruno Happy?
  214. Урок 214. 00:03:42
    Project Handoff
  215. Урок 215. 00:01:18
    Thank You!
  216. Урок 216. 00:09:52
    How To Export And Place Designs
  217. Урок 217. 00:10:58
    Content For Your Portfolio
  218. Урок 218. 00:04:59
    Where To Host Your Web Portfolio
  219. Урок 219. 00:12:58
    Initial Setup - Figma Handoff
  220. Урок 220. 00:09:25
    Build UI - Adding Image Assets
  221. Урок 221. 00:09:18
    Build UI - Styling Image Assets