Book Image

Designing and Prototyping Interfaces with Figma

By : Fabio Staiano
Book Image

Designing and Prototyping Interfaces with Figma

By: Fabio Staiano

Overview of this book

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.
Table of Contents (17 chapters)
1
Part 1: Introduction to Figma and FigJam
6
Part 2: Exploring Components, Styles, and Variants
11
Part 3: Prototyping and Sharing

What's next?

As you can see, this chapter was full of all sorts of new information for you, but if you have reached this point, you can be proud of yourself. Now, you've got an idea of what a wireframe is and why it's worth spending enough time on it. However, the real purpose of the wireframe isn't just filling the screen-sized frames with shapes that represent your future components. The essential meaning of this part is to make sure the flow you came up with during the UX design phase is the best one for your user. There is only one way to find out – to test this flow on a group of people belonging to the reference target. To do this, you have to make your wireframe live by prototyping it so that you can show and test the dynamic flow during user testing sessions.

The testing process is very important and must be taken very seriously; otherwise, you risk missing structural or usability issues. So, you should be prepared to review and modify your user...