Designing and Prototyping Interfaces with Figma: Learn essential UX/UI design principles by creating interactive prototypes for mobile, tablet, and desktop

by Fabio Staiano

Overview

A driving force of the design tools market, Figma makes it easy to work with classic design features while enabling unique innovations and opening up real-time collaboration possibilities. It comes as no surprise that many designers decide to switch from other tools to Figma.
In this book, you'll be challenged to design a user interface for a responsive mobile application having researched and understood user needs. You'll become well-versed with the process in a step-by-step manner by exploring the theory first and gradually moving on to practice. You'll begin your learning journey by covering the basics of user experience research with FigJam and the process of creating a complete design using Figma tools such as Components, Variants, Auto Layout, and much more. You'll also learn how to prototype your design and explore the potential of community resources such as templates and plugins.
By the end of this Figma book, you'll have a solid understanding of the user interface workflow, managing essential Figma tools, and organizing your workflow.

Product Details

ISBN-13:	9781800561922
Publisher:	Packt Publishing
Publication date:	03/16/2022
Sold by:	Barnes & Noble
Format:	eBook
Pages:	382
File size:	30 MB
Note:	This product may take a few minutes to download.

About the Author

Fabio Staiano is an experienced interface designer and Figma Community Advocate from Italy. After having been part of the creative agency Geko for several years, he later became a partner, creating digital products for well-known brands and running local events for the creative community. He then began his career in education in 2016, at The Guru Lab, teaching students about user interface and web design. In 2019, he decided to face new challenges by deepening his development skills at the Apple Developer Academy, where he specializes in frontend development and publishes various apps and boilerplate. Currently, he works as a consultant for IT projects and teaches at private design schools.

Table of Contents

Table of Contents

1. Exploring Figma and Transitioning from Other Tools
2. Structuring Moodboards, Personas, and User Flows within FigJam
3. Getting to Know Your Design Environment
4. Wireframing a Mobile-First Experience Using Vector Shapes
5. Designing Consistently Using Grids, Colors, and Typography
6. Creating a Responsive Mobile Interface Using Auto Layout
7. Building Components and Variants in a Collaborative Workspace
8. User Interface Design on Tablet, Desktop, and the Web
9. Prototyping with Transitions, Smart Animate, and Interactive Components
10. Testing and Sharing your Prototype on Browsers and Real Devices
11. Exporting Assets and Managing the Handover Process
12. Discovering Plugins and Resources in the Figma Community