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

Adjusting the interface for the web and desktop

In the previous section of the chapter, you created the interface of the tablet app, making it look like a native mobile app as much as possible. The next step is to move to bigger resolution screens, namely desktop and browsers. You always have to remember that web and desktop applications are completely different platforms. But aren't browsers part of the desktop, as well as smartphones and tablets? Let's clarify this point. Today, as stated earlier, development has really changed a lot. Year after year, application and website development have become more and more intersecting, and now thanks to scalable frameworks and programming languages, it is really difficult to draw a clear line between the two. So far, you have worked on the interface as if it were an application, but the application itself can be easily rendered in a browser and turned into a web application, with most of the functionality still present. A practical...