Figma UI用户体验设计核心要点训练视频教程
- 1. Introduction
- 1. Introduction
- 2. Basics
- 1. The Starter Screen
- 2. How to Install Project Files
- 3. How to Move in Figma
- 4. Lines & Arrows
- 5. Move & Scale Tools
- 6. Rectangle Tool
- 7. Polygon Tool
- 8. Ellipse Tool
- 9. Star Tool
- 10. Groups vs Frames
- 11. Typography Basics
- 3. Intermediate
- 1. Image Editing
- 2. Colors & Blend Modes
- 3. Mask Tool
- 4. Drop Shadow
- 5. Pen Tool
- 6. Frames, Positioning & Alignment
- 7. Resize Frames without Resizing Content
- 8. Strokes
- 9. Background Blur
- 10. Copying Style Properties
- 11. Overlay Text Effect
- 12. Outline Stroke
- 4. Advanced
- 1. Autolayout
- 2. Layout Grids
- 3. Intro to Components
- 4. When to Use Components
- 5. Intro to Variants
- 6. Responsive Workflows
- 7. Shortcuts
- 8. Slice Tool
- 9. Brush Stroke
- 10. Figma to PDF
- 11. Smart Animate & Delays
- 5. Collaboration
- 1. How to Export Assets
- 2. Sharing Work
- 3. Comments
- 4. Intro to Figjam
- 5. How to Install Plugins
- 6. Dev Mode
- 7. Developer Hand-off
- 8. Set up a Team Project
- 6. Prototypes & Animations
- 1. Prototyping 101
- 2. How to Use Sections in Figma
- 3. Smart Animate 101
- 4. Smart Animate Project
- 7. Design Systems
- 1. What is a Design System
- 2. How to Structure a Design System like a Pro
- 3. Color Styles
- 4. Typography Styles
- 5. Iconography
- 6. Shadows, Grids, Spacing and more
- 7. Fortune 500 Design Systems - Analysis & Freebies
- 8. Atomic Design Principles 101
- 8. Let's Build a Landing Page from Scratch
- 1. Discovery Call and User Personas
- 2. Content Architecture
- 3. Wireframe Foundations
- 4. Wireframe Progress
- 5. UI Design Foundations
- 6. Social Proof and Features
- 7. Content Features
- 8. Pricing UI
- 9. Contact Us
- 10. Footer
- 9. Web App with Autolayout
- 1. Intro to the Project
- 2. Side Menu
- 3. Header
- 4. Head
- 5. Currency Components
- 6. Filters Menu
- 10. Essential Plugins
- 1. Pitch Decks Design & Export to Slides or Powerpoint
- 2. Text around a Path
- 3. Lorem Ipsum
- 4. Variable Width Strokes
- 5. Mesh Gradients
- 6. Content Reel
- 7. Editing Images with PhotoPea
- 8. Html to Figma
- 9. Unsplash
- 10. Remove Backgrounds Fast
- 11. Image to SVG
- 11. Additional Resources
- 1. How to Install a Font in Figma
- 2. Publish Files to Figma Community
- 3. Figma File Thumbnails
- 4. Image Optimization for the Web
- 5. Figma to WebP
- 6. Top Sites for Royalty Free Images
- 7. Figma Files Management 101