Sign In Start Free Trial
Account

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying Designing and Prototyping Interfaces with Figma
  • Table Of Contents Toc
Designing and Prototyping Interfaces with Figma

Designing and Prototyping Interfaces with Figma

By : Fabio Staiano
4.3 (3)
close
close
Designing and Prototyping Interfaces with Figma

Designing and Prototyping Interfaces with Figma

4.3 (3)
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)
close
close
1
Part 1: Introduction to Figma and FigJam
6
Part 2: Exploring Components, Styles, and Variants
11
Part 3: Prototyping and Sharing

Chapter 1: Exploring Figma and Transitioning from Other Tools

Whether you are taking your first steps in design or already have some experience in the field, the tool you choose plays a big role in your day-to-day workflow. Of course, you need to know all the functions to use it professionally for your own purposes, but it is equally important to understand what ideology your design tool has, what benefits it gives you personally, and whether it develops and grows with you professionally.

Figma is one of the most advanced design tools out there and is constantly updating and releasing new features and capabilities. As a result, it has become not only a tool but also an irreplaceable assistant for many designers. In this chapter, you will discover how Figma manages to consistently push the boundaries and maintain its reputation to be many designers' favorite tool.

Figma is open to everyone and very flexible in many ways. It offers a variety of plans, including a free one, which is perfect for beginners in design. Figma also has web and desktop applications, each of which has its own benefits. This chapter contains detailed information about all of these and will help you to make your own choices. Here, you will also learn how to switch to Figma from other tools, namely Sketch and Adobe XD. 

After that, we will look at how Figma presents you with the welcome screen, where you will explore all the buttons, toolbars, and areas, such as drafts, teams, Projects, and Community. It may seem overwhelming at first, but don't worry, we'll go over all the topics step by step. So, by the end of this chapter, you'll be ready to start putting Figma into practice!

In this chapter, we are going to cover the following main topics:

  • Introducing Figma and its mission
  • Difference between the desktop and web apps
  • Transition to Figma from Sketch and Adobe XD
  • Everything about the welcome screen
CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
Designing and Prototyping Interfaces with Figma
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected

Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon