UX Design with Figma
Programming
Book Details
Book Title
UX Design with Figma: User-Centered Interface Design and Prototyping with Figma (Design Thinking)
Author
Tom Green, Kevin Brandon
Publisher
Apress
Publication Date
2024
ISBN
9798868803239
Number of Pages
585
Language
English
Format
File Size
17.0 MB
Subject
UI / UX Design
Table of Contents
- Contents
- About the Authors
- About the Technical Reviewer
- Acknowledgments
- Introduction
- Chapter 1: Learning the Figma Interface
- Figma and the UX Process
- Chapter 2: Adding Content to Figma Screens
- Vectors and Bitmaps
- Bitmaps and Figma
- Scaling Factors
- SVG Images and Figma
- Figma and Video
- Preparing Video for Figma
- Typography and Figma
- Your Turn
- You Have Learned
- Chapter 3: Figma and the UX Process
- What Exactly Is a Prototype
- Determining the Platform
- Building a Team in Figma
- Sharing and Collaboration
- Figma and User Testing
- Iteration and the “Messy” UX Design Process
- Accessibility and Inclusion in Figma
- Adding Plug-ins in Figma
- Using the Accessibility Plug-ins
- You Have Learned
- Chapter 4: Creating UX Design Documentation
- Using the Figma Presentation Mode
- Brainstorming with FigJam
- Creating Personas
- Creating a User Flow Diagram
- Feedback and Iteration
- You Have Learned
- Chapter 5: Building Low-Fidelity Prototypes
- What Is a Low-Fidelity Wireframe?
- The Case for and Against Wireframing
- Wireframing and the UX Design Process
- From Content Wireframe to Lo-Fi Wireframe
- Create Wireframes Using a Wireframing Kit
- The Interactive Wireframe
- Your Turn: Wireframe a Login Sequence Using FigJam
- You Have Learned
- Chapter 6: Building Medium-Fidelity Prototypes
- Lean UX
- Agile
- Straight to Code
- What Is a Medium-Fidelity Prototype
- Installing and Using Imaging Plug-ins in Figma
- Fonts and Figma
- Color and Figma
- Create a Scrim Using a Gradient
- Adding Effects to Graphics
- Using Auto Layout in Figma
- Your Turn: Create a Medium-Fidelity Mobile App Location Card
- You Have Learned
- Chapter 7: Interactivity Fundamentals
- The Basics of Adding Interactivity in Figma
- Your Turn: Create Interactivity Using Components and Variants
- You Have Learned
- Chapter 8: Microinteractions in Figma
- Interactivity and Motion
- Playing with Time and Motion in Figma
- The Principles of UX in Motion
- Applying the Transformation Principle in Figma
- Create a Scrolling Behavior
- Your Turn
- You Have Learned
- Chapter 9: Design System Fundamentals
- The Single Source of Truth
- Where Do You Start?
- Take Stock of What You Have
- You Have Learned
- Chapter 10: Building Stuff
- Building an Image Carousel
- Create a Complex Carousel
- Create Video Controls
- Bonus Round: Create a Boolean Variable
- Animations Using LottieFiles
- Add Diversity with the Humaaans for Figma Plug-in
- You Have Learned
- Chapter 11: Developer Handoff
- Handoff Starts with User Testing
- Device Preview Using the Figma Mobile App
- Using the Figma Presentation Mode for Sign-Off
- What Is a Handoff?
- Preparing Assets for Handoff
- The X Factor of Raster Images
- Code Introspection
- The Design/Build Iteration Cycle
- You Have Learned
- Conclusion
- Index